Fabric.js: Set Origin Position to a Specific Point

[mrtnbroder]

Currently, there is not way (as far as I can tell from the documentation) to set a specific location (e.g. {originX:10px, originY: 10px}. This is possible in CSS already.

It would be nice to add this in the future.

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[asturur]

May i ask you, which benefits do you see in this option?

[mrtnbroder]

I'm currently needing this.

I've got an object that scales within a small canvas, and right now the origin position can only be something like left, top, right, center etc.

But what I would need is, that it scales from the center of the canvas, and not the center of itself (or any other origin position).

[asturur]

Sorry, i edit my comment.
I understand that i do not get the point of your second comment.

When you speak about origin you speak about origin of object or origin of canvas?
How this is related with scaling?

[mrtnbroder]

zoom in and out here:

http://app.ziteboard.com/

do think this is possible right now without setting the origin position to the mouse x,y coordinate?

[asturur]

If you mean zooming in with scroll on the mouse position, try this
http://fabricjs.com/kitchensink/#zoom

Is full canvas zooming and i think even panning.

[lukejagodzinski]

I've needed this feature too but I've made workaround. However there can be many situations when rotating around given point (in pixels) is needed. Probably it would be feature that require rewriting almost every function. It should work like in Photoshop.

[asturur]

@mrtnbroder did you manage to zoom in that way? can we close?

[mrtnbroder]

if you want to close it, close it... I've managed to do this some other way now.

[asturur]

You opened an issue asking for setting origin in a point ( without saying oringin of what )
I asked you to understand better, you pointed me to an application that had zoom, you asked if it was possible to zoom in that way. i told you yes and sent you example.
Whatever you needed to do and how you did it, if you do not bother to share, is not my businness.

I understand the fault is mine, that i bothered myself to see if you solved.

[mrtnbroder]

woow wow. calm down @asturur :D nothing to rage about!

This was more of a suggestion, other then an issue or a serious problem. As I said, this is possible in CSS already, and I figured out this is not the case for fabricjs. So I thought adding this would be a good feature to implement.

[pplanel]

I think @mrtnbroder is talking about a pivot point for rotation and such. I need to implement a pivot point, as seen in AI or PS to enable the user to rotate the object around the pivot. Is this options available to FabricJS, if it's not, could you point me towards the function that could possibly be hacked to implement this?
I think that would be beneficial to have pivot points for objects and selection groups.

[asturur]

as of now we support originX and originY also as numeric values ranging from 0 to 1.
Disabling centeredRotation should answer both the questions

[lakshmana]

@mrtnbroder I agree completely with you. It would be cool if fabricjs has this feature. BTW @mrtnbroder can you please share your alternative method to achieve the same feature?

[ZomboM]

+1

[asturur]

you can use numeric origins

[WisdomSky]

I really hope that someone could change his very arrogant way of solving peoples' problems.
It's really hard to give a suggestion and then someone tries to slap things on your face.

[lakshmana]

@asturur The changelog says

Improvement: added numeric origins handling fomr 0 to 1. #3121

What does this really mean and work? I do not see any more info on the document ( I hope it is too early to expect the doc to be updated). can you confirm if we can use something like this as in css {originX:10px, originY: 10px}