3

How can i calculate a specific position of canvas(e.g. Bottom Center) after changing the viewport position and Zoom Level ?

Right now i am trying something like this. But it only works for viewport.

canvasPoint = {
   left:(canvas.width/2)-canvas.viewportTransform[4],
   top: canvas.height-canvas.viewportTransform[5]
}

When i Zoom Out or Zoom In, i am unable to find the new center-bottom point for canvas.

1 Answer 1

3

You have to use the matrices. Your bottom - center corner has coordinates:

var p = {x: canvas.width/2, y: canvas.height};

Your Zoom and Panning is represented by the viewportTransfom:

var invertedMatrix = fabric.util.invertTransform(canvas.viewportTransform);
var transformedP = fabric.util.transformPoint(p, invertedMatrix);

And you should be done. transformedP should have the absolutes coordinates of the point that you see as center-bottom in a zoomed and/or panned view.

0

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.