fabric.js 选中多个元素时，将多选框的控制点取消

要取消 fabric.js 中多个元素的选择框的控制点，可以在设置选择框属性时将 "hasControls" 属性设置为 false。例如：

canvas.forEachObject(function(o) {
  o.set({hasControls: false});
});
canvas.renderAll();

这样就可以取消多选框的控制点了。

相关问题

fabric.js 多选中后取消多选框的控制点

### 回答1：
在 fabric.js 中，可以使用 canvas.discardActiveObject() 方法取消多选框的控制点。

例如：

canvas.discardActiveObject();
canvas.renderAll();

这会取消当前选中的对象，并重新渲染 canvas。

### 回答2：
在使用fabric.js进行多选时，点击选中物体后会在画布中显示控制点，用于调整选中物体的大小、旋转和位置。如果想要取消选中物体后不再显示控制点，可以通过代码进行实现。

在fabric.js中，可以通过设置选中物体的hasControls属性来控制是否显示控制点。默认情况下，hasControls属性的值为true，即会显示控制点。如果想要取消选中物体后不再显示控制点，可以将hasControls属性设置为false。

具体操作步骤如下：
1. 获取当前选中的所有物体，可以通过canvas.getActiveObjects()方法来获取当前选中的物体，返回一个数组。
2. 遍历获取到的选中物体数组，对每个物体设置hasControls属性为false。
3. 更新画布，可以通过canvas.requestRenderAll()方法来实现画布的刷新，使设置生效。

示例代码如下所示：

var selectedObjects = canvas.getActiveObjects();  // 获取当前选中的物体数组
selectedObjects.forEach(function(object) {
  object.set({
    hasControls: false  // 取消显示控制点
  });
});
canvas.requestRenderAll();  // 更新画布

以上代码将会把选中的物体的hasControls属性设置为false，取消显示控制点。通过调用canvas.requestRenderAll()方法刷新画布，设置生效。这样，当取消选中已选中的物体时，控制点将不再显示。

### 回答3：
在使用fabric.js进行多选（选中多个对象）后，如果想取消多选框的控制点，可以通过以下步骤实现。

首先，需要获取到多选框中的所有对象。可以使用`canvas.getActiveObjects()`方法获得被选中的多个对象数组。

然后，遍历这个对象数组，针对每个对象，使用`canvas.setControlsVisibility()`方法设置控制点的可见性。通过传递一个包含控制点名称的对象给`canvas.setControlsVisibility()`方法，可以控制对应控制点的可见性。

最后，调用`canvas.requestRenderAll()`方法实现画布的重新渲染，以显示没有控制点的多选框。

下面是一个示例代码：

// 获取被选中的多个对象
var selectedObjects = canvas.getActiveObjects();

// 取消多选框的控制点
selectedObjects.forEach(function(object) {
  // 可见性设置为false即为隐藏控制点
  canvas.setControlsVisibility(object, { tl: false, tr: false, br: false, bl: false, mtr: false });
});

// 重新渲染画布
canvas.requestRenderAll();

通过以上步骤，可以在fabric.js中实现多选中后取消多选框的控制点的效果。

fabric.js 多选时取消多选框的控制点

### 回答1：
可以在创建多选框时设置`hasControls`属性为`false`来取消多选框的控制点。例如：

var group = new fabric.Group(objects, {
  hasControls: false
});

或者在已经创建的多选框上设置:

group.hasControls = false;
group.setCoords();
canvas.renderAll();

### 回答2：
在fabric.js中，可以通过设置`hasControls`属性来控制对象的控制点是否可见。当多选时，取消多选框的控制点可以通过以下步骤实现：

1. 获取当前选中的对象列表。可以使用`canvas.getActiveObjects()`方法获取当前选中的多个对象。该方法返回一个包含所有选中对象的数组。

2. 遍历选中的对象列表，设置`hasControls`属性为`false`。可以使用`forEach`方法遍历选中的对象列表，然后对每个对象设置`hasControls`属性为`false`，即取消其控制点的显示。

3. 更新画布。在完成对选中对象设置`hasControls`属性后，需要更新画布以使更改生效。可以使用`canvas.requestRenderAll()`方法来更新画布。

以下是一个示例代码：

// 获取当前选中的对象列表
var selectedObjects = canvas.getActiveObjects();

// 遍历选中的对象列表，设置hasControls属性为false
selectedObjects.forEach(function(object) {
  object.set('hasControls', false);
});

// 更新画布
canvas.requestRenderAll();

以上代码将取消选中对象的控制点的显示。

请注意，该操作将取消所有选中对象的控制点的显示，如果想要只取消其中一部分对象的控制点显示，可以根据需要进行对象的选择和设置。

### 回答3：
在使用fabric.js进行多选操作时，取消多选框的控制点需要先获取选中的所有对象，然后逐个遍历对象的控制点并将其移除掉。

首先，可以使用`canvas.getActiveObjects()`方法获取当前选中的所有对象，返回一个对象数组。

然后，可以使用`forEachObject()`方法遍历这个数组，对每个对象执行后续操作。

在遍历的过程中，可以使用`setControlVisible()`方法设置对象的控制点的可见性。通过将`setControlVisible()`方法的参数设置为`false`，可以将控制点设置为不可见。

最后，为了使更新生效，需要调用`canvas.renderAll()`方法重新渲染画布。

下面是一个示例代码：

var canvas = new fabric.Canvas('canvas');

function hideControlPoints() {
  var activeObjects = canvas.getActiveObjects();
  activeObjects.forEach(function (object) {
    object.setControlVisible('mt', false); // hide top middle control point
    object.setControlVisible('mb', false); // hide bottom middle control point
    object.setControlVisible('mr', false); // hide right middle control point
    object.setControlVisible('ml', false); // hide left middle control point
    object.setControlVisible('mtl', false); // hide top left control point
    object.setControlVisible('tr', false); // hide top right control point
    object.setControlVisible('bl', false); // hide bottom left control point
    object.setControlVisible('br', false); // hide bottom right control point
  });
  
  canvas.renderAll();
}

以上代码将所选对象的控制点都设置为不可见，然后调用`canvas.renderAll()`方法重新渲染画布。这样，在多选时就会取消多选框的控制点。