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
    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function (data) {
14
 
15
        var startDate = new Date(data[data.length - 1][0]),
16
            minRate = 1,
17
            maxRate = 0,
18
            startPeriod = Date.UTC(startDate.getFullYear(), startDate.getMonth(), startDate.getDate()),
19
            date,
20
            rate,
21
            index;
22
        startDate.setMonth(startDate.getMonth() - 3); // a quarter of a year before last data point
23
        for (index = data.length - 1; index >= 0; index = index - 1) {
24
            date = data[index][0]; // data[i][0] is date
25
            rate = data[index][1]; // data[i][1] is exchange rate
26
            if (date < startPeriod) {
27
                break; // stop measuring highs and lows
28
            }
29
            if (rate > maxRate) {
30
                maxRate = rate;
31
            }
32
            if (rate < minRate) {
33
                minRate = rate;
34
            }
35
        }
36
 
37
        // Create the chart
38
        $('#container').highcharts('StockChart', {
39
 
40
            rangeSelector: {
41
                selected: 1
42
            },
43
 
44
            title: {
45
                text: 'USD to EUR exchange rate'
46
            },
47
 
48
            yAxis: {
49
                title: {
50
                    text: 'Exchange rate'
51
                },
52
                plotBands: [{
53
                    from: minRate,
54
                    to: maxRate,
55
                    color: 'rgba(68, 170, 213, 0.2)',
56
                    label: {
57
                        text: 'Last quarter year\'s value range'
58
                    }
59
                }]
60
            },
61
 
62
            series: [{
63
                name: 'USD to EUR',
64
                data: data,
65
                tooltip: {
66
                    valueDecimals: 4
67
                }
68
            }]
69
        });
70
    });
71
});
72
		</script>
73
	</head>
74
	<body>
75
<script src="../../js/highstock.js"></script>
76
<script src="../../js/modules/exporting.js"></script>
77
 
78
 
79
<div id="container" style="height: 400px; min-width: 310px"></div>
80
	</body>
81
</html>