Subversion-Projekte lars-tiefland.cienc

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
9 lars 1
<!DOCTYPE HTML>
2
<html>
3
	<head>
4
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5
		<title>Highcharts 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
    $(document).ready(function () {
14
        Highcharts.setOptions({
15
            global: {
16
                useUTC: false
17
            }
18
        });
19
 
20
        $('#container').highcharts({
21
            chart: {
22
                type: 'spline',
23
                animation: Highcharts.svg, // don't animate in old IE
24
                marginRight: 10,
25
                events: {
26
                    load: function () {
27
 
28
                        // set up the updating of the chart each second
29
                        var series = this.series[0];
30
                        setInterval(function () {
31
                            var x = (new Date()).getTime(), // current time
32
                                y = Math.random();
33
                            series.addPoint([x, y], true, true);
34
                        }, 1000);
35
                    }
36
                }
37
            },
38
            title: {
39
                text: 'Live random data'
40
            },
41
            xAxis: {
42
                type: 'datetime',
43
                tickPixelInterval: 150
44
            },
45
            yAxis: {
46
                title: {
47
                    text: 'Value'
48
                },
49
                plotLines: [{
50
                    value: 0,
51
                    width: 1,
52
                    color: '#808080'
53
                }]
54
            },
55
            tooltip: {
56
                formatter: function () {
57
                    return '<b>' + this.series.name + '</b><br/>' +
58
                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
59
                        Highcharts.numberFormat(this.y, 2);
60
                }
61
            },
62
            legend: {
63
                enabled: false
64
            },
65
            exporting: {
66
                enabled: false
67
            },
68
            series: [{
69
                name: 'Random data',
70
                data: (function () {
71
                    // generate an array of random data
72
                    var data = [],
73
                        time = (new Date()).getTime(),
74
                        i;
75
 
76
                    for (i = -19; i <= 0; i += 1) {
77
                        data.push({
78
                            x: time + i * 1000,
79
                            y: Math.random()
80
                        });
81
                    }
82
                    return data;
83
                }())
84
            }]
85
        });
86
    });
87
});
88
		</script>
89
	</head>
90
	<body>
91
<script src="../../js/highcharts.js"></script>
92
<script src="../../js/modules/exporting.js"></script>
93
 
94
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
95
 
96
	</body>
97
</html>