Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

d3plus-network

Package Overview
Dependencies
Maintainers
1
Versions
52
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

d3plus-network - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

10

package.json
{
"name": "d3plus-network",
"version": "1.0.2",
"version": "1.0.3",
"description": "Javascript network visualizations built upon d3 modules.",

@@ -30,5 +30,5 @@ "main": "build/d3plus-network.js",

"d3-scale": "^3.2.3",
"d3plus-common": "^1.0.4",
"d3plus-shape": "^1.0.3",
"d3plus-viz": "^1.0.9"
"d3plus-common": "~1.1.2",
"d3plus-shape": "~1.0.7",
"d3plus-viz": "~1.2.6"
},

@@ -45,3 +45,3 @@ "scripts": {

"devDependencies": {
"d3plus-dev": "^1.0.1"
"d3plus-dev": "~1.1.0"
},

@@ -48,0 +48,0 @@ "module": "es/index",

@@ -18,55 +18,2 @@ # d3plus-network

## Simple Network Graph
Given an array of [nodes](http://d3plus.org/docs/#Network.nodes) and an array of [links](http://d3plus.org/docs/#Network.links), [d3plus-network](https://github.com/d3plus/d3plus-network) creates a simple network visualization based on the supplied x and y coordinates.
```js
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.
```js
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:
```js
new d3plus.Network()
.links(links)
.nodes(nodes)
.render();
```
[<kbd><img src="/example/getting-started.png" width="990px" /></kbd>](https://d3plus.org/examples/d3plus-network/getting-started/)
[Click here](https://d3plus.org/examples/d3plus-network/getting-started/) to view this example live on the web.
### More Examples
* [Simple Rings](http://d3plus.org/examples/d3plus-network/simple-rings/)
* [Simple Sankey Diagram](http://d3plus.org/examples/d3plus-network/sankey-diagram/)
* [Force Directed Network](http://d3plus.org/examples/d3plus-network/force-network/)
## API Reference

@@ -508,2 +455,2 @@

###### <sub>Documentation generated on Wed, 16 Jun 2021 15:51:51 GMT</sub>
###### <sub>Documentation generated on Fri, 03 Feb 2023 21:26:16 GMT</sub>

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc