score:0

I think there's a few problems here.

First, handleZoom repeatedly registers this.zoom on every zoom event. This is not necessary; the caller only needs to be registered once. This might be part of the reason that after zooming several times, the behaviour gets more extreme (as each zoom event is effectively being performed many times).

Second, updateZoom uses configScale but not yScale. The call to this.zoom.y binds d3's zoom to automatically update the domain of whatever is provided; we don't want to change the domain of the configScale but we do want to change the yScale domain.

Finally, it might be simpler to remove the double scaling and instead do an equivalent calculation on the data before giving it to the graph. This would simplify all your logic quite significantly.

Additionally, I found the approach of storing the zoom as the viewport bounds to be a little strange; consider storing the d3 zoom transform instead (and applying the transform when drawing the lines and axes).


Related Query

More Query from same tag