如何使選擇所有的形狀，我的意思是形狀必須被激活，這樣我就不需要點擊任何形狀

Question

我曾嘗試下面的代碼：

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

但它選擇整個組作爲單一實體。

Answer 1

在這裏我有一個解決方案，在鼠標懸停我選擇鼠標指針傳遞的元素。

here is the fiddle

window.canvas = new fabric.Canvas('c', {perPixelTargetFind: true}); 
 

 
var shadow = { 
 
    color: 'rgba(0,0,0,0.6)', 
 
    blur: 20,  
 
    offsetX: 10, 
 
    offsetY: 10, 
 
    opacity: 0.6, 
 
    fillShadow: true, 
 
    strokeShadow: true 
 
} 
 

 
var rect = new fabric.Rect({ 
 
     left: 120, 
 
     top: 100, 
 
     fill: "#FF0000", 
 
     stroke: "#000", 
 
     width: 100, 
 
     height: 100, 
 
     strokeWidth: 10, 
 
     opacity: .8  
 
    }); 
 

 

 
var rect1 = new fabric.Rect({ 
 
     left: 0, 
 
     top: 100, 
 
     fill: "#FF0000", 
 
     stroke: "#000", 
 
     width: 100, 
 
     height: 100, 
 
     strokeWidth: 10, 
 
     opacity: .8  
 
    }); 
 

 
canvas.on('mouse:move', function(e){ 
 
\t console.log('over1',e.target) 
 
    if(e.target && e.target !== canvas.getActiveObject()) 
 
    canvas.setActiveObject(e.target) 
 
}) 
 

 
rect.setShadow(shadow); 
 
canvas.add(rect); 
 
canvas.add(rect1);

<canvas id="c" width="300" height="300"></canvas>

here is the fiddle