Stack Overflow
Stack Overflow

Questions tagged [fabricjs2]

For questions about programming problems with version 2 of the Fabric.js framework. Use [fabricjs] if your question isn't version dependent.

This tags refers to the version 2 of Fabric.js
Fabric.js makes easy to work with elements.

Have a look at the 2.0 changelog for breaking changes and extra features from previous version,
or visit the for more tagged questions.

Fabric.js also supports subclassing, touch devices and Node.js

Additional Resources:

122 questions
0
votes
0 answers

Fabricjs SBOX_FATAL_MEMORY_EXCEEDED

I am working on a project that requires me to load huge SVG drawings and annotations on top of it from (fabric.js) . After storing the background, I can't load it out again using loadFromJSON. It gives me SBOX_FATAL_MEMORY_EXCEEDED. Is there any way…
user15373325
  • 41
  • 2
0
votes
1 answer

FabricJs: Keep Object Size fixed on Group Reszing

I am using FabricJS to create a group with two objects - light icon (svg) and shadow (triangle). Light Icon SVG I am importing as SVG and then setting scale like: lightObj.scaleToWidth(24); lightObj.scaleToHeight(24); And then I am group the light…
Kartik Solanki
  • 161
  • 1
  • 10
0
votes
1 answer

Fabric.js background appears only after change zoom value

I'm trying to change canvas background with Pattern: this.canvas.setBackgroundColor(new fabric.Pattern({source: url, repeat: 'repeat'}), ()=> { this.canvas.renderAll(); }); I'm using an external url like this:…
Fede Dávila
  • 27
  • 3
0
votes
1 answer

How to select programmatically one image within set of images in Fabric.js rendered

There are multiple images in the canvas how to select one programmatically in fabric js fabric.Image.fromURL(this.imageSrc, (img) => { let oImg = img.set({ left: 0, top: 0, angle: 0, …
chathura jayaranga
  • 1
  • 1
  • 3
0
votes
1 answer

Issue with updating FabricJS iText programmatically

I've been stuck on this issue for a few hours now and I can't see any obvious reason as to why I am not able to do this. I am using FabricJS to create an editable canvas. I am currently adding in text functionality, so when the user clicks on the…
Chuck
  • 23
  • 2
  • 10
0
votes
1 answer

IOS device keyboard not opening on single tap event itext insert fabricjs hammerjs with Angular 9

I am using fabricjs for canvas and hammerjs for touch event with Angular 9. I have a single tap event of hammerjs which creates an object of fabric's IText. Single tapping creates the fabric and populates it on the canvas, but the device keyboard…
Jivan
  • 520
  • 1
  • 5
  • 14
0
votes
2 answers

Fabric JS | Shows unwanted lines when scroll or drag any object

I'm loading data from JSON. Can't figure out why unwanted lines are shown on the canvas whenever I try to scroll or drag any object. This issue only occurs when loading from JSON. codepen link Example data is available in the…
Pramit Sawant
  • 682
  • 1
  • 9
  • 17
0
votes
1 answer

How do I check if a fabric Object is a video?

Fabricjs seems to use fabric.Image to create both an image or a video. In multiple use cases if I'm getting some fabric object, through an event, or looping through the fabric canvas, I need to differentiate if that object is an image or a video. If…
Ariel Frischer
  • 1,406
  • 2
  • 12
  • 20
0
votes
1 answer

What are all the possible types of fabricjs objects?

Looking through TS definition here I still can't seem to find all the possible types of fabric objects, I can't find a list of types on fabricJS documentation page…
Ariel Frischer
  • 1,406
  • 2
  • 12
  • 20
0
votes
0 answers

Fabric JS: Line drawing with borders

Is it possible to draw a line with borders in fabric JS? I'm looking to draw a line with the only stroke value and I want the fill to remain white so that it looks like a line with borders. As far I referred the documentation I guess it's not…
NoobDeveloper
  • 61
  • 1
  • 4
0
votes
1 answer

How to make sure image alway include entire clipping Rect inside while it's transforming (move, scale) in fabric.js?

I have a Image with a simple clipping Rect ( rotate 30 degree with size 200x200 to make a small view part of image ). My problem is how to prevent Image move or scale outside clipping rect ( that mean Image need alway include entire clipping Rect…
Tho Bui Ngoc
  • 763
  • 1
  • 11
  • 36
0
votes
1 answer

How to create object stick on center of parent object in FabricJS?

I have an object e.g circle and I want to add more circles on border of the parent circle that must be center aligned. On the attached gif image you can see my cursor - it only allows me to create a child circle on border of the parent. Till now I…
user13771321
0
votes
2 answers

Fabric.js blend image into background. blur at the edges

I am trying to blend foreground image into background image using fabric.js The foreground image should blur at the edges. In the below example, dog is the foreground image. scenery is the background image. This is my code : var canvas = new…
Arnold
  • 495
  • 2
  • 6
  • 18
0
votes
1 answer

What is wrapperEl in canvas in FabricJS?

https://github.com/salgum1114/react-design-editor/blob/8db73ef3d9846444e25657a5414b417633b1ef0e/src/components/Canvas.js I have gone through the code on the above link. But I can't seem to understand Line 495 where its written this.canvas.wrapperEl…
PRS
  • 11
  • 3
0
votes
0 answers

How add objects to group on fabric js

I want add rects to group dynamically. But when I add over top or left side, top left corner of group jump to top left corner of added rect. Help me resolve it, please. How I add rects: let canvas = new fabric.Canvas('draw'); let group = new…
Andrew
  • 23
  • 4
1 2 3
…
8 9