diff options
author | Jose Ivan Vargas <jvargas@gitlab.com> | 2017-09-02 00:28:23 +0300 |
---|---|---|
committer | Jose Ivan Vargas <jvargas@gitlab.com> | 2017-09-07 17:19:12 +0300 |
commit | 057e84d6e3997033584339c5c7df1d2278af8ebd (patch) | |
tree | 63fb4a96a9d6e05cc52b2d544bbdd3d6b1815496 /app/assets/javascripts/monitoring | |
parent | 0357726d29b51e6593509850c17c01e9c18fa55b (diff) |
Renamed some components
Diffstat (limited to 'app/assets/javascripts/monitoring')
-rw-r--r-- | app/assets/javascripts/monitoring/components/graph.vue | 8 | ||||
-rw-r--r-- | app/assets/javascripts/monitoring/components/graph_path.vue (renamed from app/assets/javascripts/monitoring/components/monitoring_paths.vue) | 0 | ||||
-rw-r--r-- | app/assets/javascripts/monitoring/utils/multiple_time_series.js | 31 |
3 files changed, 9 insertions, 30 deletions
diff --git a/app/assets/javascripts/monitoring/components/graph.vue b/app/assets/javascripts/monitoring/components/graph.vue index cde2ff7ca2a..11bbeb9392b 100644 --- a/app/assets/javascripts/monitoring/components/graph.vue +++ b/app/assets/javascripts/monitoring/components/graph.vue @@ -3,7 +3,7 @@ import GraphLegend from './graph/legend.vue'; import GraphFlag from './graph/flag.vue'; import GraphDeployment from './graph/deployment.vue'; - import monitoringPaths from './monitoring_paths.vue'; + import GraphPath from './graph_path.vue'; import MonitoringMixin from '../mixins/monitoring_mixins'; import eventHub from '../event_hub'; import measurements from '../utils/measurements'; @@ -63,7 +63,7 @@ GraphLegend, GraphFlag, GraphDeployment, - monitoringPaths, + GraphPath, }, computed: { @@ -238,7 +238,7 @@ class="graph-data" :viewBox="innerViewBox" ref="graphData"> - <monitoring-paths + <graph-path v-for="(path, index) in timeSeries" :key="index" :generated-line-path="path.linePath" @@ -246,7 +246,7 @@ :line-color="path.lineColor" :area-color="path.areaColor" /> - <monitoring-deployment + <graph-deployment :show-deploy-info="showDeployInfo" :deployment-data="reducedDeploymentData" :graph-height="graphHeight" diff --git a/app/assets/javascripts/monitoring/components/monitoring_paths.vue b/app/assets/javascripts/monitoring/components/graph_path.vue index 043f1bf66bb..043f1bf66bb 100644 --- a/app/assets/javascripts/monitoring/components/monitoring_paths.vue +++ b/app/assets/javascripts/monitoring/components/graph_path.vue diff --git a/app/assets/javascripts/monitoring/utils/multiple_time_series.js b/app/assets/javascripts/monitoring/utils/multiple_time_series.js index 05d551e917c..c47da3daf80 100644 --- a/app/assets/javascripts/monitoring/utils/multiple_time_series.js +++ b/app/assets/javascripts/monitoring/utils/multiple_time_series.js @@ -15,6 +15,9 @@ export default function createTimeSeries(seriesData, graphWidth, graphHeight, gr let timeSeriesNumber = 1; let lineColor = '#1f78d1'; let areaColor = '#8fbce8'; + const lineColors = ['#1f78d1', '#fc9403', '#db3b21', '#1aaa55', '#6666c4']; + const areaColors = ['#8fbce8', '#feca81', '#ed9d90', '#8dd5aa', '#d1d1f0']; + return seriesData.map((timeSeries) => { const timeSeriesScaleX = d3.time.scale() .range([0, graphWidth - 70]); @@ -35,32 +38,8 @@ 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; - } + lineColor = lineColors[timeSeriesNumber - 1]; + areaColor = areaColors[timeSeriesNumber - 1]; if (timeSeriesNumber <= 5) { timeSeriesNumber = timeSeriesNumber += 1; |