首页 > 解决方案 > 删除突出显示的蓝色矩形以在织物 js 中进行选择

问题描述

我正在开发一个涉及一些绘图功能的 Web 应用程序。我正在使用织物 js 进行画布操作 - http://fabricjs.com/。我现在正在实现使用鼠标绘制线条的功能。

在鼠标按下事件中,我添加了一个这样的新行

var points = [pointer.x, pointer.y, pointer.x, pointer.y];
                temp_line = new fabric.Line(points, {
                    strokeWidth: 1,
                    stroke: '#ff0000',
                    selectable: false
                });
                $canvas.add(temp_line)

当鼠标移动时,我正在根据当前指针位置更新线条,如下所示

temp_line.set({ x2: pointer.x, y2: pointer.y });
                $canvas.renderAll()

但问题是突出显示的矩形蓝色区域,如下所示。

在此处输入图像描述

如您所见,当我移动鼠标设置线的终点时,也绘制了蓝色矩形。如何禁用该蓝色选择?我也将 selectable 设置为 false。但它还没有消失。

标签: javascriptcanvasfabricjs

解决方案


$canvas.selection = false在画线模式下使用。


推荐阅读