meineerde/redmine
1
0
Fork 0
mirror of https://github.com/meineerde/redmine.git synced 2025-12-19 15:01:14 +00:00
Code Issues Releases Wiki Activity

Stacked bar charts in the issue details report (#31418).

Browse Source 
Patch by Takenori TAKAKI.


git-svn-id: http://svn.redmine.org/redmine/trunk@18200 e93f8b46-1217-0410-a6f0-8f06a7374b81
This commit is contained in:
Go MAEDA 2019-05-26 00:01:03 +00:00
parent 97f05de373
commit f38db92cae
2 changed files with 52 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
app/views/reports/_details.html.erb
View File

@ -25,4 +25,55 @@
<% end %>
</tbody>
</table>
<div class="issue-report-graph">
<canvas id="issues_by_<%= params[:detail] %>"></canvas>
</div>
<div class="issue-report-graph">
<canvas id="issues_by_status"></canvas>
</div>
<%= javascript_tag do %>
function renderChart(canvas_id, title, chartData){
var backgroundColors = ['rgba(255, 99, 132, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(255, 206, 86, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(153, 102, 255, 0.2)', 'rgba(255, 159, 64, 0.2)'];
var borderColors = ['rgba(255, 99, 132, 1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)'];
for (var i = 0; i < chartData.datasets.length; i++) {
chartData.datasets[i].backgroundColor = backgroundColors[i % backgroundColors.length];
chartData.datasets[i].borderColor = borderColors[i % borderColors.length];
chartData.datasets[i].borderWidth = 1;
}
new Chart($(canvas_id), {
type: 'horizontalBar',
data: chartData,
options: {
elements: {
rectangle: {borderWidth: 2}
},
responsive: true,
legend: {position: 'right'},
title: {
display: true,
text: title
},
scales: {
yAxes: [{ stacked: true }],
xAxes: [{ stacked: true }]
}
}
});
}
$(document).ready(function(){
var chartData1 = {
labels: <%= raw rows.collect{|row| row.name}.to_json %>,
datasets: <%= raw @statuses.collect{|status| {"label" => status.name, "data" => rows.collect{|row| aggregate(data, {field_name => row.id, "status_id" => status.id})}}}.to_json %>
};
var chartData2 = {
labels: <%= raw @statuses.collect{|status| status.name}.to_json %>,
datasets: <%= raw rows.collect{|row| {"label" => row.name, "data" => @statuses.collect{|status| aggregate(data, {field_name => row.id, "status_id" => status.id})}}}.to_json %>
};
renderChart("#issues_by_<%= params[:detail] %>", "<%= l(:label_issues_by, @report_title) %>", chartData1);
renderChart("#issues_by_status", "<%= l(:label_issues_by, l(:field_status)) %>", chartData2);
});
<% end %>
<% content_for :header_tags do %>
<%= javascript_include_tag "Chart.bundle.min" %>
<% end %>
<% end %>

1
public/stylesheets/application.css
View File

@ -277,6 +277,7 @@ tr.issue.idnt-8 td.subject {padding-left: 136px; background-position: 120px 50%;
tr.issue.idnt-9 td.subject {padding-left: 152px; background-position: 136px 50%;}
table.issue-report {table-layout:fixed;}
.issue-report-graph {width: 75%; margin: 2em 0;}
tr.entry { border: 1px solid #f8f8f8; }
tr.entry td { white-space: nowrap; }