added initial files

romansavrulin · Feb 19, 2012 · ae6548a · ae6548a
1 parent 514d5e6
commit ae6548a
Showing 1 changed file with 104 additions and 0 deletions.
diff --git a/www/Highstock-1.0.2/examples/candlestick-and-volume/index.htm b/www/Highstock-1.0.2/examples/candlestick-and-volume/index.htm
@@ -0,0 +1,104 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<title>Highstock Example</title>
+
+		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
+		<script type="text/javascript">
+		$(function() {
+			$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-ohlcv.json&callback=?', function(data) {
+
+				// split the data set into ohlc and volume
+				var ohlc = [],
+					volume = [],
+					dataLength = data.length;
+
+				for (i = 0; i < dataLength; i++) {
+					ohlc.push([
+						data[i][0], // the date
+						data[i][1], // open
+						data[i][2], // high
+						data[i][3], // low
+						data[i][4] // close
+					]);
+
+					volume.push([
+						data[i][0], // the date
+						data[i][5] // the volume
+					])
+				}
+
+				// set the allowed units for data grouping
+				var groupingUnits = [[
+					'week',                         // unit name
+					[1]                             // allowed multiples
+				], [
+					'month',
+					[1, 2, 3, 4, 6]
+				]];
+
+				// create the chart
+				chart = new Highcharts.StockChart({
+				    chart: {
+				        renderTo: 'container',
+				        alignTicks: false
+				    },
+
+				    rangeSelector: {
+				        selected: 1
+				    },
+
+				    title: {
+				        text: 'AAPL Historical'
+				    },
+
+				    xAxis: {
+				        maxZoom: 14 * 24 * 3600000,
+				    },
+				    yAxis: [{
+				        title: {
+				            text: 'OHLC'
+				        },
+				        height: 200,
+				        lineWidth: 2
+				    }, {
+				        title: {
+				            text: 'Volume'
+				        },
+				        top: 300,
+				        height: 100,
+				        offset: 0,
+				        lineWidth: 2
+				    }],
+
+				    series: [{
+				        type: 'candlestick',
+				        name: 'AAPL',
+				        data: ohlc,
+				        dataGrouping: {
+							units: groupingUnits
+				        }
+				    }, {
+				        type: 'column',
+				        name: 'Volume',
+				        data: volume,
+				        yAxis: 1,
+				        dataGrouping: {
+							units: groupingUnits
+				        }
+				    }]
+				});
+			});
+		});
+		</script>
+
+	</head>
+	<body>
+
+		<script type="text/javascript" src="../../js/highstock.js"></script>
+		<script type="text/javascript" src="../../js/modules/exporting.js"></script>
+
+		<div id="container" style="height: 500px; min-width: 500px"></div>		
+	</body>
+</html>