[Solved]-Mouseover Line on multiple charts when hover on single chart using D3-d3.js

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.