diff --git a/docs/network.html b/docs/network.html
index e2ffb70b..a0142866 100644
--- a/docs/network.html
+++ b/docs/network.html
@@ -54,6 +54,7 @@
@@ -262,6 +263,21 @@ When using a DataSet, the network is automatically updating to changes in the Da
Description |
+
+ | borderWidth |
+ Number |
+ 1 |
+ The width of the border of the node when it is not selected, automatically limited by the width of the node. |
+
+
+
+
+ | borderWidthSelected |
+ Number |
+ undefined |
+ The width of the border of the node when it is selected. If left at undefined, double the borderWidth will be used. |
+
+
| color |
String | Object |
@@ -672,6 +688,14 @@ When using a DataSet, the network is automatically updating to changes in the Da
physics.[method].springLength |
The resting length of the edge when modeled as a spring. By default the springLength determined by the physics is used. By using this setting you can make certain edges have different resting lengths. |
+
+
+ | inheritColor |
+ String | Boolean |
+ false |
+ Possible values: "to","from", true, false. If this value is set to false, the edge color information is used. If the value is set to true or "from",
+ the color data from the borders of the "from" node is used. If this value is "to", the color data from the borders of the "to" node is used. |
+
| title |
string | function |
@@ -736,7 +760,85 @@ var data = {
var network = new vis.Network(container, data);
+Gephi import (JSON)
+
+
+ network can import data straight from an exported json file from gephi. You can get the JSON exporter here:
+ https://marketplace.gephi.org/plugin/json-exporter/.
+ An example exists showing how to get a JSON file into Vis: 30_importing_from_gephi.
+
+
+
+ Example usage:
+
+
+
+// load the JSON file containing the Gephi network.
+var gephiJSON = loadJSON("./data/WorldCup2014.json"); // code in example 30
+
+// create a data object with the gephi key:
+var data = {
+ gephi: gephiJSON
+};
+
+// create a network
+var network = new vis.Network(container, data);
+
+Alternatively you can use the parser manually:
+
+// load the JSON file containing the Gephi network.
+var gephiJSON = loadJSON("./data/WorldCup2014.json"); // code in example 30
+
+// parse the gephi file to receive an object
+// containing nodes and edges in vis format.
+var parsed = vis.network.gephiParser.parseGephi(gephiJSON);
+
+// provide data in the normal fashion
+var data = {
+ nodes: parsed.nodes,
+ edged: parsed.edges
+};
+
+// create a network
+var network = new vis.Network(container, data);
+
+
+Gephi parser options
+There are a few options you can use to tell Vis what to do with the data from Gephi.
+
+
+var parserOptions = {
+ allowedToMove: false,
+ parseColor: false
+}
+var parsed = vis.network.gephiParser.parseGephi(gephiJSON, parserOptions);
+
+
+
+ | Name |
+ Type |
+ Default |
+ Description |
+
+
+
+ | allowedToMove |
+ Boolean |
+ false |
+
+ If true, the nodes will move according to the physics model after import. If false, the nodes do not move at all.
+ |
+
+
+ | parseColor |
+ Boolean |
+ false |
+
+ If true, the color will be parsed by the vis parser, generating extra colors for the borders, highlighs and hover. If false, the node will be the supplied color.
+ |
+
+
Configuration options
@@ -874,7 +976,22 @@ var options = {
Toggle if the nodes can be dragged. This will not affect the dragging of the network.
-
+
+ | hideNodesOnDrag |
+ Boolean |
+ false |
+
+ Toggle if the nodes are drawn during a drag. This can greatly improve performance if you have many nodes.
+ |
+
+
+ | hideEdgesOnDrag |
+ Boolean |
+ false |
+
+ Toggle if the edges are drawn during a drag. This can greatly improve performance if you have many edges.
+ |
+
| navigation |
Object |
@@ -895,11 +1012,31 @@ var options = {
| smoothCurves |
+ Boolean || object |
+ object |
+ If true, edges are drawn as smooth curves. This is more computationally intensive since the edge now is a quadratic Bezier curve. This can be further configured by the options below. |
+
+
+
+ | smoothCurves.dynamic |
Boolean |
true |
- If true, edges are drawn as smooth curves. This is more computationally intensive since the edge now is a quadratic Bezier curve with control points on both nodes and an invisible node in the center of the edge. This support node is also handed by the physics simulation. |
+ By default, the edges are dynamic. This means there are support nodes placed in the middle of the edge. This support node is also handed by the physics simulation. If false, the smoothness will be based on the
+ relative positions of the to and from nodes. This is computationally cheaper but there is no self organisation. |
+
+
+ | smoothCurves.type |
+ String |
+ "continuous" |
+ This option only affects NONdynamic smooth curves. The supported types are: continuous, discrete, diagonalCross, straightCross, horizontal, vertical. The effects of these types
+ are shown in examples 26 and 27 |
+
+
+ | smoothCurves.roundness |
+ Number |
+ 0.5 |
+ This only affects NONdynamic smooth curves. The roundness can be tweaked with the parameter. The value range is from 0 to 1 with a maximum roundness at 0.5. |
-
| selectable |
Boolean |
@@ -1223,6 +1360,14 @@ var options = {
The resting length of the edge when modeled as a spring. By default the springLength determined by the physics is used. By using this setting you can make certain edges have different resting lengths. |
+
+ | inheritColor |
+ String | Boolean |
+ false |
+ Possible values: "to","from", true, false. If this value is set to false, the edge color information is used. If the value is set to true or "from",
+ the color data from the borders of the "from" node is used. If this value is "to", the color data from the borders of the "to" node is used. |
+
+
| style |
String |
@@ -2366,7 +2511,8 @@ network.off('select', onSelect);
| stabilized |
- Fired when the network has been stabilized after initialization. This event can be used to trigger the .storePosition() function after stabilization. |
+ Fired when the network has been stabilized. This event can be used to trigger the .storePosition() function after stabilization. When the network in initialized, the parameter
+ iterations will be the amount of iterations it took to stabilize. After initialization, this parameter is null. |
iterations: number of iterations used to stabilizemargin.item |
Number |
10 |
- The minimal margin in pixels between items. |
+ The minimal margin in pixels between items in both horizontal and vertical direction. |
+ |
+
+
+ | margin.item.horizontal |
+ Number |
+ 10 |
+ The minimal horizontal margin in pixels between items. |
+
+
+
+ | margin.item.vertical |
+ Number |
+ 10 |
+ The minimal vertical margin in pixels between items. |
@@ -726,6 +740,12 @@ timeline.clear({options: true}); // clear options only
| Get an array with the ids of the currently selected items. |
+
+ | getVisibleItems() |
+ Number[] |
+ Get an array with the ids of the currently visible items. |
+
+
| getWindow() |
Object |
diff --git a/examples/network/02_random_nodes.html b/examples/network/02_random_nodes.html
index 9a8b1c00..d494d741 100644
--- a/examples/network/02_random_nodes.html
+++ b/examples/network/02_random_nodes.html
@@ -31,7 +31,8 @@
for (var i = 0; i < nodeCount; i++) {
nodes.push({
id: i,
- label: String(i)
+ label: String(i),
+ radius:300
});
connectionCount[i] = 0;
@@ -81,12 +82,12 @@
},
stabilize: false
};
- network = new vis.Network(container, data, options);
+ network = new vis.Network(container, data, options);
- // add event listeners
- network.on('select', function(params) {
- document.getElementById('selection').innerHTML = 'Selection: ' + params.nodes;
- });
+ // add event listeners
+ network.on('select', function(params) {
+ document.getElementById('selection').innerHTML = 'Selection: ' + params.nodes;
+ });
}
diff --git a/examples/network/07_selections.html b/examples/network/07_selections.html
index 8b4ba05d..32d84e16 100644
--- a/examples/network/07_selections.html
+++ b/examples/network/07_selections.html
@@ -56,7 +56,7 @@
});
// set initial selection (id's of some nodes)
- network.setSelection([3, 4, 5]);
+ network.selectNodes([3, 4, 5]);