search

jerosoler / Drawflow

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

Re-centre the grid and panning to particular nodes on the grid #403

Closed gpack closed 2 years ago

gpack commented 2 years ago

Hi,

These are relating more towards the canvas/grid area. And there are a couple of questions below:

QUESTION 1: Is it possible to re-centre the canvas back to x:0, y:0. Since the canvas begins at 0,0 and nodes are dropped from that point, I think it's logical and a good idea to have a button where if the user hits it, it "re-centres" the map in the middle again. Because at the moment in the demo, if you pan away and get lost, the middle "search icon" doesn't do this, it just resets the zoom.
How would I go about achieving this?

QUESTION 2: I am keeping a list of nodes that I add to the gird in a list separately, and I would like to be able to click on any of these nodes in the list and would like the grid to centre itself to where the node is sitting on the grid. So almost like it's finding the node on the grid and moving to that position so that the node selected is seen in the middle. How would I achieve something like this?

Thank you, any guidance would be very helpful.

Great work on the script by the way.

jerosoler commented 2 years ago

Question 1 view:

Question 2: Use the method described in question 1. You can get the x,y coordinates of a node with the method: getNodeFromId https://github.com/jerosoler/Drawflow#methods

gpack commented 2 years ago

Amazing! Thanks so much for the super fast reply Jero. Even finding the previous answers that matched my questions so quickly was impressive.