1 files changed, 22 insertions, 11 deletions

diff --git a/addons/web/static/src/js/views/graph/graph_renderer.js b/addons/web/static/src/js/views/graph/graph_renderer.js
index 02fdb102358..9c70811ed18 100644
--- a/addons/web/static/src/js/views/graph/graph_renderer.js
+++ b/addons/web/static/src/js/views/graph/graph_renderer.js
@@ -216,6 +216,24 @@ return AbstractRenderer.extend({
         return this.state.origins[dataPt.originIndex];
     },
     /**
+     * Returns an object used to style chart elements independently from the datasets.
+     *
+     * @private
+     * @returns {Object}
+     */
+    _getElementOptions: function () {
+        var elementOptions = {};
+        if (this.state.mode === 'bar') {
+            elementOptions.rectangle = {borderWidth: 1};
+        } else if (this.state.mode === 'line') {
+            elementOptions.line = {
+                tension: 0,
+                fill: false,
+            };
+        }
+        return elementOptions;
+    },
+    /**
      * Returns a DateClasses instance used to manage equivalence of dates.
      *
      * @private
@@ -250,9 +268,8 @@ return AbstractRenderer.extend({
             } else {
                 return dataPt.labels.slice(0, 1);
             }
-        } else if (i >= 0) {
+        } else if (i === 0) {
             return Array.prototype.concat.apply([], [
-                        dataPt.labels.slice(0, i),
                         this.dateClasses.dateClass(dataPt.originIndex, dataPt.labels[i]),
                         dataPt.labels.slice(i+1)
                     ]);
@@ -563,6 +580,7 @@ return AbstractRenderer.extend({
             scales: this._getScaleOptions(),
             legend: this._getLegendOptions(datasetsCount),
             tooltips: this._getTooltipOptions(datasetsCount),
+            elements: this._getElementOptions(),
         };
     },
     /**
@@ -583,7 +601,7 @@ return AbstractRenderer.extend({
         if (_.contains(['bar', 'line'], this.state.mode) && i === 0) {
             // here label is an array of length 1 and contains a number
             return this.dateClasses.representative(label, originIndex) || '';
-        } else if (this.state.mode === 'pie' && i >= 0) {
+        } else if (this.state.mode === 'pie' && i === 0) {
             // here label is an array of length at least one containing string or numbers
             var labelCopy = label.slice(0);
             if (originIndex !== undefined) {
@@ -637,7 +655,7 @@ return AbstractRenderer.extend({
             this.$el.append($canvasContainer);
 
             var i = this.state.comparisonFieldIndex;
-            if (i === 0 || (i > 0 && this.state.mode === 'pie')) {
+            if (i === 0) {
                 this.dateClasses = this._getDateClasses(dataPoints);
             }
             if (this.state.mode === 'bar') {
@@ -661,9 +679,6 @@ return AbstractRenderer.extend({
     _renderBarChart: function (dataPoints) {
         var self = this;
 
-        // style rectangles
-        Chart.defaults.global.elements.rectangle.borderWidth = 1;
-
         // prepare data
         var data = this._prepareData(dataPoints);
         data.datasets.forEach(function (dataset, index) {
@@ -694,10 +709,6 @@ return AbstractRenderer.extend({
     _renderLineChart: function (dataPoints) {
         var self = this;
 
-        // style lines
-        Chart.defaults.global.elements.line.tension = 0;
-        Chart.defaults.global.elements.line.fill = false;
-
         // prepare data
         var data = this._prepareData(dataPoints);
         data.datasets.forEach(function (dataset, index) {