UNPKG

8.18 kBHTMLView Raw
1
2<!DOCTYPE html>
3<html lang="en">
4<head>
5 <meta charset="utf-8">
6 <meta http-equiv="X-UA-Compatible" content="IE=edge">
7 <meta name="viewport" content="width=device-width, initial-scale=1">
8 <title>Network Examples</title>
9 <link rel="icon" HREF="favicon.ico">
10</head>
11<body>
12<div class="contentWrapper">
13 <div id="networkContainer"></div>
14 <div id="contentContainer">
15 <h1>Network Examples</h1>
16 <div>This page contains examples which show how to use Network. For the documentation, please click the button below:</div>
17 <br>
18 <a class="btn btn-primary" href="../docs/network" role="button">View docs »</a>
19
20 <h3>basic usage</h3>
21 <a class='exampleLink' href="network/basicUsage.html">basic usage</a><br />
22
23 <h3>node styles</h3>
24 <a class='exampleLink' href="network/nodeStyles/circularImages.html">circular images</a><br />
25 <a class='exampleLink' href="network/nodeStyles/colors.html">colors</a><br />
26 <a class='exampleLink' href="network/nodeStyles/customGroups.html">custom groups</a><br />
27 <a class='exampleLink' href="network/nodeStyles/groups.html">groups</a><br />
28 <a class='exampleLink' href="network/nodeStyles/HTMLInNodes.html">HTML in nodes</a><br />
29 <a class='exampleLink' href="network/nodeStyles/icons.html">icons (Fontawesome and Ionicons)</a><br />
30 <a class='exampleLink' href="network/nodeStyles/images.html">images</a><br />
31 <a class='exampleLink' href="network/nodeStyles/imagesWithBorders.html">images with borders</a><br />
32 <a class='exampleLink' href="network/nodeStyles/shadows.html">node shadows</a><br />
33 <a class='exampleLink' href="network/nodeStyles/shapes.html">node shapes</a><br />
34 <a class='exampleLink' href="network/nodeStyles/shapesWithDashedBorders.html">dashed borders</a><br />
35 <a class='exampleLink' href="network/nodeStyles/widthHeight.html">width height</a><br />
36
37 <h3>edge styles</h3>
38 <a class='exampleLink' href="network/edgeStyles/arrows.html">arrows (also combined with dashes)</a><br />
39 <a class='exampleLink' href="network/edgeStyles/arrowTypes.html">arrow types</a><br />
40 <a class='exampleLink' href="network/edgeStyles/colors.html">different colors</a><br />
41 <a class='exampleLink' href="network/edgeStyles/dashes.html">dashes</a><br />
42 <a class='exampleLink' href="network/edgeStyles/smooth.html">smooth curves</a><br />
43 <a class='exampleLink' href="network/edgeStyles/smoothWorldCup.html">smooth curves in action</a><br />
44
45 <h3>labels</h3>
46 <a class='exampleLink' href="network/labels/labelAlignment.html">label alignment (for edges only)</a><br />
47 <a class='exampleLink' href="network/labels/labelBackground.html">label background</a><br />
48 <a class='exampleLink' href="network/labels/labelColorAndSize.html">colors and sizes</a><br />
49 <a class='exampleLink' href="network/labels/labelMargins.html">label margins</a><br />
50 <a class='exampleLink' href="network/labels/labelMultifont.html">label multiple fonts</a><br />
51 <a class='exampleLink' href="network/labels/labelStroke.html">label stroke</a><br />
52 <a class='exampleLink' href="network/labels/multilineText.html">multiline text</a><br />
53
54 <h3>layout</h3>
55 <a class='exampleLink' href="network/layout/hierarchicalLayout.html">hierarchical layout</a><br />
56 <a class='exampleLink' href="network/layout/hierarchicalLayoutMethods.html">hierarchical layout - different methods</a><br />
57 <a class='exampleLink' href="network/layout/hierarchicalLayoutUserdefined.html">hierarchical layout - user defined</a><br />
58 <a class='exampleLink' href="network/layout/hierarchicalLayoutWithoutPhysics.html">hierarchical layout - without physics</a><br />
59 <a class='exampleLink' href="network/layout/randomSeed.html">set the random seed so every network will be the same</a><br />
60
61 <h3>events</h3>
62 <a class='exampleLink' href="network/events/interactionEvents.html">interaction events, click, rightclick, drag etc.</a><br />
63 <a class='exampleLink' href="network/events/physicsEvents.html">physics events, stabilization etc.</a><br />
64 <a class='exampleLink' href="network/events/renderEvents.html">rendering events, use to draw custom items on the canvas.</a><br />
65
66 <h3>dynamic data - dot language</h3>
67 <a class='exampleLink' href="network/data/dotLanguage/dotEdgeStyles.html">DOT edge styles</a><br />
68 <a class='exampleLink' href="network/data/dotLanguage/dotLanguage.html">DOT Language</a><br />
69 <a class='exampleLink' href="network/data/dotLanguage/dotPlayground.html">DOT language playground</a><br />
70
71 <h3>dynamic data</h3>
72 <a class='exampleLink' href="network/data/datasets.html">dataset for dynamic data</a><br />
73 <a class='exampleLink' href="network/data/dynamicData.html">dynamic data, playground</a><br />
74 <a class='exampleLink' href="network/data/importingFromGephi.html">importing data from gephi</a><br />
75 <a class='exampleLink' href="network/data/scalingCustom.html">scaling the nodes with the value.</a><br />
76 <a class='exampleLink' href="network/data/scalingNodesEdges.html">scaling the nodes and edges with the value.</a><br />
77 <a class='exampleLink' href="network/data/scalingNodesEdgesLabels.html">scaling the nodes, edges and labels with the value.</a><br />
78
79 <h3>animation</h3>
80 <a class='exampleLink' href="network/other/animationShowcase.html">animation showcase</a><br />
81
82 <h3>clustering</h3>
83 <a class='exampleLink' href="network/other/changingClusteredEdgesNodes.html">changing clustered edges nodes</a><br />
84 <a class='exampleLink' href="network/other/clustering.html">clustering possibilities</a><br />
85 <a class='exampleLink' href="network/other/clusteringByZoom.html">clustering by zoom</a><br />
86 <a class='exampleLink' href="network/other/clustersOfclusters.html">clusters of clusters</a><br />
87
88 <h3>dynamic configuration interface</h3>
89 <a class='exampleLink' href="network/other/configuration.html">dynamic configuration</a><br />
90
91 <h3>physics</h3>
92 <a class='exampleLink' href="network/physics/physicsConfiguration.html">physics configuration</a><br />
93
94 <h3>data manipulation interface</h3>
95 <a class='exampleLink' href="network/other/manipulation.html">manipulation interface and localization</a><br />
96 <a class='exampleLink' href="network/other/manipulationEditEdgeNoDrag.html">manipulation edit edge no drag</a><br />
97
98 <h3>navigation buttons</h3>
99 <a class='exampleLink' href="network/other/navigation.html">navigation buttons and keyboard shortcuts</a><br />
100
101 <h3>misc</h3>
102 <a class='exampleLink' href="network/other/chosen.html">chosen</a><br />
103 <a class='exampleLink' href="network/other/cursorChange.html">cursor change</a><br />
104 <a class='exampleLink' href="network/other/onLoadAnimation.html">onLoad animation</a><br />
105 <a class='exampleLink' href="network/other/performance.html">performance test with scale free network</a><br />
106 <a class='exampleLink' href="network/other/saveAndLoad.html">save and load</a><br />
107
108
109 <h3>example applications</h3>
110 <a class='exampleLink' href="network/exampleApplications/disassemblerExample.html">disassembler example</a><br />
111 <a class='exampleLink' href="network/exampleApplications/lesMiserables.html">les miserables cast</a><br />
112 <a class='exampleLink' href="network/exampleApplications/loadingBar.html">loading bar during stabilization</a><br />
113 <a class='exampleLink' href="network/exampleApplications/neighbourhoodHighlight.html">neighbourhood highlight</a><br />
114 <a class='exampleLink' href="network/exampleApplications/nodeLegend.html">using nodes as a legend</a><br />
115 <a class='exampleLink' href="network/exampleApplications/worldCupPerformance.html">performance test with the worldcup data</a><br />
116
117</div>
118</body>
119</html>