var $CHART$_1 = [];
var $CHART$_2 = [];
var $CHART$_3 = [];
var $CHART$_4 = [];

generateChartData();

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

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

		var a1 = Math.round( Math.random() * ( 40 + i ) ) + 100 + i;
		var b1 = Math.round( Math.random() * ( 1000 + i ) ) + 500 + i * 2;

		var a2 = Math.round( Math.random() * ( 100 + i ) ) + 200 + i;
		var b2 = Math.round( Math.random() * ( 1000 + i ) ) + 600 + i * 2;

		var a3 = Math.round( Math.random() * ( 100 + i ) ) + 200;
		var b3 = Math.round( Math.random() * ( 1000 + i ) ) + 600 + i * 2;

		var a4 = Math.round( Math.random() * ( 100 + i ) ) + 200 + i;
		var b4 = Math.round( Math.random() * ( 100 + i ) ) + 600 + i;

		$CHART$_1.push( {
			date: newDate,
			value: a1,
			volume: b1
		} );
		$CHART$_2.push( {
			date: newDate,
			value: a2,
			volume: b2
		} );
		$CHART$_3.push( {
			date: newDate,
			value: a3,
			volume: b3
		} );
		$CHART$_4.push( {
			date: newDate,
			value: a4,
			volume: b4
		} );
	}
}

AmCharts.makeChart( "$CHART$", {
	type: "stock",

	dataSets: [ {
			title: "first data set",
			fieldMappings: [ {
				fromField: "value",
				toField: "value"
			}, {
				fromField: "volume",
				toField: "volume"
			} ],
			dataProvider: $CHART$_1,
			categoryField: "date"
		},

		{
			title: "second data set",
			fieldMappings: [ {
				fromField: "value",
				toField: "value"
			}, {
				fromField: "volume",
				toField: "volume"
			} ],
			dataProvider: $CHART$_2,
			categoryField: "date"
		},

		{
			title: "third data set",
			fieldMappings: [ {
				fromField: "value",
				toField: "value"
			}, {
				fromField: "volume",
				toField: "volume"
			} ],
			dataProvider: $CHART$_3,
			categoryField: "date"
		},

		{
			title: "fourth data set",
			fieldMappings: [ {
				fromField: "value",
				toField: "value"
			}, {
				fromField: "volume",
				toField: "volume"
			} ],
			dataProvider: $CHART$_4,
			categoryField: "date"
		}
	],

	panels: [ {

			showCategoryAxis: false,
			title: "Value",
			percentHeight: 70,

			stockGraphs: [ {
				id: "g1",

				valueField: "value",
				comparable: true,
				compareField: "value",
				balloonText: "[[title]]:<b>[[value]]</b>",
				compareGraphBalloonText: "[[title]]:<b>[[value]]</b>"
			} ],

			stockLegend: {
				periodValueTextComparing: "[[percents.value.close]]%",
				periodValueTextRegular: "[[value.close]]"
			}
		},

		{
			title: "Volume",
			percentHeight: 30,
			stockGraphs: [ {
				valueField: "volume",
				type: "column",
				showBalloon: false,
				fillAlphas: 1
			} ],


			stockLegend: {
				periodValueTextRegular: "[[value.close]]"
			}
		}
	],

	chartScrollbarSettings: {
		graph: "g1"
	},

	chartCursorSettings: {
		valueBalloonsEnabled: true
	},

	periodSelector: {
		position: "left",
		periods: [ {
			period: "MM",
			selected: true,
			count: 1,
			label: "1 month"
		}, {
			period: "YYYY",
			count: 1,
			label: "1 year"
		}, {
			period: "YTD",
			label: "YTD"
		}, {
			period: "MAX",
			label: "MAX"
		} ]
	},

	dataSetSelector: {
		position: "left"
	}
} );