V3: Line with reversed value axis
HTML
<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="http://www.amcharts.com/lib/3/serial.js"></script>
<div id="chartdiv" style="width: 100%; height: 362px;"></div>
JavaScript
var chart;
var chartData = [
{
"year": 1930,
"italy": 1,
"germany": 5,
"uk": 3
},
{
"year": 1934,
"italy": 1,
"germany": 2,
"uk": 6
},
{
"year": 1938,
"italy": 2,
"germany": 3,
"uk": 1
},
{
"year": 1950,
"italy": 3,
"germany": 4,
"uk": 1
},
{
"year": 1954,
"italy": 5,
"germany": 1,
"uk": 2
},
{
"year": 1958,
"italy": 3,
"germany": 2,
"uk": 1
},
{
"year": 1962,
"italy": 1,
"germany": 2,
"uk": 3
},
{
"year": 1966,
"italy": 2,
"germany": 1,
"uk": 5
},
{
"year": 1970,
"italy": 3,
"germany": 5,
"uk": 2
},
{
"year": 1974,
"italy": 4,
"germany": 3,
"uk": 6
},
{
"year": 1978,
"italy": 1,
"germany": 2,
"uk": 4
}
];
AmCharts.ready(function () {
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData;
chart.categoryField = "year";
chart.startDuration = 0.5;
chart.balloon.color = "#000000";
// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.fillAlpha = 1;
categoryAxis.fillColor = "#FAFAFA";
categoryAxis.gridAlpha = 0;
categoryAxis.axisAlpha = 0;
categoryAxis.gridPosition = "start";
categoryAxis.position = "top";
// value
var valueAxis = new AmCharts.ValueAxis();
valueAxis.title = "Place taken";
valueAxis.dashLength = 5;
valueAxis.axisAlpha = 0;
valueAxis.minimum = 1;
valueAxis.maximum = 6;
valueAxis.integersOnly = true;
valueAxis.gridCount = 10;
valueAxis.reversed = true; // this line makes the value axis reversed
valueAxis.title = 'hahaha';
chart.addValueAxis(valueAxis);
...