#6732

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="chartdiv1" style="width:100%; height:220px;"></div>

CSS

#chartdiv {
	width		: 100%;
	height		: 500px;
	font-size	: 11px;
}

JavaScript

var chart = AmCharts.makeChart("chartdiv1", {
    "type": "serial",
    "theme": "none",
    "autoMargins": false,
    "marginTop": 30,
    "marginLeft": 80,
    "marginBottom": 30,
    "marginRight": 50,
    "dataProvider": [{
        "category": "Evaluation",
        "excelent": 20,
        "good": 20,
        "average": 20,
        "poor": 20,
        "bad": 20,
        "limit": 78,
        "full": 100,
        "bullet": 65
    }],
    "valueAxes": [{
        "maximum": 100,
        "stackType": "regular",
        "gridAlpha": 0
    }],
    "startDuration": 1,
    "graphs": [{
        "columnWidth": 0.5,
        "lineColor": "#000000",
        "lineThickness": 3,
        "noStepRisers": true,
        "stackable": false,
        "type": "step",
        "showAllValueLabels": true,
        "color": "#fff",
        "labelText": "[[value]]",
        "labelPosition": "right",

        "valueField": "limit"
    }, {
        "fillAlphas": 0.8,
        "lineColor": "#19d228",
        "showBalloon": false,
        "type": "column",
        "valueField": "excelent"
    }, {
        "fillAlphas": 0.8,
        "lineColor": "#b4dd1e",
        "showBalloon": false,
        "type": "column",
        "valueField": "good"
    }, {
        "fillAlphas": 0.8,
        "lineColor": "#f4fb16",
        "showBalloon": false,
        "type": "column",
        "valueField": "average"
    }, {
        "fillAlphas": 0.8,
        "lineColor": "#f6d32b",
        "showBalloon": false,
        "type": "column",
        "valueField": "poor"
    }, {
        "fillAlphas": 0.8,
        "lineColor": "#fb7116",
        "showBalloon": false,
        "type": "column",
        "valueField": "bad"
    }, {
        "clustered": false,
        "columnWidth": 0.3,
        "fillAlphas": 1,
        "lineColor": "#000000",
        "stackable": false,
        "type": "column",
        "valueField": "bullet"
    }],
    "rotate": true,
    "columnWidth": 1,
    "categoryField": "category",
    "categoryAxis":...