#7037

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"></div>

CSS

#chartdiv {
	width	: 100%;
	height	: 500px;
}

JavaScript

function buildChartInv(data) { 
var chart;

AmCharts.ready(function () { 
// SERIAL CHART 
chart = new AmCharts.AmSerialChart(); 
chart.pathToImages = "js/amcharts/images/"; 
chart.dataProvider = data['data']; 
chart.dataDateFormat = "YYYY-MM"; 
chart.categoryField = "invdate"; 


// AXES 
// CAETEGORY 
var categoryAxis = chart.categoryAxis; 
categoryAxis.parseDates = true; // as our data is date-based, we set parseDates to true 
categoryAxis.minPeriod = "MM"; // our data is daily, so we set minPeriod to DD	
categoryAxis.gridAlpha = 0.1; 
categoryAxis.minorGridAlpha = 0.1; 
categoryAxis.axisAlpha = 0; 
categoryAxis.minorGridEnabled = true; 
categoryAxis.inside = true; 

// VALUE 
var valueAxis = new AmCharts.ValueAxis(); 
valueAxis.tickLength = 0; 
valueAxis.axisAlpha = 0; 
valueAxis.showFirstLabel = false; 
valueAxis.showLastLabel = false; 
chart.addValueAxis(valueAxis); 

// GRAPH OPENED 
var graph = new AmCharts.AmGraph(); 
graph.dashLength = 3; 
graph.lineColor = "#ff0000"; 
graph.valueField = "opened"; 
graph.title = "Opened"; 
graph.dashLength = 3; 
graph.bullet = "round"; 
graph.balloonText = "[[category]]<br><b><span style='font-size:14px;'>Opened: [[value]]</span></b>"; 
chart.addGraph(graph); 

// GRAPH CLOSED 
var graph = new AmCharts.AmGraph(); 
graph.dashLength = 3; 
graph.lineColor = "#00ff00"; 
graph.valueField = "closed"; 
graph.title = "Closed"; 
graph.dashLength = 3; 
graph.bullet = "round"; 
graph.balloonText = "[[category]]<br><b><span style='font-size:14px;'>Closed: [[value]]</span></b>"; 
chart.addGraph(graph); 

// GRAPH STOCK 
var graph = new AmCharts.AmGraph(); 
graph.dashLength = 3; 
graph.lineColor = "#1133fd"; 
graph.valueField = "stock"; 
graph.title = "Stock"; 
graph.dashLength = 3; 
graph.bullet = "round"; 
graph.balloonText = "[[category]]<br><b><span style='font-size:14px;'>Stock: [[value]]</span></b>"; 
chart.addGraph(graph);

// GRAPH REOPENED 
var graph = new AmCharts.AmGraph(); 
graph.dashLength = 3; 
graph.lineColor =...