Fabric gotchas
-
new fabric.Canvas('foo')wraps<canvas id="foo">element with a<div>one, and adds another (absolutely positioned) canvas element on top of the existing canvas (the one with id="foo"). This only happens for dynamic canvases (fabric.Canvas), not static ones (fabric.StaticCanvas). Also see How fabric canvas layering works. -
When the clickable area of an object and its controls doesn't match the object's position, you probably need to call
object.setCoords(). This recalculates the object's coordinates that are used to detect its control positions. See When to call setCoords. -
When mouse/touch based multi-selection has the wrong offset on canvas, you can fix it with
canvas.calcOffset(). This usually happens when the canvas' position in a document is changed after the canvas is initialized (e.g. if there was an image before that was loaded). -
When trying to change the value in a textbox on mobile, users need to double-tap in the same spot to enter edit mode - otherwise it just moves the textbox.