gest366/modules/articoli/edit_grafico.php

104 lines
5.0 KiB
PHP

<div class="box-body">
<div class="row">
<div class="col-md-12">
<div class="box">
<div class="box-header with-border">
<h3 class="box-title">Statistiche <?php echo date('Y');?></h3>
<div class="box-tools pull-right">
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div>
<div class="box-body">
<div class="row">
<div class="col-md-12">
<p class="text-center">
<strong>Scarico e Carico <?php echo date('Y');?></strong>
</p>
<div class="chart">
<canvas id="barChart" style="height:200px"></canvas>
</div>
</div>
</div>
</div>
<div class="box-footer">
</div>
</div>
</div>
</div>
</div>
<script src="plugins/chartjs/Chart.min.js"></script>
<script>
$(function () {
var areaChartData = {
labels: ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio","Agosto","Settembre","Ottobre","Novembre","Dicembre"],
datasets: [
{
label: "Acquisti",
fillColor: "rgba(210, 214, 222, 1)",
strokeColor: "rgba(210, 214, 222, 1)",
pointColor: "rgba(210, 214, 222, 1)",
pointStrokeColor: "#c1c7d1",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: [<?php echo sum_purchases_month(1,$records[0]['id']);?>, <?php echo sum_purchases_month(2,$records[0]['id']);?>, <?php echo sum_purchases_month(3,$records[0]['id']);?>,
<?php echo sum_purchases_month(4,$records[0]['id']);?>, <?php echo sum_purchases_month(5,$records[0]['id']);?>, <?php echo sum_purchases_month(6,$records[0]['id']);?>,
<?php echo sum_purchases_month(7,$records[0]['id']);?>,<?php echo sum_purchases_month(8,$records[0]['id']);?>,<?php echo sum_purchases_month(9,$records[0]['id']);?>,
<?php echo sum_purchases_month(10,$records[0]['id']);?>,<?php echo sum_purchases_month(11,$records[0]['id']);?>,<?php echo sum_purchases_month(12,$records[0]['id']);?>]
},
{
label: "Vendite",
fillColor: "rgba(60,141,188,0.9)",
strokeColor: "rgba(60,141,188,0.8)",
pointColor: "#3b8bba",
pointStrokeColor: "rgba(60,141,188,1)",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(60,141,188,1)",
data: [<?php echo sum_sales_month(1,$records[0]['id']);?>, <?php echo sum_sales_month(2,$records[0]['id']);?>, <?php echo sum_sales_month(3,$records[0]['id']);?>,
<?php echo sum_sales_month(4,$records[0]['id']);?>, <?php echo sum_sales_month(5,$records[0]['id']);?>, <?php echo sum_sales_month(6,$records[0]['id']);?>,
<?php echo sum_sales_month(7,$records[0]['id']);?>,<?php echo sum_sales_month(8,$records[0]['id']);?>,<?php echo sum_sales_month(9,$records[0]['id']);?>,
<?php echo sum_sales_month(10,$records[0]['id']);?>,<?php echo sum_sales_month(11,$records[0]['id']);?>,<?php echo sum_sales_month(12,$records[0]['id']);?>]
}
]
};
//-------------
//- BAR CHART -
//-------------
var barChartCanvas = $("#barChart").get(0).getContext("2d");
var barChart = new Chart(barChartCanvas);
var barChartData = areaChartData;
barChartData.datasets[1].fillColor = "#00a65a";
barChartData.datasets[1].strokeColor = "#00a65a";
barChartData.datasets[1].pointColor = "#00a65a";
var barChartOptions = {
scaleBeginAtZero: true,
scaleShowGridLines: true,
scaleGridLineColor: "rgba(0,0,0,.05)",
scaleGridLineWidth: 1,
scaleShowHorizontalLines: true,
scaleShowVerticalLines: true,
barShowStroke: true,
barStrokeWidth: 2,
barValueSpacing: 5,
barDatasetSpacing: 1,
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].fillColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>",
//Boolean - whether to make the chart responsive
responsive: true,
maintainAspectRatio: true
};
barChartOptions.datasetFill = false;
barChart.Bar(barChartData, barChartOptions);
});
</script>