fix(graph2d): fix #2500 for graph2d (#2581)

* fix(graph2d): fix #2500 for graph2d; improves #2580

* fix(DataSet): make sure the right id-type is used internaly

This fixes a fixed strange string-number conversion issue.
It can happen that id "0" !== 0 what causes #2580.

fixes #2580

examples/graph2d/08_performance.html

@@ -147,4 +147,4 @@
     var graph2d = new vis.Graph2d(container, dataset, options);
 </script>
 </body>
-</html>
+</html>

lib/DataSet.js

@@ -730,7 +730,7 @@ DataSet.prototype.clear = function (senderId) {
   var i, len;
   var ids = Object.keys(this._data);
   var items = [];
-  
+
   for (i = 0, len = ids.length; i < len; i++) {
     items.push(this._data[ids[i]]);
   }
@@ -912,7 +912,7 @@ DataSet.prototype._getItem = function (id, types) {
   }
 
   if (!converted[this._fieldId]) {
-    converted[this._fieldId] = id;
+    converted[this._fieldId] = raw.id;
   }
 
   return converted;

lib/timeline/optionsGraph2d.js

@@ -18,53 +18,53 @@ let any = 'any';
 
 let allOptions = {
   configure: {
-    enabled: {bool},
-    filter: {bool,'function': 'function'},
+    enabled: {'boolean': bool},
+    filter: {'boolean': bool,'function': 'function'},
     container: {dom},
-    __type__: {object,bool,'function': 'function'}
+    __type__: {object,'boolean': bool,'function': 'function'}
   },
 
   //globals :
   yAxisOrientation: {string:['left','right']},
   defaultGroup: {string},
-  sort: {bool},
-  sampling: {bool},
-  stack:{bool},
+  sort: {'boolean': bool},
+  sampling: {'boolean': bool},
+  stack:{'boolean': bool},
   graphHeight: {string, number},
   shaded: {
-    enabled: {bool},
+    enabled: {'boolean': bool},
     orientation: {string:['bottom','top','zero','group']}, // top, bottom, zero, group
     groupId: {object},
-    __type__: {bool,object}
+    __type__: {'boolean': bool,object}
   },
   style: {string:['line','bar','points']}, // line, bar
   barChart: {
     width: {number},
     minWidth: {number},
-    sideBySide: {bool},
+    sideBySide: {'boolean': bool},
     align: {string:['left','center','right']},
     __type__: {object}
   },
   interpolation: {
-    enabled: {bool},
+    enabled: {'boolean': bool},
     parametrization: {string:['centripetal', 'chordal','uniform']}, // uniform (alpha = 0.0), chordal (alpha = 1.0), centripetal (alpha = 0.5)
     alpha: {number},
-    __type__: {object,bool}
+    __type__: {object,'boolean': bool}
   },
   drawPoints: {
-    enabled: {bool},
+    enabled: {'boolean': bool},
     onRender: { 'function': 'function' },
     size: {number},
     style: {string:['square','circle']}, // square, circle
-    __type__: {object,bool,'function': 'function'}
+    __type__: {object,'boolean': bool,'function': 'function'}
   },
   dataAxis: {
-    showMinorLabels: {bool},
-    showMajorLabels: {bool},
-    icons: {bool},
+    showMinorLabels: {'boolean': bool},
+    showMajorLabels: {'boolean': bool},
+    icons: {'boolean': bool},
     width: {string, number},
-    visible: {bool},
-    alignZeros: {bool},
+    visible: {'boolean': bool},
+    alignZeros: {'boolean': bool},
     left:{
       range: {min:{number},max:{number},__type__: {object}},
       format: {'function': 'function'},
@@ -80,28 +80,28 @@ let allOptions = {
     __type__: {object}
   },
   legend: {
-    enabled: {bool},
-    icons: {bool},
+    enabled: {'boolean': bool},
+    icons: {'boolean': bool},
     left: {
-      visible: {bool},
+      visible: {'boolean': bool},
       position: {string:['top-right','bottom-right','top-left','bottom-left']},
       __type__: {object}
     },
     right: {
-      visible: {bool},
+      visible: {'boolean': bool},
       position: {string:['top-right','bottom-right','top-left','bottom-left']},
       __type__: {object}
     },
-    __type__: {object,bool}
+    __type__: {object,'boolean': bool}
   },
   groups: {
     visibility: {any},
     __type__: {object}
   },
 
-  autoResize: {bool},
+  autoResize: {'boolean': bool},
   throttleRedraw: {number}, // TODO: DEPRICATED see https://github.com/almende/vis/issues/2511
-  clickToUse: {bool},
+  clickToUse: {'boolean': bool},
   end: {number, date, string, moment},
   format: {
     minorLabels: {
@@ -146,12 +146,12 @@ let allOptions = {
   maxMinorChars: {number},
   min: {date, number, string, moment},
   minHeight: {number, string},
-  moveable: {bool},
-  multiselect: {bool},
+  moveable: {'boolean': bool},
+  multiselect: {'boolean': bool},
   orientation: {string},
-  showCurrentTime: {bool},
-  showMajorLabels: {bool},
-  showMinorLabels: {bool},
+  showCurrentTime: {'boolean': bool},
+  showMajorLabels: {'boolean': bool},
+  showMinorLabels: {'boolean': bool},
   start: {date, number, string, moment},
   timeAxis: {
     scale: {string,'undefined': 'undefined'},
@@ -159,7 +159,7 @@ let allOptions = {
     __type__: {object}
   },
   width: {string, number},
-  zoomable: {bool},
+  zoomable: {'boolean': bool},
   zoomKey: {string: ['ctrlKey', 'altKey', 'metaKey', '']},
   zoomMax: {number},
   zoomMin: {number},