Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to fit or zoom out a React Vis.JS Network Graph? #93

Closed
TiberiusVE opened this issue Oct 7, 2020 · 2 comments
Closed

How to fit or zoom out a React Vis.JS Network Graph? #93

TiberiusVE opened this issue Oct 7, 2020 · 2 comments

Comments

@TiberiusVE
Copy link

Good evening, I have the following setting for my Network Graph:

const exceptionsGraph = {
        nodes: graph,
        edges: edges
    }

// Graph Options
const options = {
    height: "80%",
    width: "100%",
    nodes: {
        shape: "dot",
        size: 16
    },
    layout: {
        hierarchical: false
    },
    physics: {
        forceAtlas2Based: {
            gravitationalConstant: -26,
            centralGravity: 0.005,
            springLength: 230,
            springConstant: 0.18,
        },
        maxVelocity: 146,
        solver: "forceAtlas2Based",
        timestep: 0.35,
        stabilization: {
            enabled: true,
            iterations: 2000,
            updateInterval: 25,
        },
    },
    edges: {
        color: "#abb4be"
    }
}    

And then I call it like this:

<Graph graph={exceptionsGraph} options={options} />
But when it renders it's all zoomed in, so it looks terrible. Like this:

image

And I want it to look like this:

image

How can I achieve this on React?

Thanks in advance

@mapringg
Copy link

Have you tried calling the fit() method from the network reference?

@crubier
Copy link
Owner

crubier commented Feb 15, 2021

This should work indeed

@crubier crubier closed this as completed Feb 15, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants