@eclipse-scout/chart 11.0.39 → 22.0.0-beta.1

package/src/chart/FulfillmentChartRenderer.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -24,8 +24,10 @@ export default class FulfillmentChartRenderer extends AbstractSvgChartRenderer {
     this.suppressLegendBox = true;
 
     let defaultConfig = {
-      fulfillment: {
-        startValue: undefined
+      options: {
+        fulfillment: {
+          startValue: undefined
+        }
       }
     };
     chart.config = $.extend(true, {}, defaultConfig, chart.config);
@@ -65,7 +67,7 @@ export default class FulfillmentChartRenderer extends AbstractSvgChartRenderer {
       arcClass += ' ' + chartGroupCss;
     }
 
-    let startValue = scout.nvl(this.chart.config.fulfillment.startValue, 0);
+    let startValue = scout.nvl(this.chart.config.options.fulfillment.startValue, 0);
     let end = 0;
     let lastEnd = 0;
     if (total) {
@@ -177,7 +179,7 @@ export default class FulfillmentChartRenderer extends AbstractSvgChartRenderer {
    * If startValue is not set use default implementation.
    */
   shouldAnimateRemoveOnUpdate(opts) {
-    let startValue = objects.optProperty(this.chart, 'config', 'fulfillment', 'startValue');
+    let startValue = objects.optProperty(this.chart, 'config', 'options', 'fulfillment', 'startValue');
     if (!objects.isNullOrUndefined(startValue)) {
       return false;
     }

package/src/chart/SalesfunnelChartRenderer.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -31,9 +31,11 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
     this.suppressLegendBox = true;
 
     let defaultConfig = {
-      salesfunnel: {
-        normalized: undefined,
-        calcConversionRate: undefined
+      options: {
+        salesfunnel: {
+          normalized: undefined,
+          calcConversionRate: undefined
+        }
       }
     };
     chart.config = $.extend(true, {}, defaultConfig, chart.config);
@@ -47,8 +49,8 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
       chartData.axes.length !== chartData.chartValueGroups.length ||
       chartData.chartValueGroups.length === 0 ||
       chartData.chartValueGroups[0].values.length === 0 ||
-      chartConfig.salesfunnel.normalized === undefined ||
-      chartConfig.salesfunnel.calcConversionRate === undefined) {
+      chartConfig.options.salesfunnel.normalized === undefined ||
+      chartConfig.options.salesfunnel.calcConversionRate === undefined) {
       return false;
     }
     return true;
@@ -70,7 +72,7 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
       this.conversionRateWidth;
     this.centerX = this.barAreaWidth / 2;
 
-    if (this.chart.config.salesfunnel.normalized) {
+    if (this.chart.config.options.salesfunnel.normalized) {
       this._renderBarsNormalized(chartData.chartValueGroups);
     } else {
       this._renderBarsAccordingToValues(chartData.chartValueGroups);
@@ -131,7 +133,7 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
       }
       if (i > 0) {
         this._renderLabelSeparatorLine(yCoord, labelLineWidth);
-        if (this.chart.config.salesfunnel.calcConversionRate) {
+        if (this.chart.config.options.salesfunnel.calcConversionRate) {
           this._renderConversionRate(i, startPointX, this._calcConversionRate(chartValueGroups[i - 1].values[0], chartValueGroups[i].values[0]));
         }
       }
@@ -157,10 +159,10 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
         .attr('opacity', 0)
         .animateSVG('opacity', 1, this.animationDuration, null, true);
     }
-    if (this.chart.config.options.tooltips.enabled && this.chart.data.axes.length > 0) {
+    if (this.chart.config.options.plugins.tooltip.enabled && this.chart.data.axes.length > 0) {
       let desc = this.chart.data.axes[barIndexFromTop][secondLabel ? 1 : 0].label,
-        textBoundings = this._measureText(label, labelClass);
-      this._renderWireLabels(desc, $label, x - textBoundings.width / 2, y - textBoundings.height);
+        textBounds = this._measureText(label, labelClass);
+      this._renderWireLabels(desc, $label, x - textBounds.width / 2, y - textBounds.height);
     }
   }
 
@@ -207,12 +209,11 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
       return;
     }
     let ctrlY = barIndexFromTop * this.barHeight,
-      labelRenderPointY = ctrlY,
       labelClass = this._dynamicCssClass('salesfunnel-conversionrate-label');
 
     let $label = this.$svg.appendSVG('text', labelClass)
       .attr('x', startPointX)
-      .attr('y', labelRenderPointY)
+      .attr('y', ctrlY)
       .text('↓ ' + conversionRate + '%');
     if (this.animationDuration) {
       $label
@@ -322,7 +323,7 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
       }
       if (i > 0) {
         this._renderLabelSeparatorLine(yCoord, labelLineWidth);
-        if (this.chart.config.salesfunnel.calcConversionRate) {
+        if (this.chart.config.options.salesfunnel.calcConversionRate) {
           this._renderConversionRate(i, startPointX, this._calcConversionRate(chartValueGroups[i - 1].values[0], chartValueGroups[i].values[0]));
         }
       }
@@ -417,7 +418,7 @@ export default class SalesfunnelChartRenderer extends AbstractSvgChartRenderer {
   }
 
   _dynamicConversionRateWidth() {
-    if (!this.chart.config.salesfunnel.calcConversionRate) {
+    if (!this.chart.config.options.salesfunnel.calcConversionRate) {
       return 0; // don't show conversion rate
     }
     if (this.chartBox.width <= this.widthThresholdSmall) {

package/src/chart/SpeedoChartRenderer.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -19,8 +19,10 @@ export default class SpeedoChartRenderer extends AbstractSvgChartRenderer {
     this.suppressLegendBox = true;
 
     let defaultConfig = {
-      speedo: {
-        greenAreaPosition: undefined
+      options: {
+        speedo: {
+          greenAreaPosition: undefined
+        }
       }
     };
     chart.config = $.extend(true, {}, defaultConfig, chart.config);
@@ -53,7 +55,7 @@ export default class SpeedoChartRenderer extends AbstractSvgChartRenderer {
       chartData.axes.length > 0 ||
       chartData.chartValueGroups.length !== 1 ||
       chartData.chartValueGroups[0].values.length !== 3 ||
-      chartConfig.speedo.greenAreaPosition === undefined) {
+      chartConfig.options.speedo.greenAreaPosition === undefined) {
       return false;
     }
     return true;
@@ -74,7 +76,7 @@ export default class SpeedoChartRenderer extends AbstractSvgChartRenderer {
     this.my = this.chartBox.yOffset + this.chartBox.height - (this.chartBox.height - this.r * 1.12) / 2;
 
     // number of parts in the scale
-    this.parts = this.chart.config.speedo.greenAreaPosition === SpeedoChartRenderer.Position.CENTER ?
+    this.parts = this.chart.config.options.speedo.greenAreaPosition === SpeedoChartRenderer.Position.CENTER ?
       SpeedoChartRenderer.NUM_PARTS_GREEN_CENTER : SpeedoChartRenderer.NUM_PARTS_GREEN_EDGE;
 
     // number of lines per part
@@ -203,8 +205,8 @@ export default class SpeedoChartRenderer extends AbstractSvgChartRenderer {
       legendValue = value ? this._formatValue(value) : 0,
       maxLegendValue = maxValue ? this._formatValue(maxValue) : 0;
 
-    // tooltips for min/max value
-    if (this.chart.config.options.tooltips.enabled) {
+    // tooltip for min/max value
+    if (this.chart.config.options.plugins.tooltip.enabled) {
       // min value
       let $minLegend = this.$svg.appendSVG('text', 'line-label line-chart-wire-label')
         .attr('x', this.chartBox.mX() - this.r)
@@ -234,7 +236,7 @@ export default class SpeedoChartRenderer extends AbstractSvgChartRenderer {
     }
 
     // actual value
-    if (this.chart.config.options.legend.display) {
+    if (this.chart.config.options.plugins.legend.display) {
       this._renderLineLabel(positions.x2 + padding, positions.y2 + positions.v * padding, legendValue, '', false)
         .addClass('speedo-chart-label')
         .attr('style', 'font-size: ' + this.scaleWeight * 1.55 + 'px;');
@@ -317,7 +319,7 @@ export default class SpeedoChartRenderer extends AbstractSvgChartRenderer {
   }
 
   _getColorForPart(part) {
-    let position = this.chart.config.speedo.greenAreaPosition;
+    let position = this.chart.config.options.speedo.greenAreaPosition;
     switch (position) {
       case SpeedoChartRenderer.Position.LEFT:
         // only four parts

package/src/chart/VennAsync3Calculator.js

@@ -117,13 +117,6 @@ export default class VennAsync3Calculator {
       rBest = this.rBest,
       errorBest = this.errorBest;
 
-    let stepFactor = 1;
-    // sorry... ie is (verry, buggy) slow
-    // TODO [15.4] bsh: find better solution for ie, or error calculation
-    if (Device.get().isInternetExplorer()) {
-      stepFactor = 5;
-    }
-
     for (let d = 0; d < maxD; d += dStep) {
       // calc x, y
       let x = x1 + d * Math.cos(alpha);
@@ -138,8 +131,8 @@ export default class VennAsync3Calculator {
         let maxX = Math.max(x1 + r1, x2 + r2, x + r);
         let minY = Math.min(y1 - r1, y2 - r2, y - r);
         let maxY = Math.max(y1 + r1, y2 + r2, y + r);
-        let stepX = (maxX - minX) / 100 * stepFactor;
-        let stepY = (maxY - minY) / 100 * stepFactor;
+        let stepX = (maxX - minX) / 100;
+        let stepY = (maxY - minY) / 100;
 
         // areas of venn
         let a1 = 0,

package/src/chart/VennChartRenderer.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -19,8 +19,10 @@ export default class VennChartRenderer extends AbstractSvgChartRenderer {
     this.suppressLegendBox = true;
 
     let defaultConfig = {
-      venn: {
-        numberOfCircles: undefined
+      options: {
+        venn: {
+          numberOfCircles: undefined
+        }
       }
     };
     chart.config = $.extend(true, {}, defaultConfig, chart.config);
@@ -45,11 +47,9 @@ export default class VennChartRenderer extends AbstractSvgChartRenderer {
       return false;
     }
 
-    this.setLoading(true);
-
     // basic values
     this.data = this.chart.data.chartValueGroups;
-    this.numberOfCircles = this.chart.config.venn.numberOfCircles;
+    this.numberOfCircles = this.chart.config.options.venn.numberOfCircles;
 
     // render parameter
     let distR = 10,
@@ -81,7 +81,6 @@ export default class VennChartRenderer extends AbstractSvgChartRenderer {
     // Final callback
     let draw = function() {
       this.readyToDraw = true;
-      this.setLoading(false);
       if (!this.$svg.isAttached()) {
         // user navigated away. do not try to render-> error
         return;
@@ -123,19 +122,9 @@ export default class VennChartRenderer extends AbstractSvgChartRenderer {
 
   remove(requestAnimation, afterRemoveFunc) {
     this._cancelAsync3Calculator();
-    this.setLoading(false);
     super.remove(requestAnimation, afterRemoveFunc);
   }
 
-  setLoading(loading) {
-    if (loading && !this.$loadingIndicator && this.chart && this.chart.rendered) {
-      this.$loadingIndicator = this.chart.$container.appendDiv('venn-chart-loading-indicator');
-    } else if (!loading && this.$loadingIndicator) {
-      this.$loadingIndicator.remove();
-      this.$loadingIndicator = null;
-    }
-  }
-
   // calculation
 
   _calc1(v1) {

package/src/style/colors-dark.less

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -10,16 +10,54 @@
  */
 
 @chart-alternative-line-label-background-color: @chart-line-label-color;
-@chart-axis-line-color: @text-color;
-@chart-axis-text-color: @text-color;
-@chart-axis-label-color: @palette-gray-2-1;
-@chart-legend-label-color: @text-color;
+@chart-axis-line-color-inverted: @chart-axis-line-color;
+@chart-axis-label-color-inverted: @chart-axis-label-color;
 @chart-line-label-background-color: @chart-line-label-color;
-@chart-tooltip-background-color: @palette-gray-7;
-@chart-tooltip-border-color: @palette-gray-2-1;
-@chart-type-color: @palette-gray-3;
 @fulfillment-chart-inverted-label-color: @chart-axis-text-color;
-@salesfunnel-alternative-label-color: @text-color;
-@salesfunnel-label-color: @text-color;
-@speedo-chart-dark-green: @palette-green-4;
+@fufillment-chart-inner-circle-color: @fade-white-2;
+
+@chart-data-color-1-rainbow: @palette-blue-2;
+@chart-data-color-2-rainbow: @palette-orange-2;
+@chart-data-color-3-rainbow: @palette-green-2;
+@chart-data-color-4-rainbow: @palette-gray-4;
+@chart-data-color-5-rainbow: @palette-red-2;
+@chart-data-color-6-rainbow: @palette-green-2;
+
+@chart-data-color-1: @palette-blue-3;
+@chart-data-color-2: lighten(@palette-blue-3, 8%);
+@chart-data-color-3: darken(@palette-blue-2, 8%);
+@chart-data-color-4: @palette-blue-2;
+@chart-data-color-5: @palette-blue-1;
+@chart-data-color-6: @palette-blue-0;
+
+@chart-data-color-1-inverted: @chart-data-color-6;
+@chart-data-color-2-inverted: @chart-data-color-5;
+@chart-data-color-3-inverted: @chart-data-color-4;
+@chart-data-color-4-inverted: @chart-data-color-3;
+@chart-data-color-5-inverted: @chart-data-color-2;
+@chart-data-color-6-inverted: @chart-data-color-1;
+
+@chart-data-color-1-alternative: darken(@palette-green-3, 5%);
+@chart-data-color-2-alternative: @palette-green-3;
+@chart-data-color-3-alternative: darken(@palette-green-2, 8%);
+@chart-data-color-4-alternative: @palette-green-2;
+@chart-data-color-5-alternative: @palette-green-1;
+@chart-data-color-6-alternative: @palette-green-0;
+
+@chart-data-color-1-alternative-inverted: @chart-data-color-6-alternative;
+@chart-data-color-2-alternative-inverted: @chart-data-color-5-alternative;
+@chart-data-color-3-alternative-inverted: @chart-data-color-4-alternative;
+@chart-data-color-4-alternative-inverted: @chart-data-color-3-alternative;
+@chart-data-color-5-alternative-inverted: @chart-data-color-2-alternative;
+@chart-data-color-6-alternative-inverted: @chart-data-color-1-alternative;
+
+@chart-data-color: @chart-data-color-3;
+@chart-data-color-inverted: @chart-data-color-3-inverted;
+@chart-data-color-alternative: @chart-data-color-3-alternative;
+@chart-data-color-rainbow: @chart-data-color-3-rainbow;
+@chart-data-color-alternative-inverted: @chart-data-color-3-alternative-inverted;
+
+@speedo-chart-dark-green: @palette-green-3;
 @speedo-chart-green: @palette-green-2;
+@speedo-chart-yellow: @palette-orange-2;
+@speedo-chart-red: @palette-red-2;

package/src/style/colors.less

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -9,67 +9,85 @@
  *     BSI Business Systems Integration AG - initial API and implementation
  */
 
-@palette-lila: #8F13FD;
-@palette-yellow: #F8E71D;
+@chart-axis-line-color: @border-color;
+@chart-axis-line-color-inverted: fade(@chart-axis-line-color, 30%);
+@chart-axis-text-color: @tile-default-color;
+@chart-axis-label-color: @tile-default-color;
+@chart-axis-label-color-inverted: @palette-white;
 
-@chart-axis-line-color: @palette-gray-5;
-@chart-axis-text-color: @palette-gray-7;
-@chart-axis-label-color: @palette-gray-6;
-@chart-data-active-color: @palette-blue-3;
-@chart-data-active-color-rainbow: darken(@palette-blue-5, 7%);
-@chart-data-active-color-alternative: @palette-cyan-3;
-@chart-data-active-color-alternative-inverted: @palette-cyan-2;
-@chart-data-active-color-inverted: darken(@palette-blue-2, 10%);
-@chart-data-color-1-rainbow: @palette-blue-5;
-@chart-data-color-1-alternative-inverted: @palette-cyan-2;
-@chart-data-color-1-alternative: @palette-cyan-3;
-@chart-data-color-1-inverted: @palette-blue-2;
-@chart-data-color-1: @palette-blue-6;
+// Chart colors used for non chart.js charts (salesfunnel, fulfillment, venn)
+@chart-data-color: @chart-data-color-1;
+@chart-data-hover-color: darken(@chart-data-color, 7%);
+@chart-data-selected-color: darken(@chart-data-color, 12%);
+
+@chart-data-color-inverted: @chart-data-color-1-inverted;
+@chart-data-hover-color-inverted: darken(@chart-data-color-inverted, 7%);
+@chart-data-selected-color-inverted: darken(@chart-data-color-inverted, 12%);
+
+@chart-data-color-alternative: @chart-data-color-1-alternative;
+@chart-data-hover-color-alternative: darken(@chart-data-color-alternative, 7%);
+@chart-data-selected-color-alternative: darken(@chart-data-color-alternative, 12%);
+
+@chart-data-color-rainbow: @chart-data-color-1-rainbow;
+@chart-data-hover-color-rainbow: darken(@chart-data-color-rainbow, 7%);
+@chart-data-selected-color-rainbow: darken(@chart-data-color-rainbow, 12%);
+
+@chart-data-color-alternative-inverted: @chart-data-color-1-alternative-inverted;
+@chart-data-hover-color-alternative-inverted: darken(@chart-data-color-alternative-inverted, 7%);
+@chart-data-selected-color-alternative-inverted: darken(@chart-data-color-alternative-inverted, 12%);
+
+@chart-data-white-hover-color: @palette-gray-2; // For salesfunnel
+
+@chart-data-color-1: @palette-blue-3;
+@chart-data-color-2: lighten(@palette-blue-3, 5%);
+@chart-data-color-3: @palette-blue-2;
+@chart-data-color-4: @palette-blue-1;
+@chart-data-color-5: @palette-blue-4;
+@chart-data-color-6: @palette-blue-5;
+
+@chart-data-color-1-inverted: @palette-blue-1;
+@chart-data-color-2-inverted: darken(@palette-blue-1, 10%);
+@chart-data-color-3-inverted: @palette-blue-2;
+@chart-data-color-4-inverted: darken(@palette-blue-2, 10%);
+@chart-data-color-5-inverted: @palette-blue-4;
+@chart-data-color-6-inverted: @palette-blue-5;
+
+@chart-data-color-1-rainbow: @palette-blue-3;
 @chart-data-color-2-rainbow: @palette-orange-3;
-@chart-data-color-2-alternative-inverted: @palette-cyan-3;
-@chart-data-color-2-alternative: @palette-cyan-5;
-@chart-data-color-2-inverted: @palette-blue-4;
-@chart-data-color-2: @palette-blue-5;
 @chart-data-color-3-rainbow: @palette-green-3;
-@chart-data-color-3-alternative-inverted: @palette-cyan-5;
-@chart-data-color-3-alternative: @palette-green-4;
-@chart-data-color-3-inverted: @palette-blue-7;
-@chart-data-color-3: @palette-blue-4;
-@chart-data-color-4-rainbow: @palette-red-3;
-@chart-data-color-4-alternative-inverted: @palette-green-3;
-@chart-data-color-4-alternative: @palette-green-3;
-@chart-data-color-4-inverted: @palette-cyan-4;
-@chart-data-color-4: @palette-blue-3;
-@chart-data-color-5-rainbow: @palette-lila;
-@chart-data-color-5-alternative-inverted: @palette-green-2;
-@chart-data-color-5-alternative: @palette-green-2;
-@chart-data-color-5-inverted: @palette-cyan-3;
-@chart-data-color-5: @palette-blue-2;
-@chart-data-color-6-rainbow: @palette-yellow;
-@chart-data-color-6-alternative-inverted: @palette-green-1;
-@chart-data-color-6-alternative: @palette-green-1;
-@chart-data-color-6-inverted: @palette-cyan-2;
-@chart-data-color-6: @palette-blue-7;
-@chart-data-color: @palette-blue-5;
-@chart-data-text-color: @palette-white;
-@chart-legend-label-color: inherit;
+@chart-data-color-4-rainbow: @palette-gray-7;
+@chart-data-color-5-rainbow: @palette-red-3;
+@chart-data-color-6-rainbow: @palette-green-5;
+
+@chart-data-color-1-alternative: @palette-green-4;
+@chart-data-color-2-alternative: lighten(@palette-green-4, 5%);
+@chart-data-color-3-alternative: @palette-green-3;
+@chart-data-color-4-alternative: @palette-green-2;
+@chart-data-color-5-alternative: @palette-green-1;
+@chart-data-color-6-alternative: @palette-green-5;
+
+@chart-data-color-1-alternative-inverted: @palette-green-1;
+@chart-data-color-2-alternative-inverted: @palette-green-2;
+@chart-data-color-3-alternative-inverted: @palette-green-3;
+@chart-data-color-4-alternative-inverted: @palette-green-4;
+@chart-data-color-5-alternative-inverted: @palette-green-5;
+@chart-data-color-6-alternative-inverted: darken(@palette-green-5, 10%);
+
+@chart-data-label-color: @text-inverted-color;
+@chart-legend-label-color: @chart-axis-label-color;
+@chart-legend-label-inverted-color: @chart-axis-label-color-inverted;
 @chart-line-label-color: @chart-axis-text-color;
+@chart-line-label-border-color: @chart-line-label-color;
+@chart-line-label-inverted-border-color: @chart-axis-label-color-inverted;
 @chart-line-label-background-color: @tile-default-background-color;
 @chart-alternative-line-label-background-color: @tile-alternative-background-color;
-@chart-selected-color: @active-inverted-background-color;
-@chart-tooltip-background-color: @palette-gray-9;
-@chart-tooltip-border-color: transparent;
-@chart-type-color: @palette-gray-5;
-@fulfillment-chart-inverted-label-color: @palette-gray-3;
-@speedo-chart-dark-green: #075163;
-@speedo-chart-green: @palette-cyan-4;
-@speedo-chart-yellow: @palette-orange-4;
-@speedo-chart-red: #dc2938;
+@fulfillment-chart-inverted-label-color: @tile-default-inverted-color;
+@fufillment-chart-inner-circle-color: @palette-gray-3;
+@speedo-chart-dark-green: @palette-green-4;
+@speedo-chart-green: @palette-green-3;
+@speedo-chart-yellow: @palette-orange-3;
+@speedo-chart-red: @palette-red-3;
 @salesfunnel-bar-label-color: @palette-white;
 @salesfunnel-alternative-bar-label-color: @salesfunnel-bar-label-color;
 @salesfunnel-inverted-bar-label-color: @tile-default-inverted-background-color;
-@salesfunnel-label-color: @salesfunnel-chart-bar-color;
-@salesfunnel-alternative-label-color: @salesfunnel-alternative-chart-bar-color;
-@salesfunnel-chart-bar-color: @chart-data-color-2;
-@salesfunnel-alternative-chart-bar-color: @chart-data-color-4-inverted;
-@salesfunnel-alternative-inverted-bar-label-color: @chart-data-color-4;
+@salesfunnel-alternative-inverted-bar-label-color: @salesfunnel-inverted-bar-label-color;