Subversion-Projekte lars-tiefland.ci

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
875 lars 1 
<!DOCTYPE HTML>
2 
<html>
3 
	<head>
4 
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 
		<title>Highstock Example</title>
6 
 
7 
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
8 
		<style type="text/css">
9 
${demo.css}
10 
		</style>
11 
		<script type="text/javascript">
12 
$(function () {
13 
    /**
14 
     * Load new data depending on the selected min and max
15 
     */
16 
    function afterSetExtremes(e) {
17 
 
18 
        var chart = $('#container').highcharts();
19 
 
20 
        chart.showLoading('Loading data from server...');
21 
        $.getJSON('http://www.highcharts.com/samples/data/from-sql.php?start=' + Math.round(e.min) +
22 
                '&end=' + Math.round(e.max) + '&callback=?', function (data) {
23 
 
24 
                chart.series[0].setData(data);
25 
                chart.hideLoading();
26 
            });
27 
    }
28 
 
29 
    // See source code from the JSONP handler at https://github.com/highslide-software/highcharts.com/blob/master/samples/data/from-sql.php
30 
    $.getJSON('http://www.highcharts.com/samples/data/from-sql.php?callback=?', function (data) {
31 
 
32 
        // Add a null value for the end date
33 
        data = [].concat(data, [[Date.UTC(2011, 9, 14, 19, 59), null, null, null, null]]);
34 
 
35 
        // create the chart
36 
        $('#container').highcharts('StockChart', {
37 
            chart : {
38 
                type: 'candlestick',
39 
                zoomType: 'x'
40 
            },
41 
 
42 
            navigator : {
43 
                adaptToUpdatedData: false,
44 
                series : {
45 
                    data : data
46 
                }
47 
            },
48 
 
49 
            scrollbar: {
50 
                liveRedraw: false
51 
            },
52 
 
53 
            title: {
54 
                text: 'AAPL history by the minute from 1998 to 2011'
55 
            },
56 
 
57 
            subtitle: {
58 
                text: 'Displaying 1.7 million data points in Highcharts Stock by async server loading'
59 
            },
60 
 
61 
            rangeSelector : {
62 
                buttons: [{
63 
                    type: 'hour',
64 
                    count: 1,
65 
                    text: '1h'
66 
                }, {
67 
                    type: 'day',
68 
                    count: 1,
69 
                    text: '1d'
70 
                }, {
71 
                    type: 'month',
72 
                    count: 1,
73 
                    text: '1m'
74 
                }, {
75 
                    type: 'year',
76 
                    count: 1,
77 
                    text: '1y'
78 
                }, {
79 
                    type: 'all',
80 
                    text: 'All'
81 
                }],
82 
                inputEnabled: false, // it supports only days
83 
                selected : 4 // all
84 
            },
85 
 
86 
            xAxis : {
87 
                events : {
88 
                    afterSetExtremes : afterSetExtremes
89 
                },
90 
                minRange: 3600 * 1000 // one hour
91 
            },
92 
 
93 
            yAxis: {
94 
                floor: 0
95 
            },
96 
 
97 
            series : [{
98 
                data : data,
99 
                dataGrouping: {
100 
                    enabled: false
101 
                }
102 
            }]
103 
        });
104 
    });
105 
});
106 
 
107 
		</script>
108 
	</head>
109 
	<body>
110 
<script src="../../js/highstock.js"></script>
111 
<script src="../../js/modules/exporting.js"></script>
112 
 
113 
<div id="container" style="height: 400px; min-width: 310px"></div>
114 
 
115 
 
116 
 
117 
	</body>
118 
</html>