Skip to content

Commit 65f23cc

Browse files
committed
Added a sample with the available edge renderers
1 parent 641cb30 commit 65f23cc

File tree

1 file changed

+90
-0
lines changed

1 file changed

+90
-0
lines changed

examples/edge-renderers.html

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
<!-- START SIGMA IMPORTS -->
2+
<script src="../src/sigma.core.js"></script>
3+
<script src="../src/conrad.js"></script>
4+
<script src="../src/utils/sigma.utils.js"></script>
5+
<script src="../src/utils/sigma.polyfills.js"></script>
6+
<script src="../src/sigma.settings.js"></script>
7+
<script src="../src/classes/sigma.classes.dispatcher.js"></script>
8+
<script src="../src/classes/sigma.classes.configurable.js"></script>
9+
<script src="../src/classes/sigma.classes.graph.js"></script>
10+
<script src="../src/classes/sigma.classes.camera.js"></script>
11+
<script src="../src/classes/sigma.classes.quad.js"></script>
12+
<script src="../src/captors/sigma.captors.mouse.js"></script>
13+
<script src="../src/captors/sigma.captors.touch.js"></script>
14+
<script src="../src/renderers/sigma.renderers.canvas.js"></script>
15+
<script src="../src/renderers/sigma.renderers.webgl.js"></script>
16+
<script src="../src/renderers/sigma.renderers.def.js"></script>
17+
<script src="../src/renderers/webgl/sigma.webgl.nodes.def.js"></script>
18+
<script src="../src/renderers/webgl/sigma.webgl.nodes.fast.js"></script>
19+
<script src="../src/renderers/webgl/sigma.webgl.edges.def.js"></script>
20+
<script src="../src/renderers/webgl/sigma.webgl.edges.fast.js"></script>
21+
<script src="../src/renderers/webgl/sigma.webgl.edges.arrow.js"></script>
22+
<script src="../src/renderers/canvas/sigma.canvas.labels.def.js"></script>
23+
<script src="../src/renderers/canvas/sigma.canvas.hovers.def.js"></script>
24+
<script src="../src/renderers/canvas/sigma.canvas.nodes.def.js"></script>
25+
<script src="../src/renderers/canvas/sigma.canvas.edges.def.js"></script>
26+
<script src="../src/renderers/canvas/sigma.canvas.edges.curve.js"></script>
27+
<script src="../src/renderers/canvas/sigma.canvas.edges.arrow.js"></script>
28+
<script src="../src/renderers/canvas/sigma.canvas.edges.curvedArrow.js"></script>
29+
<script src="../src/middlewares/sigma.middlewares.rescale.js"></script>
30+
<script src="../src/middlewares/sigma.middlewares.copy.js"></script>
31+
<script src="../src/misc/sigma.misc.animation.js"></script>
32+
<script src="../src/misc/sigma.misc.bindEvents.js"></script>
33+
<script src="../src/misc/sigma.misc.drawHovers.js"></script>
34+
<!-- END SIGMA IMPORTS -->
35+
<div id="container">
36+
<style>
37+
#graph-container {
38+
top: 0;
39+
bottom: 0;
40+
left: 0;
41+
right: 0;
42+
position: absolute;
43+
}
44+
</style>
45+
<div id="graph-container"></div>
46+
</div>
47+
<script>
48+
/**
49+
* This is a basic example to show all the different available edge renderers
50+
* for the canvas renderer.
51+
*/
52+
var i,
53+
s,
54+
N = 100,
55+
E = 500,
56+
g = {
57+
nodes: [],
58+
edges: []
59+
};
60+
61+
// Generate a random graph:
62+
for (i = 0; i < N; i++)
63+
g.nodes.push({
64+
id: 'n' + i,
65+
label: 'Node ' + i,
66+
x: Math.random(),
67+
y: Math.random(),
68+
size: Math.random(),
69+
color: '#666'
70+
});
71+
72+
for (i = 0; i < E; i++)
73+
g.edges.push({
74+
id: 'e' + i,
75+
source: 'n' + (Math.random() * N | 0),
76+
target: 'n' + (Math.random() * N | 0),
77+
size: Math.random(),
78+
color: '#ccc',
79+
type: ['curve', 'arrow', 'curvedArrow'][Math.random() * 3 | 0]
80+
});
81+
82+
// Instanciate sigma:
83+
s = new sigma({
84+
graph: g,
85+
renderer: {
86+
container: document.getElementById('graph-container'),
87+
type: 'canvas'
88+
}
89+
});
90+
</script>

0 commit comments

Comments
 (0)