0

I am using phrogz's solution for zooming and panning. Basically for a drawing pad.

The issue is, after zooming and panning, the mouse movement and the drawing movement have a bit of distance, i.e. I mouse the mouse somewhere, it draws elsewhere.

The blue represents my actual mouse movement Example

From his example, it may seem like he has handled it here, however, I am still facing the issue

     canvas.addEventListener('mousedown',function(evt){
      document.body.style.mozUserSelect = document.body.style.webkitUserSelect = document.body.style.userSelect = 'none';
      lastX = evt.offsetX || (evt.pageX - canvas.offsetLeft);
      lastY = evt.offsetY || (evt.pageY - canvas.offsetTop);
      dragStart = ctx.transformedPoint(lastX,lastY);
      dragged = false;
  },false);
  • Is this useful? https://stackoverflow.com/questions/20942586/controlling-the-pan-to-anchor-a-point-when-zooming-into-an-image – Nathan Hawks Aug 31 '20 at 08:48
  • This [Question's](https://stackoverflow.com/questions/17130395/real-mouse-position-in-canvas) selected answer worked for me. – Rahul Rathod Sep 20 '20 at 11:08

0 Answers0