

function loadDataSets() {
	
	linearData(d1, 20);
	linearData(d2, 20);
	linearData(d3, 35);
}

Event.observe(window, 'load', function(){
//	loadDataSets();
	
	loadPieChart();
	loadMixChart();
	loadBarChart();
});

function loadPieChart()
{
		new Proto.Chart($('piechart'), 
						[
						{ data: d1, label: "d1"},
						{ data: d2, label: "d2"},
						{ data: d3, label: "d3"},
						{ data: d4, label: "d4"},
						{ data: d5, label: "d5"},
						{ data: d6, label: "d6"},
						{ data: d7, label: "d7"}
						], 
						{
							/*
							This is how we tell the Chart engine that we 
							need a pie chart and it ignores all inline options 
							that you might have passed with the datasets.
							*/
							pies: {show: true, autoScale: true},
							legend: {show: true}
						});
}

function loadMixChart() {

	
	/*
	By default the graph i always a line chart. But you can change the whole charting by using either of two methods:
	1. inline options for each dataset
	2. overall options for the whole chart...Remember YOU MUST use this option if you want a group Bar Chart (example 3) or a Pie Chart (example 1)
	*/
	new Proto.Chart($('mixChart'), 
					[
					{ data: d1, label: "Math.sin(x)" }, 
					{ data: d2, label: "Normal", bars: {show: true}},
					{ data: d3, label: "Math.cos(x)", points: {show: true}},
					{ data: d4, label: "Random Function", lines: {fill: true}},
					{ data: d5, label: "Random"}
					],
					{
						legend: {
							show: true,
							noColumns: 2,
							labelFormatter: function(str) { return "<b>"+str+"</b>"},
							labelBoxBorderColor: "#dedede",
							position: "ne",
							backgroundColor: "#eee",
							backgroundOpacity: 0.3
						},
						grid: {
							borderWidth: 2,
							coloredAreas: [{y1: 5, y2:7}, {x1: 5, x2: 7.5}],
							coloredAreasColor: "#FFF2F9",
							drawXAxis: true,
							drawYAxis: true,
							clickable: true
						},
						selection: {
							mode: "xy",
							color: "#A7CAFE"
						},
						xaxis: {
							min: 3,
							max: 13,
							tickSize: 2,	//increments ticks by this
							tickFormatter: function(str) {return "<i>"+str+"</i>";}
						},
						yaxis: {
							min: 0,
							max: 15,
							tickSize: 1,	//increments ticks by this
							tickFormatter: function(str) {return "<i>"+str+"</i>";}
						}
					});	
}

function loadBarChart() {

	
	/*
	By default the graph i always a line chart. But you can change the whole charting by using either of two methods:
	1. inline options for each dataset
	2. overall options for the whole chart...Remember YOU MUST use this option if you want a group Bar Chart (example 3) or a Pie Chart (example 1)
	*/
	new Proto.Chart($('barchart'), 
					[
					{data: d6, label: "Data 1"},
					{data: d6, label: "Data 2"}
					],
					{
						bars: {show: true},
						xaxis: {min: 0, max: 14, tickSize: 1}
						
					});	
}