]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Allow turning off lines on a per dataset basis 2658/head
authorEvert Timberg <evert.timberg+github@gmail.com>
Sat, 28 May 2016 02:20:51 +0000 (22:20 -0400)
committerEvert Timberg <evert.timberg+github@gmail.com>
Sat, 28 May 2016 02:20:51 +0000 (22:20 -0400)
docs/03-Line-Chart.md
src/controllers/controller.line.js
test/controller.line.tests.js

index d15de299a67b0a7cc5fe4dbb42c8e6311be211ca..45b95d231641d653ffddb1cfa29a76cae2d68cb8 100644 (file)
@@ -57,6 +57,7 @@ pointHoverBackgroundColor | `Color or Array<Color>` | Point background color whe
 pointHoverBorderColor | `Color or Array<Color>` | Point border color when hovered
 pointHoverBorderWidth | `Number or Array<Number>` | Border width of point when hovered
 pointStyle | `String, Array<String>, Image, Array<Image>` | The style of point. Options are 'circle', 'triangle', 'rect', 'rectRot', 'cross', 'crossRot', 'star', 'line', and 'dash'. If the option is an image, that image is drawn on the canvas using `drawImage`. 
+showLine | `Boolean` | If false, the line is not drawn for this dataset
 
 An example data object using these attributes is shown below.
 ```javascript
index ef3f2b65d4b22731c0322edbad516de5572bdb9d..48cae30a903781cdfcef58ecae4bd9efa7d8b5f0 100644 (file)
@@ -23,6 +23,10 @@ module.exports = function(Chart) {
                }
        };
 
+       function lineEnabled(dataset, options) {
+               return helpers.getValueOrDefault(dataset.showLine, options.showLines);
+       }
+
        Chart.controllers.line = Chart.DatasetController.extend({
 
                datasetElementType: Chart.elements.Line,
@@ -37,7 +41,7 @@ module.exports = function(Chart) {
                        Chart.DatasetController.prototype.addElementAndReset.call(me, index);
 
                        // Make sure bezier control points are updated
-                       if (options.showLines && meta.dataset._model.tension !== 0) {
+                       if (lineEnabled(me.getDataset(), options) && meta.dataset._model.tension !== 0) {
                                me.updateBezierControlPoints();
                        }
                },
@@ -50,11 +54,12 @@ module.exports = function(Chart) {
                        var options = me.chart.options;
                        var lineElementOptions = options.elements.line;
                        var scale = me.getScaleForId(meta.yAxisID);
-                       var i, ilen, dataset, custom;
+                       var i, ilen, custom;
+                       var dataset = me.getDataset();
+                       var showLine = lineEnabled(dataset, options);
 
                        // Update Line
-                       if (options.showLines) {
-                               dataset = me.getDataset();
+                       if (showLine) {
                                custom = line.custom || {};
 
                                // Compatibility: If the properties are defined with only the old name, use those values
@@ -93,7 +98,7 @@ module.exports = function(Chart) {
                                me.updateElement(points[i], i, reset);
                        }
 
-                       if (options.showLines && line._model.tension !== 0) {
+                       if (showLine && line._model.tension !== 0) {
                                me.updateBezierControlPoints();
                        }
 
@@ -254,6 +259,7 @@ module.exports = function(Chart) {
                },
 
                draw: function(ease) {
+                       var me = this;
                        var meta = this.getMeta();
                        var points = meta.data || [];
                        var easingDecimal = ease || 1;
@@ -265,7 +271,7 @@ module.exports = function(Chart) {
                        }
 
                        // Transition and Draw the line
-                       if (this.chart.options.showLines) {
+                       if (lineEnabled(me.getDataset(), me.chart.options)) {
                                meta.dataset.transition(easingDecimal).draw();
                        }
 
index 6172f444f12647cc45c6285dcc16c0170d86fb65..782cf8f4332112d2026726d51d0e6585daaebbcc 100644 (file)
@@ -138,6 +138,38 @@ describe('Line controller tests', function() {
                expect(meta.data[3].draw.calls.count()).toBe(1);
        });
 
+       it('should draw all elements except lines turned off per dataset', function() {
+               var chart = window.acquireChart({
+                       type: 'line',
+                       data: {
+                               datasets: [{
+                                       data: [10, 15, 0, -4],
+                                       label: 'dataset1',
+                                       showLine: false
+                               }],
+                               labels: ['label1', 'label2', 'label3', 'label4']
+                       },
+                       options: {
+                               showLines: true
+                       }
+               });
+
+               var meta = chart.getDatasetMeta(0);
+               spyOn(meta.dataset, 'draw');
+               spyOn(meta.data[0], 'draw');
+               spyOn(meta.data[1], 'draw');
+               spyOn(meta.data[2], 'draw');
+               spyOn(meta.data[3], 'draw');
+
+               chart.update();
+               
+               expect(meta.dataset.draw.calls.count()).toBe(0);
+               expect(meta.data[0].draw.calls.count()).toBe(1);
+               expect(meta.data[1].draw.calls.count()).toBe(1);
+               expect(meta.data[2].draw.calls.count()).toBe(1);
+               expect(meta.data[3].draw.calls.count()).toBe(1);
+       });
+
        it('should update elements when modifying data', function() {
                var chart = window.acquireChart({
                        type: 'line',