How can i set a custom cursor for fabric object?

5.3k views Asked by At

This is not Drawing Mode.

I want according to some condition to be able to change the cursor when I am over some element. Something like

$('#canvasID').css('cursor','pointer');

but this is not working for me. Do you know some property from their library?

2

There are 2 answers

0
Marin Popov On BEST ANSWER

After some tests this is working for me:

        canvas.observe('mouse:over', function (e) {
            if (e.target.get('type') == 'line') {

                e.target.hoverCursor = 'crosshair';
            }

        });
0
1_bug On

FabricJS have an in-built mechanism for setting custom cursor (unfortunatelly only for hover and move events):

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

var circle = new fabric.Circle({
    radius: 20, fill: 'red', left: 10, top: 10
});
circle.hoverCursor = 'no-drop';

canvas.add(circle);

More cursor types you can find here.