Opensea Dragon and fabric js are used together in typeScript-based React. Click the button on the toolbar with the roller / brush / variable / eraser, it is made to glide into the fabric canvas. When I click the button, I want to change the cursor used by canvas.
so i write code like this
useEffect(() => {
const canvas = overlay.fabricCanvas()
console.log("this is ",cursorHandler);
if (cursorHandler === "ruler") {
canvas.freeDrawingCursor='url(Length.cur),default';
} else if (cursorHandler === "brush") {
canvas.defaultCursor = 'text'
} else if (cursorHandler === "eraser") {
canvas.defaultCursor = 'wait'
} else if (cursorHandler === "rectangle") {
canvas.defaultCursor = 'cell'
}
}, [cursorHandler])'text' , 'wait', 'cell' is work but ruler is not working of course Length.cur is on same dir
how to change cursor when i click the button in toolbar