jrtechs
/
jrtechs-vis
mirror of https://github.com/jrtechs/vis.git
1
0
Fork 0
Code Issues 0 Releases 82 Wiki Activity
Browse Source

Merge remote-tracking branch 'origin/develop' into develop 

Conflicts:
	dist/vis.js
v3_develop
jos 10 years ago
parent
27bc2fb8a6 93056303f7
commit
b7165fac58
11 changed files with 10398 additions and 15 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +15
    -7
      dist/vis-light.js
  2. +7
    -0
      docs/dataset.html
  3. +2
    -1
      examples/network/02_random_nodes.html
  4. +10212
    -0
      examples/network/29_neighbourhood_highlight.html
  5. +87
    -0
      examples/network/30_importing_from_gephi.html
  6. +1
    -0
      examples/network/data/WorldCup2014.json
  7. +10
    -2
      lib/DataSet.js
  8. +0
    -1
      lib/network/Groups.js
  9. +2
    -1
      lib/network/Node.js
  10. +59
    -0
      lib/network/gephiParser.js
  11. +3
    -3
      lib/util.js

+ 15
- 7
dist/vis-light.js View File

@ -1039,9 +1039,9 @@ return /******/ (function(modules) { // webpackBootstrap
/** /**
* https://gist.github.com/mjijackson/5311256 * https://gist.github.com/mjijackson/5311256
* @param hue
* @param saturation
* @param value
* @param h
* @param s
* @param v
* @returns {{r: number, g: number, b: number}} * @returns {{r: number, g: number, b: number}}
* @constructor * @constructor
*/ */
@ -1842,7 +1842,8 @@ return /******/ (function(modules) { // webpackBootstrap
// determine the return type // determine the return type
var returnType; var returnType;
if (options && options.returnType) { if (options && options.returnType) {
returnType = (options.returnType == 'DataTable') ? 'DataTable' : 'Array';
var allowedValues = ["DataTable", "Array", "Object"];
returnType = allowedValues.indexOf(options.returnType) == -1 ? "Array" : options.returnType;
if (data && (returnType != util.getType(data))) { if (data && (returnType != util.getType(data))) {
throw new Error('Type of parameter "data" (' + util.getType(data) + ') ' + throw new Error('Type of parameter "data" (' + util.getType(data) + ') ' +
@ -1921,12 +1922,19 @@ return /******/ (function(modules) { // webpackBootstrap
} }
else { else {
// copy the items to the provided data table // copy the items to the provided data table
for (i = 0, len = items.length; i < len; i++) {
for (i = 0; i < items.length; i++) {
me._appendRow(data, columns, items[i]); me._appendRow(data, columns, items[i]);
} }
} }
return data; return data;
} }
else if (returnType == "Object") {
var result = {};
for (i = 0; i < items.length; i++) {
result[items[i].id] = items[i];
}
return result;
}
else { else {
// return an array // return an array
if (id != undefined) { if (id != undefined) {
@ -18198,7 +18206,6 @@ return /******/ (function(modules) { // webpackBootstrap
*/ */
Groups.prototype.get = function (groupname) { Groups.prototype.get = function (groupname) {
var group = this.groups[groupname]; var group = this.groups[groupname];
if (group == undefined) { if (group == undefined) {
// create new group // create new group
var index = this.defaultIndex % Groups.DEFAULT.length; var index = this.defaultIndex % Groups.DEFAULT.length;
@ -18455,7 +18462,7 @@ return /******/ (function(modules) { // webpackBootstrap
} }
// copy group properties // copy group properties
if (this.group) {
if (this.group !== undefined) {
var groupObj = this.grouplist.get(this.group); var groupObj = this.grouplist.get(this.group);
for (var prop in groupObj) { for (var prop in groupObj) {
if (groupObj.hasOwnProperty(prop)) { if (groupObj.hasOwnProperty(prop)) {
@ -18464,6 +18471,7 @@ return /******/ (function(modules) { // webpackBootstrap
} }
} }
// individual shape properties // individual shape properties
if (properties.shape !== undefined) {this.shape = properties.shape;} if (properties.shape !== undefined) {this.shape = properties.shape;}
if (properties.image !== undefined) {this.image = properties.image;} if (properties.image !== undefined) {this.image = properties.image;}

+ 7
- 0
docs/dataset.html View File

@ -691,6 +691,13 @@ DataSet.map(callback [, options]);
<td>Order the items by a field name or custom sort function.</td> <td>Order the items by a field name or custom sort function.</td>
</tr> </tr>
<tr>
<td>returnType</td>
<td>String</td>
<td>Determine the type of output of the get function. Allowed values are <code>Array | Object | DataTable</code>.
The <code>DataTable</code> refers to a Google DataTable. The default returnType is an array. The object type will return a JSON object with the ID's as keys.</td>
</tr>
</table> </table>
<p> <p>

+ 2
- 1
examples/network/02_random_nodes.html View File

@ -31,7 +31,8 @@
for (var i = 0; i < nodeCount; i++) { for (var i = 0; i < nodeCount; i++) {
nodes.push({ nodes.push({
id: i, id: i,
label: String(i)
label: String(i),
radius:300
}); });
connectionCount[i] = 0; connectionCount[i] = 0;

+ 10212
- 0
examples/network/29_neighbourhood_highlight.html
File diff suppressed because it is too large
View File


+ 87
- 0
examples/network/30_importing_from_gephi.html View File

@ -0,0 +1,87 @@
<!DOCTYPE html>
<!-- saved from url=(0044)http://kenedict.com/networks/worldcup14/vis/ , thanks Andre!-->
<html><head><meta http-equiv="content-type" content="text/html; charset=UTF8">
<title>Network | Static smooth curves - World Cup Network</title>
<script type="text/javascript" src="../../dist/vis.js"></script>
<link type="text/css" rel="stylesheet" href="../../dist/vis.css">
<style type="text/css">
#mynetwork {
width: 800px;
height: 800px;
border: 1px solid lightgray;
}
</style>
</head>
<body>
<h2>Dynamic Data - Neighbourhood Highlight</h2>
<div style="width:700px; font-size:14px;">
This example shows the power of the DataSet. Once a node is clicked, all nodes are greyed out except for the first and second order connected nodes.
In this example we show how you can determine the order of connection per node as well as applying individual styling to the nodes based on whether or not
they are connected to the selected node. The code doing the highlighting only takes about 20ms, the rest of the time is the redrawing of the network (9200 edges..).
</div>
<div id="mynetwork"></div>
<script type="text/javascript">
var network;
var nodes = new vis.DataSet();
var edges = new vis.DataSet();
function redrawAll() {
nodes.clear();
edges.clear();
network = null;
// create an array with nodes
nodes.add(nodesData);
edges.add(edgesData);
var container = document.getElementById('mynetwork');
var data = {
nodes: nodes,
edges: edges
};
var options = {
nodes: {
shape: 'dot',
radiusMin: 10,
radiusMax: 30,
fontSize: 12,
fontFace: "Tahoma"
},
edges: {
width: 0.15,
inheritColor: "from"
},
tooltip: {
delay: 200,
fontSize: 12,
color: {
background: "#fff"
}
},
smoothCurves: {dynamic:false, type: "continuous"},
stabilize: false,
physics: {barnesHut: {gravitationalConstant: 0, centralGravity: 0, springConstant: 0}},
hideEdgesOnDrag: true
};
network = new vis.Network(container, data, options);
}
redrawAll()
</script>
</body></html>

+ 1
- 0
examples/network/data/WorldCup2014.json
File diff suppressed because it is too large
View File


+ 10
- 2
lib/DataSet.js View File

@ -322,7 +322,8 @@ DataSet.prototype.get = function (args) {
// determine the return type // determine the return type
var returnType; var returnType;
if (options && options.returnType) { if (options && options.returnType) {
returnType = (options.returnType == 'DataTable') ? 'DataTable' : 'Array';
var allowedValues = ["DataTable", "Array", "Object"];
returnType = allowedValues.indexOf(options.returnType) == -1 ? "Array" : options.returnType;
if (data && (returnType != util.getType(data))) { if (data && (returnType != util.getType(data))) {
throw new Error('Type of parameter "data" (' + util.getType(data) + ') ' + throw new Error('Type of parameter "data" (' + util.getType(data) + ') ' +
@ -401,12 +402,19 @@ DataSet.prototype.get = function (args) {
} }
else { else {
// copy the items to the provided data table // copy the items to the provided data table
for (i = 0, len = items.length; i < len; i++) {
for (i = 0; i < items.length; i++) {
me._appendRow(data, columns, items[i]); me._appendRow(data, columns, items[i]);
} }
} }
return data; return data;
} }
else if (returnType == "Object") {
var result = {};
for (i = 0; i < items.length; i++) {
result[items[i].id] = items[i];
}
return result;
}
else { else {
// return an array // return an array
if (id != undefined) { if (id != undefined) {

+ 0
- 1
lib/network/Groups.js View File

@ -53,7 +53,6 @@ Groups.prototype.clear = function () {
*/ */
Groups.prototype.get = function (groupname) { Groups.prototype.get = function (groupname) {
var group = this.groups[groupname]; var group = this.groups[groupname];
if (group == undefined) { if (group == undefined) {
// create new group // create new group
var index = this.defaultIndex % Groups.DEFAULT.length; var index = this.defaultIndex % Groups.DEFAULT.length;

+ 2
- 1
lib/network/Node.js View File

@ -171,7 +171,7 @@ Node.prototype.setProperties = function(properties, constants) {
} }
// copy group properties // copy group properties
if (this.group) {
if (this.group !== undefined) {
var groupObj = this.grouplist.get(this.group); var groupObj = this.grouplist.get(this.group);
for (var prop in groupObj) { for (var prop in groupObj) {
if (groupObj.hasOwnProperty(prop)) { if (groupObj.hasOwnProperty(prop)) {
@ -180,6 +180,7 @@ Node.prototype.setProperties = function(properties, constants) {
} }
} }
// individual shape properties // individual shape properties
if (properties.shape !== undefined) {this.shape = properties.shape;} if (properties.shape !== undefined) {this.shape = properties.shape;}
if (properties.image !== undefined) {this.image = properties.image;} if (properties.image !== undefined) {this.image = properties.image;}

+ 59
- 0
lib/network/gephiParser.js View File

@ -0,0 +1,59 @@
function parseGephi(gephiJSON, options) {
var edges = [];
var nodes = [];
this.options = {
edges: {
inheritColor: 'from'
},
nodes: {
allowedToMove: false,
parseColor: false
}
};
if (options !== undefined) {
this.options.edges['inheritColor'] = options.inheritColor | 'from';
this.options.nodes['allowedToMove'] = options.allowedToMove | false;
this.options.nodes['parseColor'] = options.parseColor | false;
}
var gEdges = gephiJSON.edges;
var gNodes = gephiJSON.nodes;
for (var i = 0; i < gEdges.length; i++) {
var edge = {};
edge['id'] = gEdges.id;
edge['from'] = gEdges.source;
edge['to'] = gEdges.target;
edge['attributes'] = gEdges.attributes;
edge['value'] = gEdges.attributes !== undefined ? gEdges.attributes.Weight : undefined;
edge['width'] = gEdges.size;
edge['color'] = gEdges.color;
edge['inheritColor'] = edge['color'] !== undefined ? false : this.options.inheritColor;
edges.push(edge);
}
for (var i = 0; i < gNodes.length; i++) {
var node = {};
node['id'] = gNodes.id;
node['attributes'] = gNodes.attributes;
node['x'] = gNodes.x;
node['y'] = gNodes.y;
node['label'] = gNodes.label;
if (this.options.parseColor == true) {
node['color'] = gNodes.color;
}
else {
node['color'] = gNodes.color !== undefined ? {background:gNodes.color, border:gNodes.color} : undefined;
}
node['radius'] = gNodes.size;
node['allowedToMoveX'] = this.options.allowedToMove;
node['allowedToMoveY'] = this.options.allowedToMove;
node['shape'] = 'dot'
nodes.push(node);
}
return {nodes:nodes, edges:edges};
}
exports.parseGephi = parseGephi;

+ 3
- 3
lib/util.js View File

@ -888,9 +888,9 @@ exports.RGBToHSV = function(red,green,blue) {
/** /**
* https://gist.github.com/mjijackson/5311256 * https://gist.github.com/mjijackson/5311256
* @param hue
* @param saturation
* @param value
* @param h
* @param s
* @param v
* @returns {{r: number, g: number, b: number}} * @returns {{r: number, g: number, b: number}}
* @constructor * @constructor
*/ */

Write Preview
Loading…
Cancel
Save