From 05e761abca3ff42dbba371af0560b82707dfe7c0 Mon Sep 17 00:00:00 2001 From: Pliable Pixels Date: Fri, 28 Oct 2016 13:31:36 -0700 Subject: updated vis --- .../vis/examples/network/edgeStyles/arrows.html | 61 ++++++++++++++ .../vis/examples/network/edgeStyles/colors.html | 67 +++++++++++++++ .../vis/examples/network/edgeStyles/dashes.html | 57 +++++++++++++ .../vis/examples/network/edgeStyles/smooth.html | 78 +++++++++++++++++ .../network/edgeStyles/smoothWorldCup.html | 97 ++++++++++++++++++++++ 5 files changed, 360 insertions(+) create mode 100644 www/lib/vis/examples/network/edgeStyles/arrows.html create mode 100644 www/lib/vis/examples/network/edgeStyles/colors.html create mode 100644 www/lib/vis/examples/network/edgeStyles/dashes.html create mode 100644 www/lib/vis/examples/network/edgeStyles/smooth.html create mode 100644 www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html (limited to 'www/lib/vis/examples/network/edgeStyles') diff --git a/www/lib/vis/examples/network/edgeStyles/arrows.html b/www/lib/vis/examples/network/edgeStyles/arrows.html new file mode 100644 index 00000000..6baed1cf --- /dev/null +++ b/www/lib/vis/examples/network/edgeStyles/arrows.html @@ -0,0 +1,61 @@ + + + + Network | Basic usage + + + + + + + + +

+ There are a lot of options with arrows! They can also be combined with dashed lines. +

+ +
+ + + + + + diff --git a/www/lib/vis/examples/network/edgeStyles/colors.html b/www/lib/vis/examples/network/edgeStyles/colors.html new file mode 100644 index 00000000..2c2916ac --- /dev/null +++ b/www/lib/vis/examples/network/edgeStyles/colors.html @@ -0,0 +1,67 @@ + + + + Network | Basic usage + + + + + + + + +

+ There are a lot of options with colors. You can manually define a color or inherit the color from the nodes. You can set the opacity + to override any opacity given by a color. IN ORDER TO USE THE OPACITY, BOTH THE NODES AND THE EDGES NEED COLORS IN HEX OR RGB! +

+ +
+ + + + + + diff --git a/www/lib/vis/examples/network/edgeStyles/dashes.html b/www/lib/vis/examples/network/edgeStyles/dashes.html new file mode 100644 index 00000000..f545b832 --- /dev/null +++ b/www/lib/vis/examples/network/edgeStyles/dashes.html @@ -0,0 +1,57 @@ + + + + Network | Basic usage + + + + + + + + +

+ Playing with dashes. +

+ +
+ + + + + + diff --git a/www/lib/vis/examples/network/edgeStyles/smooth.html b/www/lib/vis/examples/network/edgeStyles/smooth.html new file mode 100644 index 00000000..899ed627 --- /dev/null +++ b/www/lib/vis/examples/network/edgeStyles/smooth.html @@ -0,0 +1,78 @@ + + + + Network | Static smooth curves + + + + + + + + + + +

Smooth curves

+
+ All the smooth curves in the examples so far have been using dynamic smooth curves. This means that each curve has a + support node which takes part in the physics simulation. For large networks or dense clusters, this may not be the ideal + solution. To solve this, static smooth curves have been added. The static smooth curves are based only on the positions of the connected + nodes. There are multiple ways to determine the way this curve is drawn. This example shows the effect of the different + types.

+ Drag the node around to see how the smooth curves are drawn for each setting. For animated system, we + recommend only the continuous mode. In the next example you can see the effect of these methods on a large network. Keep in mind + that the direction (the from and to) of the curve matters. +

+ When you select the dynamic type, you can see the interaction with the fixed node and the edge, any other type will not interact with other nodes. +

+
+ +
+ + + + + diff --git a/www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html b/www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html new file mode 100644 index 00000000..12846011 --- /dev/null +++ b/www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html @@ -0,0 +1,97 @@ + + + + + + Network | Static smooth curves - World Cup Network + + + + + + + + + + + + +

Static smooth curves - World Cup Network

+ +
+ The static smooth curves are based only on the positions of the connected + nodes. + There are multiple ways to determine the way this curve is drawn. + This example shows the effect of the different types on a large network. +

+ Also shown in this example is the inheritColor option of the edges as well as + the roundness factor. Because the physics has been disabled, the dynamic smooth curves do not work here. +
+ +
+ +
+ + + + + -- cgit v1.2.3