<div class="text-center">
	<canvas id="barCharts" width="445" height="245" style="display: block;"></canvas>
</div>		
{{#extend 'scripts'}}
<script type="text/javascript">
	new Chart(document.getElementById("barCharts"), {
		type: 'bar',
		data: {
			labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
			datasets: [
				{
					label: 'Series A',
					backgroundColor: '#ff3739',
					data: [40, 35, 60, 70, 20, 35, 40]
				}
			]
		},
		options: {
			responsive:true,
			maintainAspectRatio: false,
			maxBarThickness: 0,
         legend: {
            display: true
         },
         scales: {
            xAxes: [{
               gridLines: {
                  display: false,
               },
               barPercentage: 0.4,
            }],
            yAxes: [{
					ticks: {
						beginAtZero: true
					},
               gridLines: {
                  drawBorder: false
               }
            }]
         }
      }
	});
</script>
{{/extend}}