How to customize fabricjs canvas coordinate system?

Asked May 08 '19 at 13:15

Active May 15 '19 at 23:07

Viewed 826 times

Is there any setting or something provided in fabricjs for customizing canvas coordinate system?

For my project I found easy to use cartesian coordinate system. Currently I am translating each object to (width/2, height/2) in order to move to cartesian coordinate system.

Left-top of canvas would be (-width/2, -height/2) instead of (0,0) as below image.

If any object with options {left:0,top:0,originX:'center', originY:'center'} is added to canvas, it should appear in the center not top-left corner

edited May 15 '19 at 23:07

asked May 08 '19 at 13:15

mudin

2,672
2
17
45

Have you tried anything concerning viewport transform? Or do you need to be able to pan? otherwise something like [this](https://jsfiddle.net/epru5k46/4/) could help – Nielsvandenbroeck May 13 '19 at 13:29
Currently I am using exactly the way you suggested. But it still bothers cuz my canvas is zoomable, panable like small mapping. [here](https://github.com/mudin/indoorjs) is the github code with demo – mudin May 13 '19 at 23:26
Hmmm. I just used constants in our project to indicate the necessary offsets. not sure how else to fix it – Nielsvandenbroeck May 14 '19 at 10:25
Yeah I guess there is something we need to consider in version 2.x, it words for version 1.x – mudin May 15 '19 at 00:03
1

Good luck already! – Nielsvandenbroeck May 16 '19 at 08:39

How to customize fabricjs canvas coordinate system?

0 Answers0