CODEWITHSUNDEEP
fabricjs
Grande Wu
Grande Wu

Reputation: 43

Fabric.js hasControls=false and hasBorders=false but it is still selectable

I was trying to add to canvas item which will be dragable but not selectable so I did like this 

  var canvas = new fabric.Canvas('root');
  canvas.add(new fabric.Circle({ radius: 30, fill: '#f55', top: 100, left: 100 }));
  canvas.add(new fabric.Circle({ radius: 30, fill: '#5f5', top: 160, left: 100 }));
  canvas.item(0).hasControls = canvas.item(0).hasBorders = false;

Now I'm not able to select as a group element 0 (this is ok!) but when I'm selecting group which contains also item 1 then item 0 is also selected (this is not good). How can I fix it?

Upvotes: 2

Views: 3204

Answers (1)

AndreaBogazzi
AndreaBogazzi

Reputation: 14731

I know this question is very old but:

 canvas.item(0).hasControls = canvas.item(0).hasBorders = false;

Will make the object with invisible border and invisible controls, so it looks like you are not selecting it, but you are still doing and not drawing any controls.

There is no way to make an object unselectable BUT draggable. If you cannot select it ( setting .selectable=false), you cannot drag it.

When an object is in a selection group its border get drawn anyway, whatever setting is on .hasBorders.

Upvotes: 1

Related Questions