Introducing "point" style as new label for "points", consistency in naming.

Some fixes and cleanups after the large rewrite.

lib/timeline/component/GraphGroup.js

@@ -134,7 +134,8 @@ GraphGroup.prototype.getLegend = function (iconWidth, iconHeight, framework, x,
     case "line":
       Lines.drawIcon(this, x, y, iconWidth, iconHeight, framework);
       break;
-    case "points":
+    case "points": //explicit no break
+    case "point":
       Points.drawIcon(this, x, y, iconWidth, iconHeight, framework);
       break;
     case "bar":

lib/timeline/component/LineGraph.js

@@ -333,8 +333,8 @@ LineGraph.prototype.setGroups = function (groups) {
     // remove all drawn groups
     ids = this.groupsData.getIds();
     this.groupsData = null;
-    for (var i = 0; i < groupIds.length; i++) {
-      this._removeGroup(groupIds[i]);
+    for (var i = 0; i < ids.length; i++) {
+      this._removeGroup(ids[i]);
     }
   }
 
@@ -733,8 +733,10 @@ LineGraph.prototype._updateGraph = function () {
                 }
                 Lines.draw(paths[groupIds[i]], group, this.framework);
               //explicit no break;
+              case "point":
+              //explicit no break;
               case "points":
-                if (group.options.style == "points" || group.options.drawPoints.enabled == true) {
+                if (group.options.style == "point" || group.options.style == "points" || group.options.drawPoints.enabled == true) {
                   Points.draw(groupsData[groupIds[i]], group, this.framework);
                 }
                 break;

lib/timeline/component/graph2d_types/bar.js

@@ -16,6 +16,8 @@ Bargraph.drawIcon = function (group, x, y, iconWidth, iconHeight, framework) {
   outline.setAttributeNS(null, "class", "vis-outline");
 
   var barWidth = Math.round(0.3 * iconWidth);
+  var originalWidth = group.options.barChart.width;
+  var scale = originalWidth / barWidth;
   var bar1Height = Math.round(0.4 * iconHeight);
   var bar2Height = Math.round(0.75 * iconHeight);
 
@@ -28,7 +30,7 @@ Bargraph.drawIcon = function (group, x, y, iconWidth, iconHeight, framework) {
     var groupTemplate = {
       style: group.options.drawPoints.style,
       styles: group.options.drawPoints.styles,
-      size: Math.max(barWidth/5,group.options.drawPoints.size),
+      size: (group.options.drawPoints.size / scale),
       className: group.className
     };
     DOMutil.drawPoint(x + 0.5 * barWidth + offset, y + fillHeight - bar1Height - 1, groupTemplate, framework.svgElements, framework.svg);
@@ -49,7 +51,7 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
   var coreDistance;
   var key, drawData;
   var group;
-  var i,j;
+  var i, j;
   var barPoints = 0;
 
   // combine all barchart data
@@ -61,6 +63,8 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
           combinedData.push({
             screen_x: processedGroupData[groupIds[i]][j].screen_x,
             screen_y: processedGroupData[groupIds[i]][j].screen_y,
+            x: processedGroupData[groupIds[i]][j].x,
+            y: processedGroupData[groupIds[i]][j].y,
             groupId: groupIds[i],
             label: processedGroupData[groupIds[i]][j].label
           });
@@ -70,7 +74,9 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
     }
   }
 
-  if (barPoints === 0) {return;}
+  if (barPoints === 0) {
+    return;
+  }
 
   // sort by time and by group
   combinedData.sort(function (a, b) {
@@ -93,15 +99,23 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
     key = combinedData[i].screen_x;
     var heightOffset = 0;
     if (intersections[key] === undefined) {
-      if (i+1 < combinedData.length) {coreDistance = Math.abs(combinedData[i+1].screen_x - key);}
-      if (i > 0)                     {coreDistance = Math.min(coreDistance,Math.abs(combinedData[i-1].screen_x - key));}
+      if (i + 1 < combinedData.length) {
+        coreDistance = Math.abs(combinedData[i + 1].screen_x - key);
+      }
+      if (i > 0) {
+        coreDistance = Math.min(coreDistance, Math.abs(combinedData[i - 1].screen_x - key));
+      }
       drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth);
     }
     else {
       var nextKey = i + (intersections[key].amount - intersections[key].resolved);
       var prevKey = i - (intersections[key].resolved + 1);
-      if (nextKey < combinedData.length) {coreDistance = Math.abs(combinedData[nextKey].screen_x - key);}
-      if (prevKey > 0)                   {coreDistance = Math.min(coreDistance,Math.abs(combinedData[prevKey].screen_x - key));}
+      if (nextKey < combinedData.length) {
+        coreDistance = Math.abs(combinedData[nextKey].screen_x - key);
+      }
+      if (prevKey > 0) {
+        coreDistance = Math.min(coreDistance, Math.abs(combinedData[prevKey].screen_x - key));
+      }
       drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth);
       intersections[key].resolved += 1;
 
@@ -117,17 +131,23 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
       }
       else if (group.options.barChart.sideBySide === true) {
         drawData.width = drawData.width / intersections[key].amount;
-        drawData.offset += (intersections[key].resolved) * drawData.width - (0.5*drawData.width * (intersections[key].amount+1));
-        if (group.options.barChart.align === 'left')       {drawData.offset -= 0.5*drawData.width;}
-        else if (group.options.barChart.align === 'right') {drawData.offset += 0.5*drawData.width;}
+        drawData.offset += (intersections[key].resolved) * drawData.width - (0.5 * drawData.width * (intersections[key].amount + 1));
+        if (group.options.barChart.align === 'left') {
+          drawData.offset -= 0.5 * drawData.width;
+        }
+        else if (group.options.barChart.align === 'right') {
+          drawData.offset += 0.5 * drawData.width;
+        }
       }
     }
     DOMutil.drawBar(combinedData[i].screen_x + drawData.offset, combinedData[i].screen_y - heightOffset, drawData.width, group.zeroPosition - combinedData[i].screen_y, group.className + ' vis-bar', framework.svgElements, framework.svg, group.style);
     // draw points
     if (group.options.drawPoints.enabled === true) {
       let pointData = {
-        screen_x:combinedData[i].screen_x,
-        screen_y:combinedData[i].screen_y - heightOffset,
+        screen_x: combinedData[i].screen_x,
+        screen_y: combinedData[i].screen_y - heightOffset,
+        x: combinedData[i].x,
+        y: combinedData[i].y,
         groupId: combinedData[i].groupId,
         label: combinedData[i].label
       };
@@ -156,7 +176,12 @@ Bargraph._getDataIntersections = function (intersections, combinedData) {
     }
     if (coreDistance === 0) {
       if (intersections[combinedData[i].screen_x] === undefined) {
-        intersections[combinedData[i].screen_x] = {amount: 0, resolved: 0, accumulatedPositive: 0, accumulatedNegative: 0};
+        intersections[combinedData[i].screen_x] = {
+          amount: 0,
+          resolved: 0,
+          accumulatedPositive: 0,
+          accumulatedNegative: 0
+        };
       }
       intersections[combinedData[i].screen_x].amount += 1;
     }
@@ -201,13 +226,13 @@ Bargraph._getSafeDrawData = function (coreDistance, group, minWidth) {
   return {width: width, offset: offset};
 };
 
-Bargraph.getStackedYRange = function(combinedData, groupRanges, groupIds, groupLabel, orientation) {
+Bargraph.getStackedYRange = function (combinedData, groupRanges, groupIds, groupLabel, orientation) {
   if (combinedData.length > 0) {
     // sort by time and by group
     combinedData.sort(function (a, b) {
       if (a.screen_x === b.screen_x) {
         return a.groupId < b.groupId ? -1 : 1;
-      } 
+      }
       else {
         return a.screen_x - b.screen_x;
       }

lib/timeline/component/graph2d_types/points.js

@@ -66,7 +66,6 @@ function getCallback(framework, group) {
   if (group.group.options && group.group.options.drawPoints && group.group.options.drawPoints.onRender && typeof group.group.options.drawPoints.onRender == 'function') {
     callback = group.group.options.drawPoints.onRender;
   }
-
   return callback;
 }