diff options
author | Jose Ivan Vargas <jvargas@gitlab.com> | 2017-08-30 22:07:50 -0500 |
---|---|---|
committer | Jose Ivan Vargas <jvargas@gitlab.com> | 2017-08-31 16:31:19 -0500 |
commit | 05a77e79b825df04eabc9c95d1ff9725a35a6134 (patch) | |
tree | 51cf4416609b336e862eff0f5a1aa73ade71b462 /app/assets/javascripts/monitoring/utils | |
parent | dd7d691f50827285deaab0276f10c654c4bd8da1 (diff) | |
download | gitlab-ce-05a77e79b825df04eabc9c95d1ff9725a35a6134.tar.gz |
Added simple support for multiple colors on the different time series
Diffstat (limited to 'app/assets/javascripts/monitoring/utils')
-rw-r--r-- | app/assets/javascripts/monitoring/utils/multiple_time_series.js | 38 |
1 files changed, 38 insertions, 0 deletions
diff --git a/app/assets/javascripts/monitoring/utils/multiple_time_series.js b/app/assets/javascripts/monitoring/utils/multiple_time_series.js index 12943239b74..05d551e917c 100644 --- a/app/assets/javascripts/monitoring/utils/multiple_time_series.js +++ b/app/assets/javascripts/monitoring/utils/multiple_time_series.js @@ -12,6 +12,9 @@ export default function createTimeSeries(seriesData, graphWidth, graphHeight, gr const maxValueFromSeries = _.max(maxValues, val => val.maxValue); + let timeSeriesNumber = 1; + let lineColor = '#1f78d1'; + let areaColor = '#8fbce8'; return seriesData.map((timeSeries) => { const timeSeriesScaleX = d3.time.scale() .range([0, graphWidth - 70]); @@ -32,11 +35,46 @@ export default function createTimeSeries(seriesData, graphWidth, graphHeight, gr .y1(d => timeSeriesScaleY(d.value)) .interpolate('linear'); + switch (timeSeriesNumber) { + case 1: + lineColor = '#1f78d1'; + areaColor = '#8fbce8'; + break; + case 2: + lineColor = '#fc9403'; + areaColor = '#feca81'; + break; + case 3: + lineColor = '#db3b21'; + areaColor = '#ed9d90'; + break; + case 4: + lineColor = '#1aaa55'; + areaColor = '#8dd5aa'; + break; + case 5: + lineColor = '#6666c4'; + areaColor = '#d1d1f0'; + break; + default: + lineColor = '#1f78d1'; + areaColor = '#8fbce8'; + break; + } + + if (timeSeriesNumber <= 5) { + timeSeriesNumber = timeSeriesNumber += 1; + } else { + timeSeriesNumber = 1; + } + return { linePath: lineFunction(timeSeries.values), areaPath: areaFunction(timeSeries.values), timeSeriesScaleX, values: timeSeries.values, + lineColor, + areaColor, }; }); } |