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


Related Query

More Query from same tag