score:1

Accepted answer

I updated you jsfiddle to have something working. I used VSCode and reindented the code, I hope it is ok for you. What I did is:

  • Create an event dispatcher in the chart
  • Creating a callback on the dispatcher event
  • Select all lines
  • Set their position

The callback looks like this:

chart.onHover(function (x) {
    console.log(x);
    d3.selectAll('.hover-line')
        .select('line')
        .attr('x1', x)
        .attr('x2', x)
        .style('opacity', 1)
})

This works, but I don't like the fact that everything gets reselected every time. It should be possible to subscribe to the event directly when calling chart, but I can't wrap my head around it.


Related Query

More Query from same tag