Stock chart with triangles for events

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>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/amstock.js"></script>
<div id="chartdiv"></div>

CSS

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

JavaScript

var chartData = [];
generateChartData();

function generateChartData() {
	//var firstDate = new Date(2012, 0, 1);
	//firstDate.setDate(firstDate.getDate() - 500);
	//firstDate.setHours(0, 0, 0, 0);

	for (var i = 0; i < 50; i++) {
		//var newDate = new Date(firstDate);
		//newDate.setDate(newDate.getDate() + i);

		var a = Math.round(Math.random() * (40 + i)) + 100 + i;
    //var a = 100;
		//var b = Math.round(Math.random() * 100000000);

		chartData.push({
			x: i,
			value: a,
			//volume: b
		});
	}
}

var chart = AmCharts.makeChart("chartdiv", {
	type: "stock",
    "theme": "none",
    pathToImages: "http://www.amcharts.com/lib/3/images/",
	dataSets: [{
		color: "#b0de09",
		fieldMappings: [{
			fromField: "value",
			toField: "value"
		}, {
			fromField: "volume",
			toField: "volume"
		}],
		dataProvider: chartData,
		categoryField: "x",
		// EVENTS
		
	}],


	panels: [{
		title: "Value",
		percentHeight: 70,

		stockGraphs: [{
			id: "g1",
			valueField: "value"
		}],

		stockLegend: {
			valueTextRegular: " ",
			markerType: "none"
		}
	}],

	chartScrollbarSettings: {
		graph: "g1"
	},

	chartCursorSettings: {
		valueBalloonsEnabled: true,
		graphBulletSize: 1
	},

	periodSelector: {
		periods: [{
			period: "DD",
			count: 10,
			label: "10 days"
		}, {
			period: "MM",
			count: 1,
			label: "1 month"
		}, {
			period: "YYYY",
			count: 1,
			label: "1 year"
		}, {
			period: "YTD",
			label: "YTD"
		}, {
			period: "MAX",
			label: "MAX"
		}]
	},

	panelsSettings: {
		usePrefixes: true
	}
});