From 2b9a64a212e3bcd27c1335b22a857f4df6846254 Mon Sep 17 00:00:00 2001 From: Jason Dai Date: Tue, 8 Aug 2017 12:02:13 +0000 Subject: [PATCH] Fix bar chart does not display label at hour 0 --- .../javascripts/graphs/graphs_charts.js | 32 +++++++++---------- app/views/projects/graphs/charts.html.haml | 6 ++-- ...6-barchart-not-display-label-at-0-hour.yml | 4 +++ 3 files changed, 22 insertions(+), 20 deletions(-) create mode 100644 changelogs/unreleased/35136-barchart-not-display-label-at-0-hour.yml diff --git a/app/assets/javascripts/graphs/graphs_charts.js b/app/assets/javascripts/graphs/graphs_charts.js index 279ffef770f..ec6eab34989 100644 --- a/app/assets/javascripts/graphs/graphs_charts.js +++ b/app/assets/javascripts/graphs/graphs_charts.js @@ -1,4 +1,5 @@ import Chart from 'vendor/Chart'; +import _ from 'underscore'; document.addEventListener('DOMContentLoaded', () => { const projectChartData = JSON.parse(document.getElementById('projectChartData').innerHTML); @@ -27,28 +28,25 @@ document.addEventListener('DOMContentLoaded', () => { return generateChart(); }; - const chartData = (keys, values) => { - const data = { - labels: keys, - datasets: [{ - fillColor: 'rgba(220,220,220,0.5)', - strokeColor: 'rgba(220,220,220,1)', - barStrokeWidth: 1, - barValueSpacing: 1, - barDatasetSpacing: 1, - data: values, - }], - }; - return data; - }; + const chartData = data => ({ + labels: Object.keys(data), + datasets: [{ + fillColor: 'rgba(220,220,220,0.5)', + strokeColor: 'rgba(220,220,220,1)', + barStrokeWidth: 1, + barValueSpacing: 1, + barDatasetSpacing: 1, + data: _.values(data), + }], + }); - const hourData = chartData(projectChartData.hour.keys, projectChartData.hour.values); + const hourData = chartData(projectChartData.hour); responsiveChart($('#hour-chart'), hourData); - const dayData = chartData(projectChartData.weekDays.keys, projectChartData.weekDays.values); + const dayData = chartData(projectChartData.weekDays); responsiveChart($('#weekday-chart'), dayData); - const monthData = chartData(projectChartData.month.keys, projectChartData.month.values); + const monthData = chartData(projectChartData.month); responsiveChart($('#month-chart'), monthData); const data = projectChartData.languages; diff --git a/app/views/projects/graphs/charts.html.haml b/app/views/projects/graphs/charts.html.haml index 228c8c84792..9f5a1239a82 100644 --- a/app/views/projects/graphs/charts.html.haml +++ b/app/views/projects/graphs/charts.html.haml @@ -78,8 +78,8 @@ %script#projectChartData{ type: "application/json" } - projectChartData = {}; - - projectChartData['hour'] = { 'keys' => @commits_per_time.keys, 'values' => @commits_per_time.values } - - projectChartData['weekDays'] = { 'keys' => @commits_per_week_days.keys, 'values' => @commits_per_week_days.values } - - projectChartData['month'] = { 'keys' => @commits_per_month.keys, 'values' => @commits_per_month.values } + - projectChartData['hour'] = @commits_per_time + - projectChartData['weekDays'] = @commits_per_week_days + - projectChartData['month'] = @commits_per_month - projectChartData['languages'] = @languages = projectChartData.to_json.html_safe diff --git a/changelogs/unreleased/35136-barchart-not-display-label-at-0-hour.yml b/changelogs/unreleased/35136-barchart-not-display-label-at-0-hour.yml new file mode 100644 index 00000000000..ea8f31cca9d --- /dev/null +++ b/changelogs/unreleased/35136-barchart-not-display-label-at-0-hour.yml @@ -0,0 +1,4 @@ +--- +title: Fix bar chart does not display label at 0 hour +merge_request: 35136 +author: Jason Dai