Horizontal funnel chart with regular serial chart
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 : 500px;
}
JavaScript
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"theme": "none",
"dataProvider": [{
"category": "Sessions",
"value": 896079,
"value2": -896079,
"color": "#a8c81f"
},{
"category": "Clicks",
"value": 670080,
"value2": -670080,
"color": "#118acb"
}, {
"category": "Add to cart",
"value": 266712,
"value2": -266712,
"color": "#40b4a6"
}, {
"category": "Purchase",
"value": 136498,
"value2": -136498,
"color": "#008d36"
}, {
"category": "Purchase",
"value": 50000,
"value2": -50000,
"color": "#008d36"
}],
"valueAxes": [{
"axisAlpha": 0,
"labelsEnabled": false,
"gridAlpha": 0
}],
"graphs": [{
"id": "fromGraph",
"lineAlpha": 0,
"showBalloon": false,
"valueField": "value2",
"fillAlphas": 0
}, {
"fillAlphas": 1,
"fillToGraph": "fromGraph",
"lineAlpha": 0,
"lineColorField": "color",
"fillColorsField": "color",
"showBalloon": false,
"valueField": "value"
}],
"categoryField": "category",
"categoryAxis": {
"startOnAxis": true,
"axisAlpha": 0.1,
"gridPosition": "left",
"gridAlpha": 0.1,
"tickLength": 20,
"tickPosition": "start",
"showLastLabel": false
}
});