Add Show dot option on Linechart, fix #71

Author: Jelte Lagendijk

src/ChartJS/widgets/LineChart/LineChart.xml

@@ -296,10 +296,15 @@
             <category>Settings Line Chart</category>
             <description>Tension of the bezier curve between points. (This is usually around 0.4 or lower)</description>
         </property>
+        <property key="pointDot" type="boolean" required="true" defaultValue="true">
+            <caption>Show dot</caption>
+            <category>Data Point</category>
+            <description>Show dots on a data point.</description>
+        </property>
         <property key="pointRadius" type="integer" required="true" defaultValue="3">
             <caption>Dot radius</caption>
             <category>Data Point</category>
-            <description>Radius of each point dot in pixels. Set to zero to disable dots</description>
+            <description>Radius of each point dot in pixels</description>
         </property>
         <property key="pointBorderWidth" type="integer" required="true" defaultValue="1">
             <caption>Dot stroke width</caption>

src/ChartJS/widgets/LineChart/widget/LineChart.js

@@ -15,6 +15,7 @@ define([
 
         _processData : function () {
             logger.debug(this.id + "._processData");
+
             var sets = [],
                 points = null,
                 set = {
@@ -79,7 +80,6 @@ define([
                     _bezier = 0.4;
                 }
 
-
                 _set = {
                     label : (this.scaleShowLabelsBottom === true) ? label : "",
                     backgroundColor: (this.seriesColorReduceOpacity) ? this._hexToRgb(color, "0.2") : color,
@@ -111,10 +111,8 @@ define([
         },
 
         _createChart : function (data) {
-
             logger.debug(this.id + "._createChart");
 
-
             if (this._chart) {
                 this._chart.stop();
                 this._chart.data.datasets = data.datasets;
@@ -123,6 +121,7 @@ define([
                 this._chart.bindEvents(); // tooltips otherwise won't work
             } else {
                 logger.debug("stacked:" + this.isStacked);
+
                 this._chart = new this._chartJS(this._ctx, {
                     type: "line",
                     data: data,
@@ -172,15 +171,15 @@ define([
                             labels : { fontFamily : this._font }
                         },
                         elements: {
-
                             point: {
-                                radius : this.pointRadius,
-                                borderWidth : this.pointBorderWidth,
+                                radius : this.pointDot ? this.pointRadius : 0,
+                                borderWidth : this.pointDot ? this.pointBorderWidth : 0,
                                 hitRadius : this.pointHitRadius,
                                 hoverRadius : this.pointHoverRadius,
                                 hoverBorderWidth : this.pointHoverBorderWidth
                             }
                         },
+
                         //Boolean - Whether to show labels on the scale
                         scaleShowLabels : this.scaleShowLabels,
 
@@ -231,7 +230,6 @@ define([
                     }
                 });
 
-
                 this.connect(window, "resize", lang.hitch(this, function () {
                     this._resize();
                 }));