d3plus-network

d3plus-network

Javascript network visualizations built upon d3 modules.

Installing

If you use NPM, npm install d3plus-network. Otherwise, download the latest release. The released bundle supports AMD, CommonJS, and vanilla environments. Create a custom bundle using Rollup or your preferred bundler. You can also load directly from d3plus.org:

<script src="https://d3plus.org/js/d3plus-network.v0.1.full.min.js"></script>

Getting Started

Given an array of nodes and an array of links, d3plus-network can create simple network visualization based on supplied x and y coordinates.

var nodes = [
  {id: "alpha",   x: 1,   y: 1},
  {id: "beta",    x: 2,   y: 1},
  {id: "gamma",   x: 1,   y: 2},
  {id: "epsilon", x: 3,   y: 2},
  {id: "zeta",    x: 2.5, y: 1.5},
  {id: "theta",   x: 2,   y: 2}
];

The source and target keys in each link need to map to the nodes in one of three ways:

1. The index of the node in the nodes array (as in this example).
2. The actual node Object itself.
3. A String value matching the id of the node.

var links = [
  {source: 0, target: 1},
  {source: 0, target: 2},
  {source: 3, target: 4},
  {source: 3, target: 5},
  {source: 5, target: 0}
];

Finally, these 2 variables simply need to be passed to a new Network class:

new d3plus.Network()
  .links(links)
  .nodes(nodes)
  .render();

Click here to view this example live on the web.

API Reference

Network ⇐ Viz

Kind: global class
Extends: Viz

• Network ⇐ Viz
  • new Network()
  • .links([links])
  • .nodeGroupBy([value])
  • .nodes([nodes])
  • .x([value])
  • .size([value])
  • .sizeMax([value])
  • .sizeMin([value])
  • .sizeScale([value])
  • .y([value])

new Network()

Creates an x/y plot based on an array of data.

Network.links([links])

If links is specified, sets the links array to the specified array and returns the current class instance. If links is not specified, returns the current links array.

Kind: static method of Network

Param	Type	Default
[links]	Array	[]

Network.nodeGroupBy([value])

If value is specified, sets the node group accessor(s) to the specified string, function, or array of values and returns the current class instance. This method overrides the default .groupBy() function from being used with the data passed to .nodes(). If value is not specified, returns the current node group accessor.

Kind: static method of Network

Param	Type
[value]	String | function | Array

Network.nodes([nodes])

If nodes is specified, sets the nodes array to the specified array and returns the current class instance. If nodes is not specified, returns the current nodes array.

Kind: static method of Network

Param	Type	Default
[nodes]	Array	[]

Network.x([value])

If value is specified, sets the x accessor to the specified function or string matching a key in the data and returns the current class instance. The data passed to .data() takes priority over the .nodes() data array. If value is not specified, returns the current x accessor. By default, the x and y positions are determined dynamically based on default force layout properties.

Kind: static method of Network

Param	Type
[value]	function | String

Network.size([value])

If value is specified, sets the size accessor to the specified function or data key and returns the current class instance. If value is not specified, returns the current size accessor.

Kind: static method of Network

Param	Type
[value]	function | String

Network.sizeMax([value])

If value is specified, sets the size scale maximum to the specified number and returns the current class instance. If value is not specified, returns the current size scale maximum. By default, the maximum size is determined by half the distance of the two closest nodes.

Kind: static method of Network

Param	Type
[value]	Number

Network.sizeMin([value])

If value is specified, sets the size scale minimum to the specified number and returns the current class instance. If value is not specified, returns the current size scale minimum.

Kind: static method of Network

Param	Type	Default
[value]	Number	5

Network.sizeScale([value])

If value is specified, sets the size scale to the specified string and returns the current class instance. If value is not specified, returns the current size scale.

Kind: static method of Network

Param	Type	Default
[value]	String	"sqrt"

Network.y([value])

If value is specified, sets the y accessor to the specified function or string matching a key in the data and returns the current class instance. The data passed to .data() takes priority over the .nodes() data array. If value is not specified, returns the current y accessor. By default, the x and y positions are determined dynamically based on default force layout properties.

Kind: static method of Network

Param	Type
[value]	function | String

_{Documentation generated on Tue, 29 Nov 2016 19:48:42 GMT}