CODEWITHSUNDEEP
javascriptjqueryfabricjs
dev-jim
dev-jim

Reputation: 2524

Fabric.js - object cannot drag/move after centered

I am using the farbric.js for editing images in an app. The image should be able to resize, move/drag, and rotate. The problem is when I rotate the image (by click on the button), it will not in the center of it canvas. So I have to use centerObject() to make it works. However, after I done this, the image cannot be drag any more.

this is the function that handling the rotation (it is in a class):

 rotationset : function(angle, offsetX, offsetY){
    // this.obj is the origin object  
    this.Obj.left = offsetX;
    this.Obj.top =  offsetY;
    this.Obj.angle = angle;
    this.Obj.center();//center the image
    //this.canvas also initialized on load.
    this.canvas.calcOffset();
    this.canvas.renderAll();

}

So, what is the problem? Any other fix for this?

Upvotes: 2

Views: 2299

Answers (1)

Onirom
Onirom

Reputation: 592

Documentation say :

You might need to call setCoords on an object after centering, to update controls area.

So doing this.Obj.setCoords(); after this.Obj.center(); should do the trick.

Upvotes: 7

Related Questions