How to use the d3-state-visualizer.forceGraph function in d3-state-visualizer
To help you get started, we’ve selected a few d3-state-visualizer examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
reduxjs / d3-state-visualizer / examples / graph / index.js View on Github 
import { forceGraph } from 'd3-state-visualizer';
import d3 from 'd3';
const appState = {
foo: ['1', '2', '3'],
bar: 3,
baz: { some: 'value' },
todo: ['a', 'b']
};
const nodes = Object.keys(appState).map(key => ({
key,
[key]: appState[key]
}));
const initialize = forceGraph();
const render = initialize(d3, document.getElementById('root'), {
data: nodes,
id: 'forceGraphExample',
size: 1000,
aspectRatio: 1,
charge: -50,
linkDistance: 50,
maxNodeSize: 50
});
render();import { forceGraph } from 'd3-state-visualizer';
import Chart from './components/Chart';
const appState = {
foo: ['1', '2', '3'],
bar: 3,
baz: { some: 'value' },
todo: ['a', 'b']
};
const nodes = Object.keys(appState).map(key => ({
key,
[key]: appState[key]
}));
const initialize = forceGraph();
React.render(
, document.getElementById('root')
);d3-state-visualizer
Visualize your app state with a range of reusable charts
