案例:HighCharts案例     状态:可编辑再运行    进入竖版
 运行结果 
x
 
1
<html>
2
<head>
3
<meta charset="UTF-8" />
4
<title>Highcharts 教程 | W3xue教程(w3xue.com)</title>
5
<script src="/js/jquery-2.1.4.min.js"></script>
6
<script src="/js/hc/highcharts5.0.6.js"></script>
7
</head>
8
<body>
9
<div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div>
10
<script language="JavaScript">
11
$(document).ready(function() {   
12
   var title = {
13
      text: '每月平均温度'   
14
   };
15
   var subtitle = {
16
      text: 'Source: w3xue.com'
17
   };
18
   var xAxis = {
19
      categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
20
         'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
21
   };
22
   var yAxis = {
23
      title: {
24
         text: 'Temperature (\xB0C)'
25
      }
26
   };
27
   var plotOptions = {
28
      line: {
29
         dataLabels: {
30
            enabled: true
31
         },   
32
         enableMouseTracking: false
33
      }
34
   };
35
   var series= [{
36
         name: 'Tokyo',
37
         data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
38
      }, {
39
         name: 'London',
40
         data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
41
      }
42
   ];
43
   
44
   var json = {};
45
46
   json.title = title;
47
   json.subtitle = subtitle;
48
   json.xAxis = xAxis;