我想使用这个http://jsfiddle.net/fabricjs/S9sLu/函数,其中对象可以被捕捉到网格,问题是我不希望它直接捕捉到线条但是当它接近时只有它.所以物体的运动是流动的,如果用户愿意,它可以被捕捉.
这是javascript,我认为它与Math.round()有关:
grid = 50; // Grid display part for (var i = 0; i < (600 / grid); i++) { canvas.add(new fabric.Line([ i * grid, 0, i * grid, 600], { stroke: '#ccc', selectable: false })); canvas.add(new fabric.Line([ 0, i * grid, 600, i * grid], { stroke: '#ccc', selectable: false })) } // Snapping part canvas.on('object:moving', function(options) { options.target.set({ left: Math.round(options.target.left / 50) * 50, top: Math.round(options.target.top / 50) * 50 }); });
关于如何实现这一目标的任何建议?
如果我理解正确,这个小调整应该照顾它:
canvas.on('object:moving', function(options) { if (Math.round(options.target.left / grid * 4) % 4 == 0 && Math.round(options.target.top / grid * 4) % 4 == 0) { options.target.set({ left: Math.round(options.target.left / grid) * grid, top: Math.round(options.target.top / grid) * grid }).setCoords(); } });
(或者让你朝着正确的方向前进,在鼠标上方顺畅地拍摄)
这是更新后的Plunker,https: //jsfiddle.net/rekrah/q0xe7yfz/ .
如果您需要任何进一步的帮助,请告诉我.