#7703
by amcharts
HTML
<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="chartdiv"></div>
CSS
#chartdiv {
width : 100%;
height : 100px;
font-size : 11px;
}
JavaScript
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"theme": "none",
"dataProvider": [{
"5min": 5,
"5minlabel": 3,
"15min": 15,
"15minlabel": 18,
"30min": 30,
"30minlabel": 7,
"rest": 5,
"restlabel": 2,
"category": "Work Request"
}],
"valueAxes": [{
"stackType": "regular",
"axisAlpha": 0,
"gridAlpha": 0,
"position": "top",
"maximum": 55,
"labelsEnabled": false
}],
"graphs": [{
"balloonText": "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[5minlabel]]</b></span>",
"fillAlphas": 1,
"labelText": "[[5minlabel]]",
"type": "column",
"color": "#000000",
"lineColor": "#3c6c9d",
"fillColors": "#3c6c9d",
"title": "5 min",
"valueField": "5min",
"showHandOnHover": true
}, {
"balloonText": "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[15minlabel]]</b></span>",
"fillAlphas": 1,
"labelText": "[[15minlabel]]",
"type": "column",
"color": "#000000",
"lineColor": "#3c6c9d",
"fillColors": "#3c6c9d",
"title": "15 min",
"valueField": "15min",
"showHandOnHover": true
}, {
"balloonText": "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[30minlabel]]</b></span>",
"fillAlphas": 1,
"labelText": "[[30minlabel]]",
"type": "column",
"color": "#000000",
"lineColor": "#3c6c9d",
"fillColors": "#3c6c9d",
"title": "30 min",
"valueField": "30min",
"showHandOnHover": true
}, {
"balloonText": "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[restlabel]]</b></span>",
"fillAlphas": 1,
"labelText": "[[restlabel]]",
"type": "column",
"color": "#000000",
"lineColor": "#ed1c24",
"fillColors":...