Put labels on top of the marker on bullet chart
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" style="width:100%; height:220px;"></div>
CSS
#chartdiv {
width : 100%;
height : 500px;
font-size : 12px;
}
JavaScript
var chart = AmCharts.makeChart("chartdiv", {
"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": [{
"clustered": false,
"lineAlpha": 0,
"noStepRisers": true,
"stackable": false,
"type": "step",
"valueField": "limit",
"labelText": "[[value]]",
"color": "#000"
}, {
"clustered": false,
"lineColor": "#fff",
"lineThickness": 8,
"noStepRisers": true,
"stackable": false,
"type": "step",
"valueField": "limit",
"openField": "limit"
}, {
"newStack": true,
"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"
}],
"rotate": true,
"columnWidth": 1,
"categoryField": "category",
"categoryAxis": {
"gridAlpha": 0,
"position":...