1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
| <!DOCTYPE HTML>
| <html>
| <head>
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
| <title>Highcharts Example</title>
|
| <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
| <script type="text/javascript">
| $(function () {
| $('#container').highcharts({
| chart: {
| type: 'area'
| },
| title: {
| text: 'Historic and Estimated Worldwide Population Growth by Region'
| },
| subtitle: {
| text: 'Source: Wikipedia.org'
| },
| xAxis: {
| categories: ['1750', '1800', '1850', '1900', '1950', '1999', '2050'],
| tickmarkPlacement: 'on',
| title: {
| enabled: false
| }
| },
| yAxis: {
| title: {
| text: 'Billions'
| },
| labels: {
| formatter: function() {
| return this.value / 1000;
| }
| }
| },
| tooltip: {
| shared: true,
| valueSuffix: ' millions'
| },
| plotOptions: {
| area: {
| stacking: 'normal',
| lineColor: '#666666',
| lineWidth: 1,
| marker: {
| lineWidth: 1,
| lineColor: '#666666'
| }
| }
| },
| series: [{
| name: 'Asia',
| data: [502, 635, 809, 947, 1402, 3634, 5268]
| }, {
| name: 'Africa',
| data: [106, 107, 111, 133, 221, 767, 1766]
| }, {
| name: 'Europe',
| data: [163, 203, 276, 408, 547, 729, 628]
| }, {
| name: 'America',
| data: [18, 31, 54, 156, 339, 818, 1201]
| }, {
| name: 'Oceania',
| data: [2, 2, 2, 6, 13, 30, 46]
| }]
| });
| });
|
|
| </script>
| </head>
| <body>
| <script src="../../js/highcharts.js"></script>
| <script src="../../js/modules/exporting.js"></script>
|
| <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
|
| </body>
| </html>
|
|
