score:0
i prepared a demo which shows how to add the plotline dynamically with the custom tooltip.
demo: https://jsfiddle.net/blacklabel/lyr82a5x/
btn.addeventlistener('click', function() {
chart.xaxis[0].addplotline({
value: 5.5,
color: 'red',
width: 2,
id: 'plot-line-1',
events: {
mouseover() {
let linebbox = this.svgelem.getbbox();
tooltip.style.display = 'block';
tooltip.style.left = linebbox.x + 'px';
},
mouseout() {
tooltip.style.display = 'none'
}
}
})
})
if something is unclear - feel free to ask.
api: https://api.highcharts.com/highcharts/xaxis.plotlines.events.mouseout
api: https://api.highcharts.com/class-reference/highcharts.axis#addplotline
Source: stackoverflow.com
Related Query
- How to add a vertical plot line in multiple line series and show the tooltip on Plot line in highchart
- How could you supply multiple series to a line chart in R shiny using highcharter package and without hardcoding the series?
- is it possible to add verical plot line and show the intersection with the series?
- Add a gap between the second and third series in a Highcharts column plot with four series displayed
- Highcharts shared tooltip for line series and scatter plot not working
- How to use add series and update methods in the high chart wrapper for angular?
- Highcharts show the same yAxis start and end value with multiple data series
- Highcharts - how to create multiple y axis and group the data series
- Highstock shared tooltip multiple series - show data for line when not on point
- how to plot multiple time series in the same graph with customized x axis
- How to show open, close, high and low in tooltip when the chart type is 'line' in highstocks?
- How to add vertical (and horizontal) line in highcharts scatter plot
- How to add multiple series dynamically and update its data dynamically
- Highcharts : How to remove the gap between series and vertical axis?
- How to make the full million value show up on y-axis and tooltip (Highcharts)
- How to change the series color and mark after I draw the line chart in highcharts?Does it has databound event?
- How to add white space in the line chart plot points?
- Highcharts Highstock How to Plot OHLC and Line Charts from One Set of Embedded CSV Data Using Series Map Tools?
- Highcharts- Javascript- How to show cumulative count of all the series of legend by default, and linked series inside a legend
- How to add the categories inside the slice and show the absolute number instead of the relative number
- How to highlight and show tooltip for correct (left / right) step point instead of the closest point
- HIGHCHARTS - Given a series with UNIX stamps and values pairs for the data, how do I show only the date for the first and last point on xAxis?
- How to add series to an empty chart without breaking the plot border in highcharts
- How to use the tooltip formatter and still display chart color (like it does by default)?
- How to get multiple series data in tooltip highcharts?
- How to display highchart series line marker symbol from tooltip formatter?
- How to show plot lines in the legend in Highcharts?
- Highcharts - How to hide series name and Y value in tooltip
- How do you add text to the bottom center of legend and bottom center of chart under legend?
- Highcharts - How to remove connecting line between fixed tooltip and point
More Query from same tag
- Live HighChart not displaying data
- Highstock displayed inconsistent
- Conflict between Highcharts and JQuery 1.8.2
- Spacing between horizontal bars in Highcharts
- Different node tooltips in highcharts sankey diagram
- Reverse one chart and leave the other unreversed - Synchronized highcharts
- How to place highcharter objects at same horizontal level using rmarkdown?
- Highcharts range selector doesn'n work
- Highcharts with react Error: "missingModule" with chart type of "timeline"
- Highchart yAxis opposite is not working in type datetime
- How to hide 0 values in multi chart in highcharts?
- Highchart is not working when I am fetching the axis values from database
- tooltip text is out of block in Chrome
- highcharts scatter 1 second update with user defined lables on x-axis for each point
- Highcharts Highmaps How to import data from google spreadsheet
- Drilldown event in Highcharts column chart
- problem Highchart Show/Hide data label on hover legend
- Highcharts conditional data label
- About HighStock multiple data tooltip
- Highchart line not showing
- How to remove margin gap in area spline chart for highcharts?
- R - leaflet - highcharter tooltip
- how do you make scrollbar work in highcharts
- display pie chart using highcharts api and mysql
- Highcharts charts don't resize properly on window resize
- Highchart word cloud in custom shape
- Highcharts candle/stacked column chart
- Highchart's heat-map plot not rendering correctly when x-axis is in time format (HH:MM)
- JS HighCharts.js Pie data in different format
- Control spacing between bars in Highcharts grouped bar chart