2013-12-15 22 views
19

画布的所有对象是否有办法明确选择所有出席的时间特定实例的对象。 这可以很容易地使用鼠标来选择全部。有没有像一个名为Select All以便单击它将使被选择的所有织物类型对象按钮代码解决方案,然后我可以将更改应用到整个使用canvas.getActiveGroup();是ActiveGroup和迭代。选择使用Fabric.js

回答

29

好问题。

有这个没有内置的方法,但是你需要做的东西沿着这些路线:

var objs = canvas.getObjects().map(function(o) { 
    return o.set('active', true); 
}); 

var group = new fabric.Group(objs, { 
    originX: 'center', 
    originY: 'center' 
}); 

canvas._activeObject = null; 

canvas.setActiveGroup(group.setCoords()).renderAll(); 

的代码应该是不言自明,而这几乎是什么引擎盖下发生的时候你使用鼠标,移+单击等

+2

功能同样一个完美的工作液。非常感谢@ kangax! – softvar

+4

如果一个组已存在,此代码将导致对象跳转位置。如果你在这个代码之前调用'canvas.deactivateAll();'它会起作用(并且不再需要''取出'canvas._activeObject = null;'这一行)。 – miyasudokoro

+0

嗨!有什么方法可以覆盖Shift +单击Ctrl +单击? –

0

这是更紧凑的形式:

canvas.setActiveGroup(new fabric.Group(canvas.getObjects())).renderAll(); 
+0

这使得我的对象的位置跳跃。 – miyasudokoro

0
selectAllObjects() { 
    this.canvas.discardActiveObject(); 
    this.canvas.discardActiveGroup(); 

    let objects: Fabric.Object[] = this.canvas.getObjects().map(function (object: Fabric.Object) { 
     return object.set('active', true); 
    }); 

    if (objects.length === 1) { 
     this.canvas.setActiveObject(objects[0]); 
    } else if (objects.length > 1) { 
     let group: Fabric.Group = new Fabric.Group(objects.reverse(), { 
      canvas: this.canvas 
     } as any); 
     group.addWithUpdate(null); 
     this.canvas.setActiveGroup(group); 
     group.saveCoords(); 
     this.canvas.trigger("selection:created", { 
      target: group 
     }); 
    } 

    this.canvas.renderAll(); 
} 
0

“canvas.setActiveGroup”不再是一个选项。它被擦除为2.0