将dataLable添加到饼图Highchart

Question

我想向饼图Highchart添加标签，以便标签显示类别和数量，如本例所示。这是我的代码：

 $('#ro-tier-1').highcharts({ chart: { type: 'pie' }, data: { googleSpreadsheetKey: '1Nx8zcIi0ULxytLmra0A9N11-llzJCDVH2-7SbK_k5-U', startColumn: 0, endColumn: 1, startRow: 0, endRow: 3, googleSpreadsheetWorksheet: 16 }, plotOptions: { dataLabels: { enabled: true, format: '{y}', } }, title: { text: 'Tier 1 Schools in 2012, 2013, or 2014 Expansion or Ceiling increase ' }, yAxis: { min: 0, max: 25, tickInterval: 5, title: { text: 'Amount of Schools' }, }, xAxis: { type: 'category', title: { text: 'Result' } }, });

 <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script src="http://code.highcharts.com/highcharts.js"></script> <script src="http://code.highcharts.com/modules/data.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/4.1.5/modules/broken-axis.js"> </script> </head> <body> <div id="ro-tier-1"></div> </body>

我知道我的问题出在数据标签的格式上，但是API文档在这方面很少。

Answer 1

您需要做的就是将dataLabels放置在正确的plotOptions中并使用point

plotOptions: {
  pie: {
    dataLabels: {
      enabled: true,
      format: '{point.name}:{point.y}',
    }
  }
}

您可以在这里查看工作示例http://plnkr.co/edit/5VI6cAqVoIibhAJ8pYfP

UPDATE

格式化也可以使用{y} 格式：'{y}' ，但是如果您想通过点引用更高级的表达式，则必不可少

将dataLable添加到饼图Highchart

问题描述

1 个解决方案

解决方案1
1 已采纳 2015-06-05 20:01:40

将dataLable添加到饼图Highchart

问题描述

1 个解决方案

解决方案1 1 已采纳 2015-06-05 20:01:40

解决方案1
1 已采纳 2015-06-05 20:01:40