CODEWITHSUNDEEP
javascriptfabricjs
thomasf1
thomasf1

Reputation: 1804

Fabric.js: Positioning bug when rotating a group?

When rotating a group in fabric.js, the .left and .top values of the group "jump". Is that a fabric.js bug or somehow explainable/intended?

group.on "moving", ->
    #Yields values of about 100 px, also after the group was rotated

group.on "rotating", ->
    #Yields values of about 130 px

JSFiddle -> http://jsfiddle.net/thomasf1/X76X9/2/

Upvotes: 4

Views: 1258

Answers (2)

whatsTheDiff
whatsTheDiff

Reputation: 745

The difference is due to the originX and originY values changing upon rotation. originX and originY will become 'center' in place of their typical values of 'left' and 'top'. I encountered a similar issue where the positioning would change and found that I needed to be aware of the origin values.

Upvotes: 3

Frantisek
Frantisek

Reputation: 597

I faced similar problem, but not with group, but single object. Solution for me was not taking the top and left positions of rotated object, but top left Oocord x and y position.

For example:

fabricPlace.on('object:modified', function(event){
var object = event.target;

var save = {};
save.position = {};

save.id = object.id;
save.position.y = object.oCoords.tl.y;
save.position.x = object.oCoords.tl.x;
save.position.angle = object.angle;

console.log(object);

changeObject(save);
});

Upvotes: 1

Related Questions