48 lines
1.4 KiB
XML
48 lines
1.4 KiB
XML
<metal:block use-macro="main_template">
|
|
<div metal:fill-slot="content">
|
|
|
|
<div class="row">
|
|
<h2>Répartition des modes de règlement</h2>
|
|
<div class="col-md-6">
|
|
<!-- graphique donut année N-1 -->
|
|
<div id="donutchart_annee_1" style="width: 100%; height: 500px;"></div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<!-- graphique donut année N -->
|
|
<div id="donutchart_annee" style="width: 100%; height: 500px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
|
|
<script type="text/javascript">
|
|
google.charts.load("current", {packages:["corechart", 'bar']});
|
|
google.charts.setOnLoadCallback(drawChart);
|
|
var dataSet_annee_1 = ${donut_annee_1};
|
|
var dataSet_annee = ${donut_annee};
|
|
|
|
function drawChart() {
|
|
var data_annee_1 = google.visualization.arrayToDataTable(dataSet_annee_1);
|
|
var data_annee = google.visualization.arrayToDataTable(dataSet_annee);
|
|
|
|
var options_annee_1 = {
|
|
title: '${title_1}',
|
|
pieHole: 0.4,
|
|
};
|
|
var options_annee = {
|
|
title: '${title}',
|
|
pieHole: 0.4,
|
|
};
|
|
|
|
var chart_annee_1 = new google.visualization.PieChart(document.getElementById('donutchart_annee_1'));
|
|
chart_annee_1.draw(data_annee_1, options_annee_1);
|
|
var chart_annee = new google.visualization.PieChart(document.getElementById('donutchart_annee'));
|
|
chart_annee.draw(data_annee, options_annee);
|
|
}
|
|
</script>
|
|
|
|
</div><!-- content -->
|
|
</metal:block>
|
|
|
|
|