Skip to content

Instantly share code, notes, and snippets.

@pachadotdev

pachadotdev/index.html

Last active December 26, 2016 04:28
Show Gist options
  • Save pachadotdev/360584e80d8b5f74f3369afef6bec846 to your computer and use it in GitHub Desktop.
Save pachadotdev/360584e80d8b5f74f3369afef6bec846 to your computer and use it in GitHub Desktop.
Download ZIP
Ejemplo de Red con D3Plus 2
Raw
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="https://d3plus.org/js/d3plus-network.v0.1.full.min.js"></script>
<style>
body {
margin: 0;
}
</style>
</head>
<body></body>
<script>
var data = [
{id: "alpha", value: 1, color:"#333333"},
{id: "beta", value: 2, color:"#333333"},
{id: "gamma", value: 3, color:"#333333"},
{id: "epsilon", value: 1, color:"#333333"},
{id: "zeta", value: 2, color:"#333333"},
{id: "theta", value: 3, color:"#333333"}
];
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}
];
var links = [
{source: 0, target: 1},
{source: 0, target: 2},
{source: 3, target: 4},
{source: 3, target: 5},
{source: 5, target: 0}
];
new d3plus.Network()
.data(data)
.links(links)
.nodes(nodes)
.shapeConfig({fill: function(d) { return d.color; }})
.render();
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment