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
 
14
    $('#container').highcharts({
15
 
16
        chart: {
17
            type: 'columnrange',
18
            inverted: true
19
        },
20
 
21
        title: {
22
            text: 'Temperature variation by month'
23
        },
24
 
25
        subtitle: {
26
            text: 'Observed in Vik i Sogn, Norway'
27
        },
28
 
29
        xAxis: {
30
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
31
        },
32
 
33
        yAxis: {
34
            title: {
35
                text: 'Temperature ( °C )'
36
            }
37
        },
38
 
39
        tooltip: {
40
            valueSuffix: '°C'
41
        },
42
 
43
        plotOptions: {
44
            columnrange: {
45
                dataLabels: {
46
                    enabled: true,
47
                    formatter: function () {
48
                        return this.y + '°C';
49
                    }
50
                }
51
            }
52
        },
53
 
54
        legend: {
55
            enabled: false
56
        },
57
 
58
        series: [{
59
            name: 'Temperatures',
60
            data: [
61
                [-9.7, 9.4],
62
                [-8.7, 6.5],
63
                [-3.5, 9.4],
64
                [-1.4, 19.9],
65
                [0.0, 22.6],
66
                [2.9, 29.5],
67
                [9.2, 30.7],
68
                [7.3, 26.5],
69
                [4.4, 18.0],
70
                [-3.1, 11.4],
71
                [-5.2, 10.4],
72
                [-13.5, 9.8]
73
            ]
74
        }]
75
 
76
    });
77
 
78
});
79
		</script>
80
	</head>
81
	<body>
82
<script src="../../js/highcharts.js"></script>
83
<script src="../../js/highcharts-more.js"></script>
84
<script src="../../js/modules/exporting.js"></script>
85
 
86
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
87
 
88
	</body>
89
</html>