jerosoler / Drawflow

Simple flow library 🖥️🖱️
https://jerosoler.github.io/Drawflow/
MIT License
4.78k stars 741 forks source link

How to apply translation on imported nodes ? #661

Open oanguenot opened 1 year ago

oanguenot commented 1 year ago

Hi, I have a lot of nodes on the canvas and I want to add new ones on the top of all other nodes. For that, I translated the canvas to have space available on top. The problem is when saving and reloading the nodes, the translation done is applied.

Is there a way to that ? Thanks in advance

jerosoler commented 1 year ago

Hello,

I don't know if I quite understand what you want.

Do you want to move the nodes on import? Or move the canvas when importing?

Jero

oanguenot commented 1 year ago

If I have a canvas full of nodes, I want to move the canvas to the bottom (drag it to the bottom) and then add new nodes on the top of the screen. Then I save the editor (export). If I reimport it, the new nodes added are not visible on screen. I need to drag the canvas again to the bottom to see them.

Perhaps I didn't have correctly understood how to use the "translate" event fired when the canvas is moved.

So, if I save the translate result, how to re-inject it to the canvas once imported to restore it ?

jerosoler commented 1 year ago

Hello,

You can save the variables:

editor.canvas_x;
editor.canvas_y;

And you can use this method to translate to specific coordinates.

You can use the import event to detect when the data is finished loading and call the function.

oanguenot commented 1 year ago

Thank you for your answer. I will give it a try