support for custom gradient colors in gauges; fixes #372
Costa Tsaousis committed
May 5, 2016 at 21:29 UTC
c4aa3262bf5932adf74b6513247981ada656ea56
1 file changed
+25
-3
web/dashboard.js
+25
-3
@@ -119,7 +119,7 @@
119
easypiechart_scale: '#dfe0e0',
120
gauge_pointer: '#C0C0C0',
121
gauge_stroke: '#F0F0F0',
122
- gauge_gradient: true
122
+ gauge_gradient: false
123
},
124
slate: {
125
bootstrap_css: NETDATA.serverDefault + 'css/bootstrap.slate.min.css',
@@ -5041,11 +5041,33 @@
5041
colorStop: stopColor, // just experiment with them
5042
strokeColor: strokeColor, // to see which ones work best for you
5043
limitMax: true,
5044
- generateGradient: generateGradient,
5044
+ generateGradient: (generateGradient === true)?true:false,
5045
gradientType: 0
5046
};
5047
5048
- if(generateGradient === false && NETDATA.themes.current.gauge_gradient === true) {
5048
+ if (generateGradient.constructor === Array) {
5049
+ // example options:
5050
+ // data-gauge-generate-gradient="[0, 50, 100]"
5051
+ // data-gauge-gradient-percent-color-0="#FFFFFF"
5052
+ // data-gauge-gradient-percent-color-50="#999900"
5053
+ // data-gauge-gradient-percent-color-100="#000000"
5054
+
5055
+ options.percentColors = new Array();
5056
+ var len = generateGradient.length;
5057
+ while(len--) {
5058
+ var pcent = generateGradient[len];
5059
+ var color = self.data('gauge-gradient-percent-color-' + pcent.toString()) || false;
5060
+ if(color !== false) {
5061
+ var a = new Array();
5062
+ a[0] = pcent / 100;
5063
+ a[1] = color;
5064
+ options.percentColors.unshift(a);
5065
+ }
5066
+ }
5067
+ if(options.percentColors.length === 0)
5068
+ delete options.percentColors;
5069
+ }
5070
+ else if(generateGradient === false && NETDATA.themes.current.gauge_gradient === true) {
5071
options.percentColors = [
5072
[0.0, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 0))],
5073
[0.1, NETDATA.colorLuminance(startColor, (lum_d * 10) - (lum_d * 1))],