How to use d3-force - 10 common examples

// Create Force Simulation =============================================================

let nodeSimulation: d3Force.Simulation;
let nodeLinkSimulation: d3Force.Simulation;

// Force Simulation without Links / No node data
nodeSimulation = d3Force.forceSimulation();

// Force Simulation without Links / With node data
nodeSimulation = d3Force.forceSimulation(graph.nodes);

// Force Simulation with Links / No node data
nodeLinkSimulation = d3Force.forceSimulation();

// Force Simulation with Links / With node data
nodeLinkSimulation = d3Force.forceSimulation(graph.nodes);

// nodes() -----------------------------------------------------------------------------

nodeSimulation = nodeSimulation.nodes(graph.nodes);

simNodes = nodeSimulation.nodes();

// alpha() -----------------------------------------------------------------------------

nodeLinkSimulation = nodeLinkSimulation.alpha(0.3);
num = nodeLinkSimulation.alpha();

// alphaMin() -----------------------------------------------------------------------------

nodeLinkSimulation = nodeLinkSimulation.alphaMin(0.0001);
num = nodeLinkSimulation.alphaMin();

// Use ForceRadial force -----------------------------------------------------------------

forceRadial.initialize(graph.nodes);
forceRadial(0.1); // alpha

// -------------------------------------------------------------------------------------
// Test Force Simulation
// -------------------------------------------------------------------------------------

// Create Force Simulation =============================================================

let nodeSimulation: d3Force.Simulation;
let nodeLinkSimulation: d3Force.Simulation;

// Force Simulation without Links / No node data
nodeSimulation = d3Force.forceSimulation();

// Force Simulation without Links / With node data
nodeSimulation = d3Force.forceSimulation(graph.nodes);

// Force Simulation with Links / No node data
nodeLinkSimulation = d3Force.forceSimulation();

// Force Simulation with Links / With node data
nodeLinkSimulation = d3Force.forceSimulation(graph.nodes);

// nodes() -----------------------------------------------------------------------------

nodeSimulation = nodeSimulation.nodes(graph.nodes);

simNodes = nodeSimulation.nodes();

// Use Collision force -----------------------------------------------------------------

forceCollide.initialize(graph.nodes);
forceCollide(0.1); // alpha

// Link ================================================================================

// create Link force --------------------------------------------------------------

let forceLink: d3Force.ForceLink;

// without link data
forceLink = d3Force.forceLink();

// with link data
forceLink = d3Force.forceLink(graph.links);

// Configure Link force -----------------------------------------------------------

let linkNumberAccessor: (link: SimLink, i: number, links: SimLink[]) => number;
// let nodeIdAccessor: (node: SimNode, i: number, nodes: SimNode[]) => number | string;

// links

forceLink = forceLink.links(graph.links);

simLinks = forceLink.links();

simLink = simLinks[0];

simNode = (typeof simLink.source !== 'number' && typeof simLink.source !== 'string') ? simLink.source : undefined;
simNode = (typeof simLink.target !== 'number' && typeof simLink.target !== 'string') ? simLink.target : undefined;

forceCenter(0.1); // alpha

// Collision ===========================================================================

// create Collision force --------------------------------------------------------------

let forceCollide: d3Force.ForceCollide;

// without radius
forceCollide = d3Force.forceCollide();

// with fixed radius
forceCollide = d3Force.forceCollide(15);

// with radius accessor function
forceCollide = d3Force.forceCollide((node, index, nodes) => {
    const n: SimNode = node;
    const i: number = index;
    const ns: SimNode[] = nodes;
    return n.r;
});

// Configure Collision force -----------------------------------------------------------

let radiusAccessor: (node: SimNode, i: number, nodes: SimNode[]) => number;

// radius

forceCollide = forceCollide.radius(20);
forceCollide = forceCollide.radius((node, index, nodes) => {
    const n: SimNode = node;
    const i: number = index;

// -------------------------------------------------------------------------------------
// Test Pre-Defined Forces
// -------------------------------------------------------------------------------------

// Centering ===========================================================================

// create Centering force --------------------------------------------------------------

let forceCenter: d3Force.ForceCenter;

// without specified center point (i.e. defaults to [0, 0])
forceCenter = d3Force.forceCenter();

// with x-coordinate of center point
forceCenter = d3Force.forceCenter(100);

// with x- and y-coordinate of center point
forceCenter = d3Force.forceCenter(100, 100);

// Configure Centering force -----------------------------------------------------------

forceCenter = forceCenter.x(150);
num = forceCenter.x();

forceCenter = forceCenter.y(150);
num = forceCenter.y();

// Use Centering force -----------------------------------------------------------------

forceCenter.initialize(graph.nodes);
forceCenter(0.1); // alpha

// -------------------------------------------------------------------------------------

// Centering ===========================================================================

// create Centering force --------------------------------------------------------------

let forceCenter: d3Force.ForceCenter;

// without specified center point (i.e. defaults to [0, 0])
forceCenter = d3Force.forceCenter();

// with x-coordinate of center point
forceCenter = d3Force.forceCenter(100);

// with x- and y-coordinate of center point
forceCenter = d3Force.forceCenter(100, 100);

// Configure Centering force -----------------------------------------------------------

forceCenter = forceCenter.x(150);
num = forceCenter.x();

forceCenter = forceCenter.y(150);
num = forceCenter.y();

// Use Centering force -----------------------------------------------------------------

forceCenter.initialize(graph.nodes);
forceCenter(0.1); // alpha

// Collision ===========================================================================

// create ForceRadial force --------------------------------------------------------------

let forceRadial: d3Force.ForceRadial;

// Radius set only
forceRadial = d3Force.forceRadial(50);
forceRadial = d3Force.forceRadial((node, index, nodes) => {
    const n: SimNode = node;
    const i: number = index;
    const ns: SimNode[] = nodes;
    return 50 * n.group;
});

// Radius and x-coordinate of center set only
forceRadial = d3Force.forceRadial(50, 10);
forceRadial = d3Force.forceRadial(
    50, // radius
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 10 * n.group;
    } // center-x
);

// Radius and center set
forceRadial = d3Force.forceRadial(50, 10, 10);
forceRadial = d3Force.forceRadial(
    50, // radius
    10, // center-x
    (node, index, nodes) => {

});

// Radius and x-coordinate of center set only
forceRadial = d3Force.forceRadial(50, 10);
forceRadial = d3Force.forceRadial(
    50, // radius
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 10 * n.group;
    } // center-x
);

// Radius and center set
forceRadial = d3Force.forceRadial(50, 10, 10);
forceRadial = d3Force.forceRadial(
    50, // radius
    10, // center-x
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 10 * n.group;
    } // center-y
);

forceRadial = d3Force.forceRadial(
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;

simNodeNumberAccessor = forcePosY.y();

// Use ForceY force -----------------------------------------------------------------

forcePosY.initialize(graph.nodes);
forcePosY(0.1); // alpha

// ForceRadial ==============================================================================

// create ForceRadial force --------------------------------------------------------------

let forceRadial: d3Force.ForceRadial;

// Radius set only
forceRadial = d3Force.forceRadial(50);
forceRadial = d3Force.forceRadial((node, index, nodes) => {
    const n: SimNode = node;
    const i: number = index;
    const ns: SimNode[] = nodes;
    return 50 * n.group;
});

// Radius and x-coordinate of center set only
forceRadial = d3Force.forceRadial(50, 10);
forceRadial = d3Force.forceRadial(
    50, // radius
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 10 * n.group;
    } // center-x

);

// Radius and center set
forceRadial = d3Force.forceRadial(50, 10, 10);
forceRadial = d3Force.forceRadial(
    50, // radius
    10, // center-x
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 10 * n.group;
    } // center-y
);

forceRadial = d3Force.forceRadial(
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 50 * n.group;
    }, // radius
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;
        return 10 * n.group;
    }, // center-x
    (node, index, nodes) => {
        const n: SimNode = node;
        const i: number = index;
        const ns: SimNode[] = nodes;