chart.js - custom bar
HTML
<script src="http://www.chartjs.org/assets/Chart.min.js"></script>
<div style="width:90%">
<canvas id="canvas" height="450" width="700"></canvas>
</div>
JavaScript
var random = function(){ return Math.round(Math.random()*95)};
var barChartData = {
labels : ["January","February","March","April","May","June","July"],
datasets : [
{
fillColor : "#0088ff",
strokeColor : "rgba(0,0,0,0)",
highlightFill: "#0070ff",
data: [random(), random(), random(), random(), random(), random(), random()]
}
]
}
var opt = {
responsive:true,
animation: false,
showScale: true,
scaleShowGridLines : false,
barShowStroke: false,
tooltipXPadding: 10,
tooltipYPadding: 6,
tooltipFontSize: 18,
tooltipFontStyle: 'bold',
};
var ctx = document.getElementById("canvas").getContext("2d");
window.myBar = new Chart(ctx).Bar(barChartData, opt);