如何在Fabric.js上获得鼠标坐标？

Question

我正在尝试读取Fabric.js鼠标点击的X坐标.

这是我的代码.控制台undefined每次都会记录.

var canvas = new fabric.Canvas('c1');
canvas.on('mouse:down', function(e){
  getMouse(e);
});

function getMouse(e) {
  console.log(e.clientX);
}

Answer 1

最好的解决方法是这种方法

执行:

function getMouseCoords(event)
{
  var pointer = canvas.getPointer(event.e);
  var posX = pointer.x;
  var posY = pointer.y;
  console.log(posX+", "+posY);    // Log to console
}

Answer 2

要在画布本身上根据设置的宽度和高度获取坐标,请使用layerX和layerY属性.

canvas.on('mouse:move', function(options) {
    console.log(options.e.layerX, options.e.layerY);
});