我的目标是防止FabricJS画布中的两个或多个矩形重叠.
想象一下两个矩形,它们具有位置和大小的信息,您可以在画布内拖放任何矩形.
如果矩形A足够接近矩形B,则矩形A的位置应该捕捉到矩形B的边缘.这应该适用于矩形B的任何边缘.顶点不必匹配,因为矩形的大小是可变的.
我有一个在一个维度(x轴)上捕捉的工作示例.
我最好的jsfiddle尝试
见jsfiddle.
但我需要它来处理两个维度上的矩形.我很确定,我的代码不足以管理它.
代码片段可能会有所帮助:
object.oCoords.tl.x //top-left corner x position. similar goes for top-right (tr), bottom-left (bl), bottom-right (br) and .y for y-position
mouse_pos = canvas.getPointer(e.e);
mouse_pos.x //pointer x.position
mouse_pos.y //pointer y.position
object.intersectsWithObject(targ) // object = dragged rectangle, targ = targeted rectangle
捕捉应适用于无限量的对象(不仅适用于两个矩形).