react-force-graph icon indicating copy to clipboard operation
react-force-graph copied to clipboard

Maximum zoom level in 3D

Open loopmode opened this issue 3 years ago • 2 comments

This is not feature request or bug report, rather a usage question.

When using react-force-graph-3d, seems that there is a limit to how far you can zoom in to the graph.

In our application, you can hold an "Apply force" button to continuously reheat the simulation and "stretch the graph apart", which makes it a lengthy string.

Initial view: image

Stretched apart: image

However, it is not possible to indefinitely zoom in, and parts of the node remain "far away" at maximum zoom: image

The user now must manually zoom, rotate and pan in order to try to get closer to those far-away parts using tricky maneuvers.

Is there a way to control or increase a setting as to allow zooming in even deeper?

And thanks @vasturiano for your awesome packages!

loopmode avatar Oct 01 '20 09:10 loopmode

Btw as a workaround, we use the approach from the "click to focus" example, which does get you up close to any node, but of course it's just a workaround, despite of being a very pretty one.

loopmode avatar Oct 01 '20 11:10 loopmode

@loopmode thanks for reaching out.

If you're using the default trackball controls you should keep in mind that every motion revolves around the central point (0,0,0) of the graph. As you're zooming in you're only getting closer and closer to that point and cannot cross it to reach the positions that are beyond it, as those are accessible via scene rotation/panning (drag interaction).

However, if you prefer to have interaction with your scene in the shape of moving freely through the space you can have a look at switching the controlType to fly.

Here's an example of what that feels like for a regular graph. Use wasd keys to move and cursor keys to change orientation.

vasturiano avatar Oct 02 '20 00:10 vasturiano