ccnetviz
Version:
[](https://travis-ci.org/HelikarLab/ccNetViz) [](https://www.gnu.org/licenses/gpl-3.0) [![semantic-releas
62 lines (56 loc) • 1.69 kB
HTML
<html>
<head>
<script src="../../lib/ccNetViz.js"></script>
<script src="../../lib/plugins/ccNetViz-animation-edge-plugin.js"></script>
<style>
canvas,
html,
body {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<script>
var nodes = [{}, {}, {}, {}, {}, {}, {}, {}, {}, {}];
var settings = {
styles: {
node: {
label: { hideSize: 16 },
},
edge: {
width: 5,
type: 'line',
color: 'rgb(255, 255, 255)',
animateType: 'gradient', // "basic", "gradient", "double-gradient", "shape-wave", "shape-bubble", "none"
animateSpeed: 0.01,
animateColor: 'rgb(0, 0, 0)',
// animateMaxWidth: 25,
},
},
};
var edges = [
{ source: nodes[0], target: nodes[1] },
{ source: nodes[1], target: nodes[2] },
{ source: nodes[2], target: nodes[3] },
{ source: nodes[3], target: nodes[4] },
{ source: nodes[4], target: nodes[5] },
{ source: nodes[5], target: nodes[6] },
{ source: nodes[6], target: nodes[7] },
{ source: nodes[7], target: nodes[8] },
{ source: nodes[0], target: nodes[9] },
{ source: nodes[2], target: nodes[1] },
];
var canvas = document.createElement('canvas');
canvas.width = 250;
canvas.height = 250;
document.body.appendChild(canvas);
window.graph = new ccNetViz(canvas, settings);
graph.set(nodes, edges, 'versinus').then(async function() {
graph.draw();
});
</script>
</body>
</html>