V3: Line with logarithmic 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 = [
{
"date": "2012-03-01",
"price": 20
},
{
"date": "2012-03-02",
"price": 75
},
{
"date": "2012-03-03",
"price": 15
},
{
"date": "2012-03-04",
"price": 75
},
{
"date": "2012-03-05",
"price": 158
},
{
"date": "2012-03-06",
"price": 57
},
{
"date": "2012-03-07",
"price": 107
},
{
"date": "2012-03-08",
"price": 89
},
{
"date": "2012-03-09",
"price": 75
},
{
"date": "2012-03-10",
"price": 132
},
{
"date": "2012-03-11",
"price": 158
},
{
"date": "2012-03-12",
"price": 56
},
{
"date": "2012-03-13",
"price": 169
},
{
"date": "2012-03-14",
"price": 24
},
{
"date": "2012-03-15",
"price": 147
}
];
var average = 90.4;
AmCharts.ready(function () {
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.pathToImages = "http://www.amcharts.com/lib/3/images/";
chart.dataProvider = chartData;
chart.categoryField = "date";
chart.dataDateFormat = "YYYY-MM-DD";
// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.parseDates = true; // as our data is date-based, we set parseDates to true
categoryAxis.minPeriod = "DD"; // our data is daily, so we set minPeriod to DD
categoryAxis.dashLength = 1;
categoryAxis.gridAlpha = 0.15;
categoryAxis.axisColor = "#DADADA";
// value
var valueAxis = new AmCharts.ValueAxis();
valueAxis.axisColor = "#DADADA";
valueAxis.dashLength = 1;
valueAxis.logarithmic = true; // this line makes axis logarithmic
chart.addValueAxis(valueAxis);
// GUIDE for average
var guide = new AmCharts.Guide();
guide.value = average;
...