案例:HighCharts案例     状态:可编辑再运行    进入竖版
 运行结果 
x
            pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
 
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
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
8
<script src="https://code.highcharts.com/modules/data.js"></script>
9
</head>
10
<body>
11
<div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div>
12
<script language="JavaScript">
13
$(document).ready(function() { 
14
 
15
   Highcharts.data({
16
      csv: document.getElementById('tsv').innerHTML,
17
      itemDelimiter: '\t',
18
      parsed: function (columns) {
19
         var brands = {}, brandsData = [], versions = {}, drilldownSeries = [];
20
         
21
         // Parse percentage strings
22
         columns[1] = $.map(columns[1], function (value) {
23
            if (value.indexOf('%') === value.length - 1) {
24
               value = parseFloat(value);
25
            }
26
            return value;
27
         });
28
29
         $.each(columns[0], function (i, name) {
30
            var brand, version;
31
32
            if (i > 0) {
33
34
               // Remove special edition notes
35
               name = name.split(' -')[0];
36
37
               // Split into brand and version
38
               version = name.match(/([0-9]+[\.0-9x]*)/);
39
               if (version) {
40
                  version = version[0];
41
               }
42
               brand = name.replace(version, '');
43
44
               // Create the main data
45
               if (!brands[brand]) {
46
                  brands[brand] = columns[1][i];
47
               } else {
48
                  brands[brand] += columns[1][i];