amcharts Line with reversed value axis
HTML
<script src="http://www.amcharts.com/lib/amcharts.js" type="text/javascript"></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.marginRight = 0;
chart.autoMarginOffset = 5;
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 = 10;
// valueAxis.integersOnly = true;
// valueAxis.gridCount = 10;
valueAxis.reversed = true; // this line makes the value axis reversed
chart.addValueAxis(valueAxis);
// GRAPHS
// Italy graph
var graph = new AmCharts.AmGraph();
graph.title = "Italy";
graph.valueField = "italy";
// graph.hidden = true; // this line makes the graph initially hidden
graph.balloonText = "place taken by Italy in [[category]]: [[value]]";
...