search

Likbjorn / tag-cloud

Frontend representation for cloud of linked tags
MIT License
0 stars 0 forks source link

Shift mouse coordinates basepoint #13

Closed Cobolock closed 4 years ago

Cobolock commented 4 years ago

As for now SVG elements' zero point is SVG container's upper left corner, while mouse has its coordinates calculated from the upper left corner of the viewport. This leads to miscalculated coordinates shift when animating stuff.

Likbjorn commented 4 years ago

Can't push the branch now, so here are my notes about how to fix it.

Modify handleSimOnMouseMove() this way:

function handleSimOnMouseMove() {
  if (!d3.event.active) simulation.alphaTarget(0.3).restart();

  mouse.x = d3.mouse(this)[0];
  mouse.y = d3.mouse(this)[1];
}

d3.mouse(container) returns mouse position relative to container. Seems like it defaults to HTML page coordinates, if no container provided.

I would rather get rid of dedicated function and just do this to keep code shorter and cleaner:

svg.on("mousemove", function() {
    if (!d3.event.active) simulation.alphaTarget(0.3).restart();

    mouse.x = d3.mouse(this)[0];
    mouse.y = d3.mouse(this)[1];
})

Anyway this event handler is related only to SVG relative coordinates.