From b75fe65dd0a9b93abdd71e033da3a89bd5dea6a6 Mon Sep 17 00:00:00 2001
From: Alex de Mulder <alexdemulder@gmail.com>
Date: Tue, 21 Jul 2015 11:30:35 +0200
Subject: [PATCH] - Fixed #1111, check if edges exist was not correct on
 update.

---
 HISTORY.md                          |   2 +
 dist/vis.js                         | 228 +++++-----
 lib/network/modules/EdgesHandler.js |   2 +-
 test/networkTest.html               | 643 +++++++++++++++++++++++-----
 4 files changed, 659 insertions(+), 216 deletions(-)

diff --git a/HISTORY.md b/HISTORY.md
index f3be2d68..bef64c01 100644
--- a/HISTORY.md
+++ b/HISTORY.md
@@ -5,7 +5,9 @@ http://visjs.org
 ## not yet released, version 4.5.2-SNAPSHOT
 
 
+### Network
 
+- Fixed #1111, check if edges exist was not correct on update.
 
 ## 2015-07-20, version 4.5.1
 
diff --git a/dist/vis.js b/dist/vis.js
index a167da4b..62b3e38b 100644
--- a/dist/vis.js
+++ b/dist/vis.js
@@ -5,7 +5,7 @@
  * A dynamic, browser-based visualization library.
  *
  * @version 4.5.2-SNAPSHOT
- * @date    2015-07-20
+ * @date    2015-07-21
  *
  * @license
  * Copyright (C) 2011-2014 Almende B.V, http://almende.com
@@ -3501,7 +3501,7 @@ return /******/ (function(modules) { // webpackBootstrap
    * @param value
    */
   exports.fillIfDefined = function (a, b) {
-    var allowDeletion = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+    var allowDeletion = arguments[2] === undefined ? false : arguments[2];
 
     for (var prop in a) {
       if (b[prop] !== undefined) {
@@ -3591,7 +3591,7 @@ return /******/ (function(modules) { // webpackBootstrap
    * @return {Object} a
    */
   exports.selectiveDeepExtend = function (props, a, b) {
-    var allowDeletion = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3];
+    var allowDeletion = arguments[3] === undefined ? false : arguments[3];
 
     // TODO: add support for Arrays to deepExtend
     if (Array.isArray(b)) {
@@ -3635,7 +3635,7 @@ return /******/ (function(modules) { // webpackBootstrap
    * @return {Object} a
    */
   exports.selectiveNotDeepExtend = function (props, a, b) {
-    var allowDeletion = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3];
+    var allowDeletion = arguments[3] === undefined ? false : arguments[3];
 
     // TODO: add support for Arrays to deepExtend
     if (Array.isArray(b)) {
@@ -4559,7 +4559,7 @@ return /******/ (function(modules) { // webpackBootstrap
    * @private
    */
   exports.mergeOptions = function (mergeTarget, options, option) {
-    var allowDeletion = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3];
+    var allowDeletion = arguments[3] === undefined ? false : arguments[3];
 
     if (options[option] === null) {
       mergeTarget[option] = undefined;
@@ -21092,7 +21092,7 @@ return /******/ (function(modules) { // webpackBootstrap
 
   var Configurator = (function () {
     function Configurator(parentModule, defaultContainer, configureOptions) {
-      var pixelRatio = arguments.length <= 3 || arguments[3] === undefined ? 1 : arguments[3];
+      var pixelRatio = arguments[3] === undefined ? 1 : arguments[3];
 
       _classCallCheck(this, Configurator);
 
@@ -21354,7 +21354,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _makeLabel(name, path) {
-        var objectLabel = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+        var objectLabel = arguments[2] === undefined ? false : arguments[2];
 
         var div = document.createElement('div');
         div.className = 'vis-network-configuration label s' + path.length;
@@ -21587,8 +21587,8 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _handleObject(obj) {
-        var path = arguments.length <= 1 || arguments[1] === undefined ? [] : arguments[1];
-        var checkOnly = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+        var path = arguments[1] === undefined ? [] : arguments[1];
+        var checkOnly = arguments[2] === undefined ? false : arguments[2];
 
         var show = false;
         var filter = this.options.filter;
@@ -21706,7 +21706,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: '_constructOptions',
       value: function _constructOptions(value, path) {
-        var optionsObj = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
+        var optionsObj = arguments[2] === undefined ? {} : arguments[2];
 
         var pointer = optionsObj;
 
@@ -21771,7 +21771,7 @@ return /******/ (function(modules) { // webpackBootstrap
 
   var ColorPicker = (function () {
     function ColorPicker() {
-      var pixelRatio = arguments.length <= 0 || arguments[0] === undefined ? 1 : arguments[0];
+      var pixelRatio = arguments[0] === undefined ? 1 : arguments[0];
 
       _classCallCheck(this, ColorPicker);
 
@@ -21848,7 +21848,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param setInitial
        */
       value: function setColor(color) {
-        var setInitial = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var setInitial = arguments[1] === undefined ? true : arguments[1];
 
         if (color === 'none') {
           return;
@@ -21917,7 +21917,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _hide() {
-        var storePrevious = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
+        var storePrevious = arguments[0] === undefined ? true : arguments[0];
 
         // store the previous color for next time;
         if (storePrevious === true) {
@@ -21978,7 +21978,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _setColor(rgba) {
-        var setInitial = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var setInitial = arguments[1] === undefined ? true : arguments[1];
 
         // store the initial color
         if (setInitial === true) {
@@ -22035,7 +22035,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _updatePicker() {
-        var rgba = arguments.length <= 0 || arguments[0] === undefined ? this.color : arguments[0];
+        var rgba = arguments[0] === undefined ? this.color : arguments[0];
 
         var hsv = util.RGBToHSV(rgba.r, rgba.g, rgba.b);
         var ctx = this.colorPickerCanvas.getContext('2d');
@@ -22539,7 +22539,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @returns {{closestMatch: string, path: Array, distance: number}}
        */
       value: function findInOptions(option, options, path) {
-        var recursive = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3];
+        var recursive = arguments[3] === undefined ? false : arguments[3];
 
         var min = 1e9;
         var closestMatch = '';
@@ -22573,7 +22573,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: 'printLocation',
       value: function printLocation(path, option) {
-        var prefix = arguments.length <= 2 || arguments[2] === undefined ? 'Problem value found at: \n' : arguments[2];
+        var prefix = arguments[2] === undefined ? 'Problem value found at: \n' : arguments[2];
 
         var str = '\n\n' + prefix + 'options = {\n';
         for (var i = 0; i < path.length; i++) {
@@ -22606,9 +22606,9 @@ return /******/ (function(modules) { // webpackBootstrap
       // http://en.wikibooks.org/wiki/Algorithm_Implementation/Strings/Levenshtein_distance#JavaScript
       /*
        Copyright (c) 2011 Andrei Mackenzie
-        Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-        The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-        THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+         Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+         The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+         THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
        */
       value: function levenshteinDistance(a, b) {
         if (a.length === 0) return b.length;
@@ -27293,7 +27293,7 @@ return /******/ (function(modules) { // webpackBootstrap
       value: function setData(nodes) {
         var _this3 = this;
 
-        var doNotEmit = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var doNotEmit = arguments[1] === undefined ? false : arguments[1];
 
         var oldNodesData = this.body.data.nodes;
 
@@ -27345,7 +27345,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function add(ids) {
-        var doNotEmit = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var doNotEmit = arguments[1] === undefined ? false : arguments[1];
 
         var id = undefined;
         var newNodes = [];
@@ -27421,14 +27421,14 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param constructorClass
        */
       value: function create(properties) {
-        var constructorClass = arguments.length <= 1 || arguments[1] === undefined ? _componentsNode2['default'] : arguments[1];
+        var constructorClass = arguments[1] === undefined ? _componentsNode2['default'] : arguments[1];
 
         return new constructorClass(properties, this.body, this.images, this.groups, this.options);
       }
     }, {
       key: 'refresh',
       value: function refresh() {
-        var clearPositions = arguments.length <= 0 || arguments[0] === undefined ? false : arguments[0];
+        var clearPositions = arguments[0] === undefined ? false : arguments[0];
 
         var nodes = this.body.nodes;
         for (var nodeId in nodes) {
@@ -28053,7 +28053,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param newOptions
        */
       value: function parseOptions(parentOptions, newOptions) {
-        var allowDeletion = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+        var allowDeletion = arguments[2] === undefined ? false : arguments[2];
 
         var fields = ['color', 'font', 'fixed', 'shadow'];
         util.selectiveNotDeepExtend(fields, parentOptions, newOptions, allowDeletion);
@@ -28136,7 +28136,7 @@ return /******/ (function(modules) { // webpackBootstrap
     _createClass(Label, [{
       key: 'setOptions',
       value: function setOptions(options) {
-        var allowDeletion = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var allowDeletion = arguments[1] === undefined ? false : arguments[1];
 
         this.options = options;
 
@@ -28167,7 +28167,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param baseline
        */
       value: function draw(ctx, x, y, selected) {
-        var baseline = arguments.length <= 4 || arguments[4] === undefined ? 'middle' : arguments[4];
+        var baseline = arguments[4] === undefined ? 'middle' : arguments[4];
 
         // if no label, return
         if (this.options.label === undefined) return;
@@ -28225,7 +28225,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _drawText(ctx, selected, x, y) {
-        var baseline = arguments.length <= 4 || arguments[4] === undefined ? 'middle' : arguments[4];
+        var baseline = arguments[4] === undefined ? 'middle' : arguments[4];
 
         var fontSize = this.options.font.size;
         var viewFontSize = fontSize * this.body.view.scale;
@@ -28327,7 +28327,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @returns {{width: number, height: number}}
        */
       value: function getTextSize(ctx) {
-        var selected = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var selected = arguments[1] === undefined ? false : arguments[1];
 
         var size = {
           width: this._processLabel(ctx, selected),
@@ -28348,9 +28348,9 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param baseline
        */
       value: function calculateLabelSize(ctx, selected) {
-        var x = arguments.length <= 2 || arguments[2] === undefined ? 0 : arguments[2];
-        var y = arguments.length <= 3 || arguments[3] === undefined ? 0 : arguments[3];
-        var baseline = arguments.length <= 4 || arguments[4] === undefined ? 'middle' : arguments[4];
+        var x = arguments[2] === undefined ? 0 : arguments[2];
+        var y = arguments[3] === undefined ? 0 : arguments[3];
+        var baseline = arguments[4] === undefined ? 'middle' : arguments[4];
 
         if (this.labelDirty === true) {
           this.size.width = this._processLabel(ctx, selected);
@@ -28399,7 +28399,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }], [{
       key: 'parseOptions',
       value: function parseOptions(parentOptions, newOptions) {
-        var allowDeletion = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+        var allowDeletion = arguments[2] === undefined ? false : arguments[2];
 
         if (typeof newOptions.font === 'string') {
           var newOptionsArray = newOptions.font.split(' ');
@@ -28444,14 +28444,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var Box = (function (_NodeBase) {
-    _inherits(Box, _NodeBase);
-
     function Box(options, body, labelModule) {
       _classCallCheck(this, Box);
 
       _get(Object.getPrototypeOf(Box.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Box, _NodeBase);
+
     _createClass(Box, [{
       key: 'resize',
       value: function resize(ctx, selected) {
@@ -28635,14 +28635,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilCircleImageBase2 = _interopRequireDefault(_utilCircleImageBase);
 
   var Circle = (function (_CircleImageBase) {
-    _inherits(Circle, _CircleImageBase);
-
     function Circle(options, body, labelModule) {
       _classCallCheck(this, Circle);
 
       _get(Object.getPrototypeOf(Circle.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Circle, _CircleImageBase);
+
     _createClass(Circle, [{
       key: 'resize',
       value: function resize(ctx, selected) {
@@ -28725,8 +28725,6 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var CircleImageBase = (function (_NodeBase) {
-    _inherits(CircleImageBase, _NodeBase);
-
     function CircleImageBase(options, body, labelModule) {
       _classCallCheck(this, CircleImageBase);
 
@@ -28735,6 +28733,8 @@ return /******/ (function(modules) { // webpackBootstrap
       this.imageLoaded = false;
     }
 
+    _inherits(CircleImageBase, _NodeBase);
+
     _createClass(CircleImageBase, [{
       key: '_resizeImage',
 
@@ -28877,8 +28877,6 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilCircleImageBase2 = _interopRequireDefault(_utilCircleImageBase);
 
   var CircularImage = (function (_CircleImageBase) {
-    _inherits(CircularImage, _CircleImageBase);
-
     function CircularImage(options, body, labelModule, imageObj) {
       _classCallCheck(this, CircularImage);
 
@@ -28887,6 +28885,8 @@ return /******/ (function(modules) { // webpackBootstrap
       this._swapToImageResizeWhenImageLoaded = true;
     }
 
+    _inherits(CircularImage, _CircleImageBase);
+
     _createClass(CircularImage, [{
       key: 'resize',
       value: function resize() {
@@ -28982,14 +28982,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var Database = (function (_NodeBase) {
-    _inherits(Database, _NodeBase);
-
     function Database(options, body, labelModule) {
       _classCallCheck(this, Database);
 
       _get(Object.getPrototypeOf(Database.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Database, _NodeBase);
+
     _createClass(Database, [{
       key: 'resize',
       value: function resize(ctx, selected) {
@@ -29093,14 +29093,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilShapeBase2 = _interopRequireDefault(_utilShapeBase);
 
   var Diamond = (function (_ShapeBase) {
-    _inherits(Diamond, _ShapeBase);
-
     function Diamond(options, body, labelModule) {
       _classCallCheck(this, Diamond);
 
       _get(Object.getPrototypeOf(Diamond.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Diamond, _ShapeBase);
+
     _createClass(Diamond, [{
       key: 'resize',
       value: function resize(ctx) {
@@ -29149,14 +29149,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var ShapeBase = (function (_NodeBase) {
-    _inherits(ShapeBase, _NodeBase);
-
     function ShapeBase(options, body, labelModule) {
       _classCallCheck(this, ShapeBase);
 
       _get(Object.getPrototypeOf(ShapeBase.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(ShapeBase, _NodeBase);
+
     _createClass(ShapeBase, [{
       key: '_resizeShape',
       value: function _resizeShape() {
@@ -29252,14 +29252,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilShapeBase2 = _interopRequireDefault(_utilShapeBase);
 
   var Dot = (function (_ShapeBase) {
-    _inherits(Dot, _ShapeBase);
-
     function Dot(options, body, labelModule) {
       _classCallCheck(this, Dot);
 
       _get(Object.getPrototypeOf(Dot.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Dot, _ShapeBase);
+
     _createClass(Dot, [{
       key: 'resize',
       value: function resize(ctx) {
@@ -29308,14 +29308,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var Ellipse = (function (_NodeBase) {
-    _inherits(Ellipse, _NodeBase);
-
     function Ellipse(options, body, labelModule) {
       _classCallCheck(this, Ellipse);
 
       _get(Object.getPrototypeOf(Ellipse.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Ellipse, _NodeBase);
+
     _createClass(Ellipse, [{
       key: 'resize',
       value: function resize(ctx, selected) {
@@ -29421,14 +29421,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var Icon = (function (_NodeBase) {
-    _inherits(Icon, _NodeBase);
-
     function Icon(options, body, labelModule) {
       _classCallCheck(this, Icon);
 
       _get(Object.getPrototypeOf(Icon.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Icon, _NodeBase);
+
     _createClass(Icon, [{
       key: 'resize',
       value: function resize(ctx) {
@@ -29537,8 +29537,6 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilCircleImageBase2 = _interopRequireDefault(_utilCircleImageBase);
 
   var Image = (function (_CircleImageBase) {
-    _inherits(Image, _CircleImageBase);
-
     function Image(options, body, labelModule, imageObj) {
       _classCallCheck(this, Image);
 
@@ -29546,6 +29544,8 @@ return /******/ (function(modules) { // webpackBootstrap
       this.imageObj = imageObj;
     }
 
+    _inherits(Image, _CircleImageBase);
+
     _createClass(Image, [{
       key: 'resize',
       value: function resize() {
@@ -29625,14 +29625,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilShapeBase2 = _interopRequireDefault(_utilShapeBase);
 
   var Square = (function (_ShapeBase) {
-    _inherits(Square, _ShapeBase);
-
     function Square(options, body, labelModule) {
       _classCallCheck(this, Square);
 
       _get(Object.getPrototypeOf(Square.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Square, _ShapeBase);
+
     _createClass(Square, [{
       key: 'resize',
       value: function resize() {
@@ -29682,14 +29682,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilShapeBase2 = _interopRequireDefault(_utilShapeBase);
 
   var Star = (function (_ShapeBase) {
-    _inherits(Star, _ShapeBase);
-
     function Star(options, body, labelModule) {
       _classCallCheck(this, Star);
 
       _get(Object.getPrototypeOf(Star.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Star, _ShapeBase);
+
     _createClass(Star, [{
       key: 'resize',
       value: function resize(ctx) {
@@ -29738,14 +29738,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilNodeBase2 = _interopRequireDefault(_utilNodeBase);
 
   var Text = (function (_NodeBase) {
-    _inherits(Text, _NodeBase);
-
     function Text(options, body, labelModule) {
       _classCallCheck(this, Text);
 
       _get(Object.getPrototypeOf(Text.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Text, _NodeBase);
+
     _createClass(Text, [{
       key: 'resize',
       value: function resize(ctx, selected) {
@@ -29825,14 +29825,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilShapeBase2 = _interopRequireDefault(_utilShapeBase);
 
   var Triangle = (function (_ShapeBase) {
-    _inherits(Triangle, _ShapeBase);
-
     function Triangle(options, body, labelModule) {
       _classCallCheck(this, Triangle);
 
       _get(Object.getPrototypeOf(Triangle.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(Triangle, _ShapeBase);
+
     _createClass(Triangle, [{
       key: 'resize',
       value: function resize(ctx) {
@@ -29881,14 +29881,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilShapeBase2 = _interopRequireDefault(_utilShapeBase);
 
   var TriangleDown = (function (_ShapeBase) {
-    _inherits(TriangleDown, _ShapeBase);
-
     function TriangleDown(options, body, labelModule) {
       _classCallCheck(this, TriangleDown);
 
       _get(Object.getPrototypeOf(TriangleDown.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(TriangleDown, _ShapeBase);
+
     _createClass(TriangleDown, [{
       key: 'resize',
       value: function resize(ctx) {
@@ -30143,7 +30143,7 @@ return /******/ (function(modules) { // webpackBootstrap
       value: function setData(edges) {
         var _this3 = this;
 
-        var doNotEmit = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var doNotEmit = arguments[1] === undefined ? false : arguments[1];
 
         var oldEdgesData = this.body.data.edges;
 
@@ -30194,7 +30194,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function add(ids) {
-        var doNotEmit = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var doNotEmit = arguments[1] === undefined ? false : arguments[1];
 
         var edges = this.body.edges;
         var edgesData = this.body.data.edges;
@@ -30231,7 +30231,7 @@ return /******/ (function(modules) { // webpackBootstrap
           var id = ids[i];
           var data = edgesData.get(id);
           var edge = edges[id];
-          if (edge === null) {
+          if (edge !== undefined) {
             // update edge
             edge.disconnect();
             dataChanged = edge.setOptions(data) || dataChanged; // if a support node is added, data can be changed.
@@ -30809,7 +30809,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }], [{
       key: 'parseOptions',
       value: function parseOptions(parentOptions, newOptions) {
-        var allowDeletion = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+        var allowDeletion = arguments[2] === undefined ? false : arguments[2];
 
         var fields = ['id', 'from', 'hidden', 'hoverWidth', 'label', 'labelHighlightBold', 'length', 'line', 'opacity', 'physics', 'selectionWidth', 'selfReferenceSize', 'to', 'title', 'value', 'width'];
 
@@ -30937,8 +30937,6 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilBezierEdgeBase2 = _interopRequireDefault(_utilBezierEdgeBase);
 
   var BezierEdgeDynamic = (function (_BezierEdgeBase) {
-    _inherits(BezierEdgeDynamic, _BezierEdgeBase);
-
     function BezierEdgeDynamic(options, body, labelModule) {
       _classCallCheck(this, BezierEdgeDynamic);
 
@@ -30946,6 +30944,8 @@ return /******/ (function(modules) { // webpackBootstrap
       _get(Object.getPrototypeOf(BezierEdgeDynamic.prototype), 'constructor', this).call(this, options, body, labelModule); // --> this calls the setOptions below
     }
 
+    _inherits(BezierEdgeDynamic, _BezierEdgeBase);
+
     _createClass(BezierEdgeDynamic, [{
       key: 'setOptions',
       value: function setOptions(options) {
@@ -31102,14 +31102,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _EdgeBase3 = _interopRequireDefault(_EdgeBase2);
 
   var BezierEdgeBase = (function (_EdgeBase) {
-    _inherits(BezierEdgeBase, _EdgeBase);
-
     function BezierEdgeBase(options, body, labelModule) {
       _classCallCheck(this, BezierEdgeBase);
 
       _get(Object.getPrototypeOf(BezierEdgeBase.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(BezierEdgeBase, _EdgeBase);
+
     _createClass(BezierEdgeBase, [{
       key: '_findBorderPositionBezier',
 
@@ -31127,7 +31127,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param viaNode
        */
       value: function _findBorderPositionBezier(nearNode, ctx) {
-        var viaNode = arguments.length <= 2 || arguments[2] === undefined ? this._getViaCoordinates() : arguments[2];
+        var viaNode = arguments[2] === undefined ? this._getViaCoordinates() : arguments[2];
 
         var maxIterations = 10;
         var iteration = 0;
@@ -31846,14 +31846,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilBezierEdgeBase2 = _interopRequireDefault(_utilBezierEdgeBase);
 
   var BezierEdgeStatic = (function (_BezierEdgeBase) {
-    _inherits(BezierEdgeStatic, _BezierEdgeBase);
-
     function BezierEdgeStatic(options, body, labelModule) {
       _classCallCheck(this, BezierEdgeStatic);
 
       _get(Object.getPrototypeOf(BezierEdgeStatic.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(BezierEdgeStatic, _BezierEdgeBase);
+
     _createClass(BezierEdgeStatic, [{
       key: '_line',
 
@@ -32042,14 +32042,14 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: '_findBorderPosition',
       value: function _findBorderPosition(nearNode, ctx) {
-        var options = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
+        var options = arguments[2] === undefined ? {} : arguments[2];
 
         return this._findBorderPositionBezier(nearNode, ctx, options.via);
       }
     }, {
       key: '_getDistanceToEdge',
       value: function _getDistanceToEdge(x1, y1, x2, y2, x3, y3) {
-        var via = arguments.length <= 6 || arguments[6] === undefined ? this._getViaCoordinates() : arguments[6];
+        var via = arguments[6] === undefined ? this._getViaCoordinates() : arguments[6];
         // x3,y3 is the point
         return this._getDistanceToBezierEdge(x1, y1, x2, y2, x3, y3, via);
       }
@@ -32064,7 +32064,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function getPoint(percentage) {
-        var via = arguments.length <= 1 || arguments[1] === undefined ? this._getViaCoordinates() : arguments[1];
+        var via = arguments[1] === undefined ? this._getViaCoordinates() : arguments[1];
 
         var t = percentage;
         var x = Math.pow(1 - t, 2) * this.from.x + 2 * t * (1 - t) * via.x + Math.pow(t, 2) * this.to.x;
@@ -32105,14 +32105,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _utilEdgeBase2 = _interopRequireDefault(_utilEdgeBase);
 
   var StraightEdge = (function (_EdgeBase) {
-    _inherits(StraightEdge, _EdgeBase);
-
     function StraightEdge(options, body, labelModule) {
       _classCallCheck(this, StraightEdge);
 
       _get(Object.getPrototypeOf(StraightEdge.prototype), 'constructor', this).call(this, options, body, labelModule);
     }
 
+    _inherits(StraightEdge, _EdgeBase);
+
     _createClass(StraightEdge, [{
       key: '_line',
 
@@ -32441,7 +32441,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * Stop the simulation, force stabilization.
        */
       value: function stopSimulation() {
-        var emit = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0];
+        var emit = arguments[0] === undefined ? true : arguments[0];
 
         this.stabilized = true;
         if (emit === true) {
@@ -32742,7 +32742,7 @@ return /******/ (function(modules) { // webpackBootstrap
       value: function stabilize() {
         var _this3 = this;
 
-        var iterations = arguments.length <= 0 || arguments[0] === undefined ? this.options.stabilization.iterations : arguments[0];
+        var iterations = arguments[0] === undefined ? this.options.stabilization.iterations : arguments[0];
 
         if (typeof iterations !== 'number') {
           console.log('The stabilize method needs a numeric amount of iterations. Switching to default: ', this.options.stabilization.iterations);
@@ -33843,14 +33843,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _BarnesHutSolver3 = _interopRequireDefault(_BarnesHutSolver2);
 
   var ForceAtlas2BasedRepulsionSolver = (function (_BarnesHutSolver) {
-    _inherits(ForceAtlas2BasedRepulsionSolver, _BarnesHutSolver);
-
     function ForceAtlas2BasedRepulsionSolver(body, physicsBody, options) {
       _classCallCheck(this, ForceAtlas2BasedRepulsionSolver);
 
       _get(Object.getPrototypeOf(ForceAtlas2BasedRepulsionSolver.prototype), "constructor", this).call(this, body, physicsBody, options);
     }
 
+    _inherits(ForceAtlas2BasedRepulsionSolver, _BarnesHutSolver);
+
     _createClass(ForceAtlas2BasedRepulsionSolver, [{
       key: "_calculateForces",
 
@@ -33917,14 +33917,14 @@ return /******/ (function(modules) { // webpackBootstrap
   var _CentralGravitySolver3 = _interopRequireDefault(_CentralGravitySolver2);
 
   var ForceAtlas2BasedCentralGravitySolver = (function (_CentralGravitySolver) {
-    _inherits(ForceAtlas2BasedCentralGravitySolver, _CentralGravitySolver);
-
     function ForceAtlas2BasedCentralGravitySolver(body, physicsBody, options) {
       _classCallCheck(this, ForceAtlas2BasedCentralGravitySolver);
 
       _get(Object.getPrototypeOf(ForceAtlas2BasedCentralGravitySolver.prototype), "constructor", this).call(this, body, physicsBody, options);
     }
 
+    _inherits(ForceAtlas2BasedCentralGravitySolver, _CentralGravitySolver);
+
     _createClass(ForceAtlas2BasedCentralGravitySolver, [{
       key: "_calculateForces",
 
@@ -34031,8 +34031,8 @@ return /******/ (function(modules) { // webpackBootstrap
       * @param refreshData
       */
       value: function cluster() {
-        var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
-        var refreshData = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var options = arguments[0] === undefined ? {} : arguments[0];
+        var refreshData = arguments[1] === undefined ? true : arguments[1];
 
         if (options.joinCondition === undefined) {
           throw new Error('Cannot call clusterByNodeData without a joinCondition function in the options.');
@@ -34071,7 +34071,7 @@ return /******/ (function(modules) { // webpackBootstrap
       * @param refreshData
       */
       value: function clusterOutliers(options) {
-        var refreshData = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var refreshData = arguments[1] === undefined ? true : arguments[1];
 
         options = this._checkOptions(options);
         var clusters = [];
@@ -34149,7 +34149,7 @@ return /******/ (function(modules) { // webpackBootstrap
       * @param refreshData
       */
       value: function clusterByConnection(nodeId, options) {
-        var refreshData = arguments.length <= 2 || arguments[2] === undefined ? true : arguments[2];
+        var refreshData = arguments[2] === undefined ? true : arguments[2];
 
         // kill conditions
         if (nodeId === undefined) {
@@ -34290,7 +34290,7 @@ return /******/ (function(modules) { // webpackBootstrap
       * @private
       */
       value: function _checkOptions() {
-        var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
+        var options = arguments[0] === undefined ? {} : arguments[0];
 
         if (options.clusterEdgeProperties === undefined) {
           options.clusterEdgeProperties = {};
@@ -34313,7 +34313,7 @@ return /******/ (function(modules) { // webpackBootstrap
       * @private
       */
       value: function _cluster(childNodesObj, childEdgesObj, options) {
-        var refreshData = arguments.length <= 3 || arguments[3] === undefined ? true : arguments[3];
+        var refreshData = arguments[3] === undefined ? true : arguments[3];
 
         // kill condition: no children so cant cluster
         if (Object.keys(childNodesObj).length === 0) {
@@ -34484,7 +34484,7 @@ return /******/ (function(modules) { // webpackBootstrap
       * @param {Boolean} refreshData | wrap up afterwards if not true
       */
       value: function openCluster(clusterNodeId, options) {
-        var refreshData = arguments.length <= 2 || arguments[2] === undefined ? true : arguments[2];
+        var refreshData = arguments[2] === undefined ? true : arguments[2];
 
         // kill conditions
         if (clusterNodeId === undefined) {
@@ -34751,8 +34751,6 @@ return /******/ (function(modules) { // webpackBootstrap
    */
 
   var Cluster = (function (_Node) {
-    _inherits(Cluster, _Node);
-
     function Cluster(options, body, imagelist, grouplist, globalOptions) {
       _classCallCheck(this, Cluster);
 
@@ -34763,6 +34761,8 @@ return /******/ (function(modules) { // webpackBootstrap
       this.containedEdges = {};
     }
 
+    _inherits(Cluster, _Node);
+
     return Cluster;
   })(_Node3['default']);
 
@@ -34942,7 +34942,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: '_redraw',
       value: function _redraw() {
-        var hidden = arguments.length <= 0 || arguments[0] === undefined ? false : arguments[0];
+        var hidden = arguments[0] === undefined ? false : arguments[0];
 
         if (this.allowRedraw === true) {
           this.body.emitter.emit('initRedraw');
@@ -35047,7 +35047,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _drawNodes(ctx) {
-        var alwaysShow = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var alwaysShow = arguments[1] === undefined ? false : arguments[1];
 
         var nodes = this.body.nodes;
         var nodeIndices = this.body.nodeIndices;
@@ -35402,8 +35402,8 @@ return /******/ (function(modules) { // webpackBootstrap
        *                         or '30%')
        */
       value: function setSize() {
-        var width = arguments.length <= 0 || arguments[0] === undefined ? this.options.width : arguments[0];
-        var height = arguments.length <= 1 || arguments[1] === undefined ? this.options.height : arguments[1];
+        var width = arguments[0] === undefined ? this.options.width : arguments[0];
+        var height = arguments[1] === undefined ? this.options.height : arguments[1];
 
         width = this._prepareValue(width);
         height = this._prepareValue(height);
@@ -35583,7 +35583,7 @@ return /******/ (function(modules) { // webpackBootstrap
     _createClass(View, [{
       key: "setOptions",
       value: function setOptions() {
-        var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
+        var options = arguments[0] === undefined ? {} : arguments[0];
 
         this.options = options;
       }
@@ -35595,7 +35595,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _getRange() {
-        var specificNodes = arguments.length <= 0 || arguments[0] === undefined ? [] : arguments[0];
+        var specificNodes = arguments[0] === undefined ? [] : arguments[0];
 
         var minY = 1e9,
             maxY = -1e9,
@@ -35662,8 +35662,8 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param {Boolean} [initialZoom]  | zoom based on fitted formula or range, true = fitted, default = false;
        */
       value: function fit() {
-        var options = arguments.length <= 0 || arguments[0] === undefined ? { nodes: [] } : arguments[0];
-        var initialZoom = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1];
+        var options = arguments[0] === undefined ? { nodes: [] } : arguments[0];
+        var initialZoom = arguments[1] === undefined ? false : arguments[1];
 
         var range;
         var zoomLevel;
@@ -35727,7 +35727,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param {Number} [options]
        */
       value: function focus(nodeId) {
-        var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
+        var options = arguments[1] === undefined ? {} : arguments[1];
 
         if (this.body.nodes[nodeId] !== undefined) {
           var nodePosition = { x: this.body.nodes[nodeId].x, y: this.body.nodes[nodeId].y };
@@ -35895,7 +35895,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _transitionRedraw() {
-        var finished = arguments.length <= 0 || arguments[0] === undefined ? false : arguments[0];
+        var finished = arguments[0] === undefined ? false : arguments[0];
 
         this.easingTime += this.animationSpeed;
         this.easingTime = finished === true ? 1.0 : this.easingTime;
@@ -36149,7 +36149,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param add
        */
       value: function checkSelectionChanges(pointer, event) {
-        var add = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
+        var add = arguments[2] === undefined ? false : arguments[2];
 
         var previouslySelectedEdgeCount = this.selectionHandler._getSelectedEdgeCount();
         var previouslySelectedNodeCount = this.selectionHandler._getSelectedNodeCount();
@@ -37251,7 +37251,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: "_generateClickEvent",
       value: function _generateClickEvent(eventType, event, pointer, oldSelection) {
-        var emptySelection = arguments.length <= 4 || arguments[4] === undefined ? false : arguments[4];
+        var emptySelection = arguments[4] === undefined ? false : arguments[4];
 
         var properties = undefined;
         if (emptySelection === true) {
@@ -37273,7 +37273,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: "selectObject",
       value: function selectObject(obj) {
-        var highlightEdges = arguments.length <= 1 || arguments[1] === undefined ? this.options.selectConnectedEdges : arguments[1];
+        var highlightEdges = arguments[1] === undefined ? this.options.selectConnectedEdges : arguments[1];
 
         if (obj !== undefined) {
           if (obj instanceof Node) {
@@ -37345,7 +37345,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function getNodeAt(pointer) {
-        var returnNode = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var returnNode = arguments[1] === undefined ? true : arguments[1];
 
         // we first check if this is an navigation controls element
         var positionObject = this._pointerToPositionObject(pointer);
@@ -37406,7 +37406,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function getEdgeAt(pointer) {
-        var returnEdge = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var returnEdge = arguments[1] === undefined ? true : arguments[1];
 
         var positionObject = this._pointerToPositionObject(pointer);
         var overlappingEdges = this._getAllEdgesOverlappingWith(positionObject);
@@ -37817,7 +37817,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @param {boolean} [highlightEdges]
        */
       value: function selectNodes(selection) {
-        var highlightEdges = arguments.length <= 1 || arguments[1] === undefined ? true : arguments[1];
+        var highlightEdges = arguments[1] === undefined ? true : arguments[1];
 
         var i = undefined,
             id = undefined;
@@ -39119,7 +39119,7 @@ return /******/ (function(modules) { // webpackBootstrap
        * @private
        */
       value: function _createSeperator() {
-        var index = arguments.length <= 0 || arguments[0] === undefined ? 1 : arguments[0];
+        var index = arguments[0] === undefined ? 1 : arguments[0];
 
         this.manipulationDOM['seperatorLineDiv' + index] = document.createElement('div');
         this.manipulationDOM['seperatorLineDiv' + index].className = 'vis-separator-line';
@@ -39173,7 +39173,7 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: '_createButton',
       value: function _createButton(id, className, label) {
-        var labelClassName = arguments.length <= 3 || arguments[3] === undefined ? 'vis-label' : arguments[3];
+        var labelClassName = arguments[3] === undefined ? 'vis-label' : arguments[3];
 
         this.manipulationDOM[id + 'Div'] = document.createElement('div');
         this.manipulationDOM[id + 'Div'].className = className;
diff --git a/lib/network/modules/EdgesHandler.js b/lib/network/modules/EdgesHandler.js
index cde73d5b..5e321d17 100644
--- a/lib/network/modules/EdgesHandler.js
+++ b/lib/network/modules/EdgesHandler.js
@@ -275,7 +275,7 @@ class EdgesHandler {
       var id = ids[i];
       var data = edgesData.get(id);
       var edge = edges[id];
-      if (edge === null) {
+      if (edge !== undefined) {
         // update edge
         edge.disconnect();
         dataChanged = edge.setOptions(data) || dataChanged; // if a support node is added, data can be changed.
diff --git a/test/networkTest.html b/test/networkTest.html
index 28ba4689..18daec5e 100644
--- a/test/networkTest.html
+++ b/test/networkTest.html
@@ -1,116 +1,557 @@
-<!doctype html>
-<html>
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
-    <title>Network | Clustering</title>
-    <script type="text/javascript" src="../dist/vis.js"></script>
+    <title>Test</title>
+    <meta http-equiv="x-ua-compatible" content="IE=Edge" />
     <style type="text/css">
-        #mynetwork {
-            width: 600px;
-            height: 600px;
-            border: 1px solid lightgray;
-        }
-        p {
-            max-width: 600px;
-        }
-        h4 {
-            margin-bottom: 3px;
-        }
+
     </style>
-</head>
 
+    <script type="text/javascript" src="../dist/vis.js"></script>
+    <link type="text/css" rel="stylesheet" href="../dist/vis.css">
+    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
+
+
+
+</head>
 <body>
+<input type="button" id="changeVis" value="ChangeVis"/>
+<div id="kl" style="position:absolute;height:700px; width:1200px;float:left;border: 2px solid #0094ff;overflow:auto">
+</div>
+
+
+<script>
+    var graph = null;
+    var chartVisual = null;
+
+    window.onload = function () {
+        chartVisual = new weve.cg.view.ChartVisual();
+        chartVisual.LoadChart();
+    }
+
+    //
+    //     Copyright © 2011-2015 Cambridge Intelligence Limited.
+    //     All rights reserved.
+    //
+    //     Sample Code
+    //     Click here to see the code in action: Combos 1
+    var weve = weve || {};
+    weve.cg = weve.cg || {};
+    weve.cg.view = weve.cg.view || {};
+    network = {};
+
+    nodes = new vis.DataSet();
+    edges = new vis.DataSet();
+
+    // Javascript Constructor - The Main Graph object
+    weve.cg.view.ChartVisual = function () {
+        nodes2 = new vis.DataSet([
+            { label: "0", id: "d0" },
+            { label: "1", id: "d1" },
+            { label: "2", id: "d2" },
+            { label: "3", id: "d3" },
+            { label: "4", id: "d4" },
+            { label: "5", id: "d5" },
+            { label: "6", id: "d6" },
+            { label: "7", id: "d7" },
+            { label: "8", id: "d8" },
+            { label: "9", id: "d9" },
+            { label: "10", id: "d10" },
+            { label: "11", id: "d11" },
+            { label: "12", id: "d12" },
+            { label: "13", id: "d13" },
+            { label: "14", id: "d14" },
+            { label: "15", id: "d15" },
+            { label: "16", id: "d16" },
+            { label: "17", id: "d17" },
+            { label: "18", id: "d18" },
+            { label: "19", id: "d19" },
+            { label: "20", id: "d20" },
+            { label: "21", id: "d21" },
+            { label: "22", id: "d22" },
+            { label: "23", id: "d23" },
+            { label: "24", id: "d24" },
+            { label: "25", id: "d25" },
+            { label: "26", id: "d26" },
+            { label: "27", id: "d27" },
+            { label: "28", id: "d28" },
+            { label: "29", id: "d29" },
+            { label: "30", id: "d30" },
+            { label: "31", id: "d31" },
+            { label: "32", id: "d32" },
+            { label: "33", id: "d33" },
+            { label: "34", id: "d34" },
+            { label: "35", id: "d35" },
+            { label: "36", id: "d36" },
+            { label: "37", id: "d37" },
+            { label: "38", id: "d38" },
+            { label: "39", id: "d39" },
+            { label: "40", id: "d40" },
+            { label: "41", id: "d41" },
+            { label: "42", id: "d42" },
+            { label: "43", id: "d43" },
+            { label: "44", id: "d44" },
+            { label: "45", id: "d45" },
+            { label: "46", id: "d46" },
+            { label: "47", id: "d47" },
+            { label: "48", id: "d48" },
+            { label: "49", id: "d49" },
+            { label: "50", id: "d50" },
+            { label: "51", id: "d51" },
+            { label: "52", id: "d52" },
+            { label: "53", id: "d53" },
+            { label: "54", id: "d54" },
+            { label: "55", id: "d55" },
+            { label: "56", id: "d56" },
+            { label: "57", id: "d57" },
+            { label: "58", id: "d58" },
+            { label: "59", id: "d59" },
+            { label: "60", id: "d60" },
+            { label: "61", id: "d61" },
+            { label: "62", id: "d62" },
+            { label: "63", id: "d63" },
+            { label: "64", id: "d64" },
+            { label: "65", id: "d65" },
+            { label: "66", id: "d66" },
+            { label: "67", id: "d67" },
+            { label: "68", id: "d68" },
+            { label: "69", id: "d69" },
+            { label: "70", id: "d70" },
+            { label: "71", id: "d71" },
+            { label: "72", id: "d72" },
+            { label: "73", id: "d73" },
+            { label: "74", id: "d74" },
+            { label: "75", id: "d75" },
+            { label: "76", id: "d76" },
+            { label: "77", id: "d77" },
+            { label: "78", id: "d78" },
+            { label: "79", id: "d79" },
+            { label: "80", id: "d80" },
+            { label: "81", id: "d81" },
+            { label: "82", id: "d82" },
+            { label: "83", id: "d83" },
+            { label: "84", id: "d84" },
+            { label: "85", id: "d85" },
+            { label: "86", id: "d86" },
+            { label: "87", id: "d87" },
+            { label: "88", id: "d88" },
+            { label: "89", id: "d89" },
+            { label: "90", id: "d90" },
+            { label: "91", id: "d91" },
+            { label: "92", id: "d92" },
+            { label: "93", id: "d93" },
+            { label: "94", id: "d94" },
+            { label: "95", id: "d95" },
+            { label: "96", id: "d96" },
+            { label: "97", id: "d97" },
+            { label: "98", id: "d98" },
+            { label: "99", id: "d99" },
+            { label: "100", id: "d100" },
+            { label: "101", id: "d101" },
+            { label: "102", id: "d102" },
+            { label: "103", id: "d103" },
+            { label: "104", id: "d104" },
+            { label: "105", id: "d105" },
+            { label: "106", id: "d106" },
+            { label: "107", id: "d107" },
+            { label: "108", id: "d108" },
+            { label: "109", id: "d109" },
+            { label: "110", id: "d110" },
+            { label: "111", id: "d111" },
+            { label: "112", id: "d112" },
+            { label: "113", id: "d113" },
+            { label: "114", id: "d114" },
+            { label: "115", id: "d115" },
+            { label: "116", id: "d116" },
+            { label: "117", id: "d117" },
+            { label: "118", id: "d118" },
+            { label: "119", id: "d119" },
+            { label: "120", id: "d120" },
+            { label: "121", id: "d121" },
+            { label: "122", id: "d122" },
+            { label: "123", id: "d123" },
+            { label: "124", id: "d124" },
+            { label: "125", id: "d125" },
+            { label: "126", id: "d126" },
+            { label: "127", id: "d127" },
+            { label: "128", id: "d128" },
+            { label: "129", id: "d129" },
+            { label: "130", id: "d130" },
+            { label: "131", id: "d131" },
+            { label: "132", id: "d132" },
+            { label: "133", id: "d133" },
+            { label: "134", id: "d134" },
+            { label: "135", id: "d135" },
+            { label: "136", id: "d136" },
+            { label: "137", id: "d137" },
+            { label: "138", id: "d138" },
+            { label: "139", id: "d139" },
+            { label: "140", id: "d140" },
+            { label: "141", id: "d141" },
+            { label: "142", id: "d142" },
+            { label: "143", id: "d143" },
+            { label: "144", id: "d144" },
+            { label: "145", id: "d145" },
+            { label: "146", id: "d146" },
+            { label: "147", id: "d147" },
+            { label: "148", id: "d148" },
+            { label: "149", id: "d149" },
+            { label: "150", id: "d150" },
+            { label: "151", id: "d151" },
+            { label: "152", id: "d152" },
+            { label: "153", id: "d153" },
+            { label: "154", id: "d154" },
+            { label: "155", id: "d155" },
+            { label: "156", id: "d156" },
+            { label: "157", id: "d157" },
+            { label: "158", id: "d158" },
+            { label: "159", id: "d159" },
+            { label: "160", id: "d160" },
+            { label: "161", id: "d161" },
+            { label: "162", id: "d162" },
+            { label: "163", id: "d163" }
+
+        ]);
+
+        edges2 = new vis.DataSet([
+
+            { from: "d0", to: "d2" },
+            { from: "d1", to: "d0" },
+            { from: "d2", to: "d1" },
+            { from: "d3", to: "d2" },
+            { from: "d4", to: "d3" },
+            { from: "d5", to: "d4" },
+            { from: "d6", to: "d5" },
+            { from: "d7", to: "d6" },
+            { from: "d8", to: "d7" },
+            { from: "d9", to: "d8" },
+            { from: "d10", to: "d9" },
+            { from: "d11", to: "d10" },
+            { from: "d12", to: "d11" },
+            { from: "d13", to: "d12" },
+            { from: "d14", to: "d13" },
+            { from: "d15", to: "d14" },
+            { from: "d16", to: "d15" },
+            { from: "d17", to: "d16" },
+            { from: "d18", to: "d17" },
+            { from: "d19", to: "d18" },
+            { from: "d20", to: "d19" },
+            { from: "d21", to: "d20" },
+            { from: "d22", to: "d21" },
+            { from: "d23", to: "d22" },
+            { from: "d24", to: "d23" },
+            { from: "d25", to: "d24" },
+            { from: "d26", to: "d25" },
+            { from: "d27", to: "d26" },
+            { from: "d28", to: "d27" },
+            { from: "d29", to: "d28" },
+            { from: "d30", to: "d29" },
+            { from: "d31", to: "d30" },
+            { from: "d32", to: "d31" },
+            { from: "d33", to: "d32" },
+            { from: "d34", to: "d33" },
+            { from: "d35", to: "d34" },
+            { from: "d36", to: "d35" },
+            { from: "d37", to: "d36" },
+            { from: "d38", to: "d37" },
+            { from: "d39", to: "d38" },
+            { from: "d40", to: "d39" },
+            { from: "d41", to: "d40" },
+            { from: "d42", to: "d41" },
+            { from: "d43", to: "d42" },
+            { from: "d44", to: "d43" },
+            { from: "d45", to: "d44" },
+            { from: "d46", to: "d45" },
+            { from: "d47", to: "d46" },
+            { from: "d48", to: "d47" },
+            { from: "d49", to: "d48" },
+            { from: "d50", to: "d49" },
+            { from: "d51", to: "d50" },
+            { from: "d52", to: "d51" },
+            { from: "d53", to: "d52" },
+            { from: "d54", to: "d53" },
+            { from: "d55", to: "d54" },
+            { from: "d56", to: "d55" },
+            { from: "d57", to: "d56" },
+            { from: "d58", to: "d57" },
+            { from: "d59", to: "d58" },
+            { from: "d60", to: "d59" },
+            { from: "d61", to: "d60" },
+            { from: "d62", to: "d61" },
+            { from: "d63", to: "d62" },
+            { from: "d64", to: "d63" },
+            { from: "d65", to: "d64" },
+            { from: "d66", to: "d65" },
+            { from: "d67", to: "d66" },
+            { from: "d68", to: "d67" },
+            { from: "d69", to: "d68" },
+            { from: "d70", to: "d69" },
+            { from: "d71", to: "d70" },
+            { from: "d72", to: "d71" },
+            { from: "d73", to: "d72" },
+            { from: "d74", to: "d73" },
+            { from: "d75", to: "d74" },
+            { from: "d76", to: "d75" },
+            { from: "d77", to: "d76" },
+            { from: "d78", to: "d77" },
+            { from: "d79", to: "d78" },
+            { from: "d80", to: "d79" },
+            { from: "d81", to: "d80" },
+            { from: "d82", to: "d81" },
+            { from: "d83", to: "d82" },
+            { from: "d84", to: "d83" },
+            { from: "d85", to: "d84" },
+            { from: "d86", to: "d85" },
+            { from: "d87", to: "d86" },
+            { from: "d88", to: "d87" },
+            { from: "d89", to: "d88" },
+            { from: "d90", to: "d89" },
+            { from: "d91", to: "d90" },
+            { from: "d92", to: "d91" },
+            { from: "d93", to: "d92" },
+            { from: "d94", to: "d93" },
+            { from: "d95", to: "d94" },
+            { from: "d96", to: "d95" },
+            { from: "d97", to: "d96" },
+            { from: "d98", to: "d97" },
+            { from: "d99", to: "d98" },
+            { from: "d100", to: "d99" },
+            { from: "d101", to: "d100" },
+            { from: "d102", to: "d101" },
+            { from: "d103", to: "d102" },
+            { from: "d104", to: "d103" },
+            { from: "d105", to: "d104" },
+            { from: "d106", to: "d105" },
+            { from: "d107", to: "d106" },
+            { from: "d108", to: "d107" },
+            { from: "d109", to: "d108" },
+            { from: "d110", to: "d109" },
+            { from: "d111", to: "d110" },
+            { from: "d112", to: "d111" },
+            { from: "d113", to: "d112" },
+            { from: "d114", to: "d113" },
+            { from: "d115", to: "d114" },
+            { from: "d116", to: "d115" },
+            { from: "d117", to: "d116" },
+            { from: "d118", to: "d117" },
+            { from: "d119", to: "d118" },
+            { from: "d120", to: "d119" },
+            { from: "d121", to: "d120" },
+            { from: "d122", to: "d121" },
+            { from: "d123", to: "d122" },
+            { from: "d124", to: "d123" },
+            { from: "d125", to: "d124" },
+            { from: "d126", to: "d125" },
+            { from: "d127", to: "d126" },
+            { from: "d128", to: "d127" },
+            { from: "d129", to: "d128" },
+            { from: "d130", to: "d129" },
+            { from: "d131", to: "d130" },
+            { from: "d132", to: "d131" },
+            { from: "d133", to: "d132" },
+            { from: "d134", to: "d133" },
+            { from: "d135", to: "d134" },
+            { from: "d136", to: "d135" },
+            { from: "d137", to: "d136" },
+            { from: "d138", to: "d137" },
+            { from: "d139", to: "d138" },
+            { from: "d140", to: "d139" },
+            { from: "d141", to: "d140" },
+            { from: "d142", to: "d141" },
+            { from: "d143", to: "d142" },
+            { from: "d144", to: "d143" },
+            { from: "d145", to: "d144" },
+            { from: "d146", to: "d145" },
+            { from: "d147", to: "d146" },
+            { from: "d148", to: "d147" },
+            { from: "d149", to: "d148" },
+            { from: "d150", to: "d149" },
+            { from: "d151", to: "d150" },
+            { from: "d152", to: "d151" },
+            { from: "d153", to: "d152" },
+            { from: "d154", to: "d153" },
+            { from: "d155", to: "d154" },
+            { from: "d156", to: "d155" },
+            { from: "d157", to: "d156" },
+            { from: "d158", to: "d157" }
+        ]);
+
+        nodes = nodes2;
+        edges = edges2;
+
+
+        this.totalEdgesAdded = 0;
+
+        this.fitOnDone = false;
+        this.fitOnDoneIterations = 0;
+
+        this.options = {
+            nodes: {
+                shape: 'dot',
+                scaling: {
+                    label: {
+                        min: weve.cg.view.ChartVisual.minFont_largeGroup,
+                        max: weve.cg.view.ChartVisual.maxFont_largeGroup
+                    },
+                }
+            },
+
+            edges: {
+                smooth: {
+                    enabled: true,
+                    type: "dynamic",
+                    //   roundness: 0.5
+                },
+            },
+
+            interaction: {
+
+                multiselect: false,
+                navigationButtons: true,
+                selectable: true,
+                selectConnectedEdges: true,
+                tooltipDelay: 100,
+                zoomView: true
+            },
+            physics: {
+                stabilization: {
+                    enabled: true,
+                    iterations: 250, // maximum number of iteration to stabilize
+                    updateInterval: 5,
+                    onlyDynamicEdges: false,
+                    fit: true
+                }
+            }
+        };
 
-<div id="mynetwork"></div>
-
-<script type="text/javascript">
-    // create an array with nodes
-    var nodes = [
-        {id: 1, label: '1'},
-        {id: 2, label: '2'},
-        {id: 3, label: '3'},
-        {id: 4, label: '4'},
-        {id: 'a', label: 'a'},
-        {id: 'b', label: 'b'},
-        {id: 'c', label: 'c'},
-        {id: 'd', label: 'd'}
-    ];
-
-    // create an array with edges
-    var edges = [
-        {from: '1', to: '2', arrows:'to'},
-        {from: '2', to: '3', arrows:'to'},
-        {from: '3', to: '4', arrows:'to'},
-        {from: 'a', to: 'b', arrows:'to'},
-        {from: 'b', to: 'c', arrows:'to'},
-        {from: 'c', to: 'd', arrows:'to'}
-    ];
-
-    // create a network
-    var container = document.getElementById('mynetwork');
-    var data = {
-        nodes: nodes,
-        edges: edges
-    };
-    var options = {
-        interaction: {
-            navigationButtons: true
-        },
-        layout: {randomSeed: 8}
     };
-    var network = new vis.Network(container, data, options);
 
-    // if we click on a node, we want to open it up!
-    network.on("selectNode", function (params) {
-        if (params.nodes.length == 1) {
-            if (network.isCluster(params.nodes[0]) == true) {
-                network.openCluster(params.nodes[0])
+    weve.cg.view.ChartVisual.minFont_smallGroup = 7;
+    weve.cg.view.ChartVisual.maxFont_smallGroup = 10;
+
+    weve.cg.view.ChartVisual.minFont_largeGroup = 20;
+    weve.cg.view.ChartVisual.maxFont_largeGroup = 25;
+
+
+    weve.cg.view.ChartVisual.prototype.LoadChart = function (viewModel, callBack) {
+        var g = this;
+        var container = document.getElementById('kl');
+
+        var data = {
+            nodes: nodes,
+            edges: edges
+        };
+
+
+        this.viewModel = viewModel;
+        network = new vis.Network(container, data, this.options);
+        this.startpercentage = 60;
+        network.on("click",this.neighbourhoodHighlight);
+
+    }
+
+
+    weve.cg.view.ChartVisual.prototype.neighbourhoodHighlight = function(params) {
+        // if something is selected:
+        var allNodes = nodes.get({returnType:"Object"});
+        var allEdges = edges.get({returnType:"Object"});
+
+        if (params.nodes.length > 0) {
+            this.highlightActive = true;
+
+            var i,j;
+            var selectedNode = params.nodes[0];
+            var degrees = 1;
+
+            // mark all nodes as hard to read.
+            for (var nodeId in allNodes) {
+                allNodes[nodeId].originalColor = allNodes[nodeId].color;
+                allNodes[nodeId].color = 'rgba(200,200,200,0.5)';
+                allNodes[nodeId].hiddenLabel = allNodes[nodeId].label;
+                allNodes[nodeId].label = undefined;
+                //allNodes[nodeId].hidden = true;
             }
+
+            var connectedNodes = network.getConnectedNodes(selectedNode);
+            var allConnectedNodes = [];
+
+            // all first degree nodes get their own color and their label back
+            for (i = 0; i < connectedNodes.length; i++) {
+                allNodes[connectedNodes[i]].color = allNodes[connectedNodes[i]].originalColor;
+
+                if (allNodes[connectedNodes[i]].hiddenLabel !== undefined) {
+                    allNodes[connectedNodes[i]].label = allNodes[connectedNodes[i]].hiddenLabel;
+                    allNodes[connectedNodes[i]].hiddenLabel = undefined;
+                    //allNodes[nodeId].hidden = false;
+                }
+            }
+
+            // the main node gets its own color and its label back.
+            allNodes[selectedNode].color = allNodes[selectedNode].originalColor;
+            if (allNodes[selectedNode].hiddenLabel !== undefined) {
+                allNodes[selectedNode].label = allNodes[selectedNode].hiddenLabel;
+                allNodes[selectedNode].hiddenLabel = undefined;
+                //allNodes[nodeId].hidden = false;
+            }
+
+            var selectedEdges = params.edges;
+
+            for (var edgeId in allEdges) {
+                var edge = allEdges[edgeId];
+                edge.regularWidth = edge.width; //store the original width.
+
+                if (selectedEdges.indexOf(edge.id) == -1)
+                {
+                    edge.width = 0.01;
+                    //edge.hidden = true;
+                }
+            }
+
+
         }
-    });
-
-    setTimeout(function() {
-//        alert("Clustering 2 and 'b'");
-        var clusterOptionsByData = {
-            joinCondition: function(node) {
-                if (node.id == '2' || node.id == 'b')
-                    return true;
-                return false;
-            },
-            clusterNodeProperties: {id:"c1", label:'c1'}
+        else if (this.highlightActive === true) {
+            // reset all nodes
+            for (var nodeId in allNodes) {
+                allNodes[nodeId].color = allNodes[nodeId].originalColor;
+                if (allNodes[nodeId].hiddenLabel !== undefined) {
+                    allNodes[nodeId].label = allNodes[nodeId].hiddenLabel;
+                    allNodes[nodeId].hiddenLabel = undefined;
+                    //allNodes[nodeId].hidden = false;
+                }
+            }
+
+            for (var edgeIds in allEdges) {
+                var edge = allEdges[edgeIds];
+                edge.width = edge.regularWidth; //restore the original width.
+                //edge.hidden= false;
+            }
+
+            this.highlightActive = false
         }
-        network.cluster(clusterOptionsByData);
-    }, 1)
-
-    setTimeout(function() {
-//        alert("Clustering 4 and 'd'");
-        var clusterOptionsByData = {
-            joinCondition: function(node) {
-                if (node.id == '4' || node.id == 'd')
-                    return true;
-                return false;
-            },
-            clusterNodeProperties: {id:"c2", label:'c2'}
+
+        // transform the object into an array
+        var updateArray = [];
+        for (nodeId in allNodes) {
+            if (allNodes.hasOwnProperty(nodeId)) {
+                updateArray.push(allNodes[nodeId]);
+            }
         }
-        network.cluster(clusterOptionsByData);
-    }, 100)
-
-    setTimeout(function() {
-//        alert('Changing to UD layout');
-        customLayout = { hierarchical: { direction: "UD" } };
-        network.setOptions({layout: customLayout});
-    }, 300)
-
-//    setTimeout(function() {
-//        alert('Changing to DEFAULT layout, but does not work');
-//        customLayout = {};
-//        network.setOptions({"layout": {
-//            "hierarchical": {
-//                "enabled": false
-//            }
-//        }});
-//    }, 15000)
 
-</script>
+        // transform the object into an array
+        var updateEdgesArray = [];
+        for (edgeId in allEdges) {
+            if (allEdges.hasOwnProperty(edgeId)) {
+                updateEdgesArray.push(allEdges[edgeId]);
+            }
+        }
+
+        nodes.update(updateArray);
+        edges.update(updateEdgesArray);
+        console.log("edges", updateEdgesArray)
 
+        //this.refreshUILayout(1000);
+    }
+
+</script>
 </body>
-</html>
\ No newline at end of file
+</html>