score:16
Accepted answer
Draggable points is not built-in into Highcharts but using the events and methods in the API it is possible to implement an editable line/column/scatter/area-chart (will only handle moving the point in y-direction so far). The following example uses mousemove
, mousedown
and mouseup
events to handle interaction.
- At
mousedown
the start y value is recorded if a point is focused. The y-axis.translate method is the key here, it will translate mouse position to the data domain. - At
mousemove
the focused point and tooltip is updated with the new value. - At
mouseup
the point is updated and a new eventdrop
is fired that updates the text in a status message.
Full example on jsfiddle. See also the feature request draggable points
score:2
This is now an available plugin on Highcharts: http://www.highcharts.com/plugin-registry/single/3/Draggable%20Points
Source: stackoverflow.com
Related Query
- Google Line Chart: drag to adjust value
- Highcharts reversed line chart is partially hidden at min value
- How to change space value between grid and yAxis in Highcharts line chart
- How to display last data point value in a tag on Y Axis in line chart of highChartjs
- highchart line chart last null value is not conected with line
- Google Charts, HighCharts or ChartJS Dual Axis Gantt Chart and Line Chart Visualization
- Highcharts line chart from a Google spreadsheet
- Stacked value with line chart with highcharts
- How to make Basic Line chart to show value
- Select dynamic value with tooltip on line chart (highcharts) in angular with material slider
- How to extend plot line value outside the grey area or outside the chart in highchart?
- Adjust the org chart line to be from/to the side of the node versus top or bottom for organization chart?
- Highchart line chart Tooltip showing index value instead of X-axis formatted label name
- Line chart Y axix value not show with single data
- Highcharts data from Google spreadsheet show line chart for one series
- How to set Highcharts chart maximum yAxis value
- HighCharts turn animation false for line chart
- How to display the value instead of percentage in a pie chart using jquery Highcharts
- Highcharts: Ensure y-Axis 0 value is at chart bottom
- remove grid line on chart
- Highcharts => Getting the id of a point when clicking on a line chart
- missing value in highcharts line graph results in no line, just points
- Gradient Fill on Line Chart (Highcharts)
- Highcharts: min value of y axis on the bottom of chart
- How to show a column with the value Zero in Column chart in Highcharts?
- Improve performance of Highcharts line chart
- Highchart Area Range chart with gradient that follows the line
- Highcharts - best way to handle and display zero (or negative) values in a line chart series with logarithmic Y axis
- Highcharts line chart won't display line chart in IE
- HighCharts Pie Chart Legend value alignment
More Query from same tag
- How to Populate Highchart using Json Object
- reuse of same object of chart in highcharts to minimize coding
- Highcharts doesn't display series with lots of data points
- Color selection based on a function for Highchart graphs?
- HighCharts. Adding series to yAxis with id
- How to add a newline to a Highchart tooltip?
- Rectangular selection in Highcharts columnrange
- Too long chart axis label title
- Highcharts sankey diagram node rearrangement
- Drag and drop plotline React-Highcharts
- Highcharts Angular - How to show group size in tooltip
- Change color of marker on hover points - Highcharts
- Unable to refer javascript array from another javascript file
- Highchart not showing 0 data correctly for pie chart
- Highcharts chart with 'datetime' xAxis - use categories on drilldown
- Show ticks on x axis in local time with highcharts api
- High chart date time conversion showing wrong values
- Highcharts dim unselected bars color on hover
- Calling Reset Zoom manually
- Constructing a combination chart with Highcharts
- Highchart event click runtime error in Ionic
- Highcharts x series group
- How does Similarweb create their PDF reports?
- Highcharts gray.js Theme cannot apply in my Highcharts spline?
- Get base64 image from public highchart export server
- Highcharts missing first date label on xAxis
- Highcharts - restrict sankey diagram to only one level
- Fixing flag min/max on Highchart graph
- How is inline style added to HTML elements by Highcharts?
- Dynamically update subtitle on Highcharts chart?