Fabric.js 设置不可选中
时间: 2023-02-18 22:21:53 浏览: 62
可以使用 "selectable: false" 属性来设置Fabric.js中的对象不可被选中。
例如:
```
var rect = new fabric.Rect({
left: 100,
top: 100,
width: 50,
height: 50,
fill: 'red',
selectable: false
});
```
这样创建出来的矩形将不能被选中.
相关问题
fabric.js 设置不能移动
要禁止fabric.js对象移动,你可以使用 `selectable` 和 `evented` 属性,将它们设置为 `false`。这样,对象将不会被选中并且不会响应鼠标事件。
示例代码:
```javascript
var rect = new fabric.Rect({
left: 100,
top: 100,
width: 50,
height: 50,
fill: 'red'
});
rect.set({
selectable: false,
evented: false
});
canvas.add(rect);
```
在这个例子中,我们创建了一个红色的矩形并将其添加到画布上。然后,我们设置 `selectable` 和 `evented` 属性为 `false`,这将禁用对象的移动和鼠标事件。
Fabric.js 获取所有元素,并设置不可选中
可以使用 canvas.getObjects() 方法获取 Fabric.js 画布中的所有元素,然后遍历这些元素,设置它们的 selectable 属性为 false。
例如:
```
var canvas = new fabric.Canvas('c');
// 添加元素到画布
var objects = canvas.getObjects();
for (var i in objects) {
objects[i].selectable = false;
}
canvas.renderAll();
```
相关推荐
![js](https://img-home.csdnimg.cn/images/20210720083646.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![.zip](https://img-home.csdnimg.cn/images/20210720083646.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)