Highcharts 饼图显示占比和具体数字：详细教程和代码示例

在 Highcharts 中，可以通过设置饼图的 `dataLabels` 属性来显示占比，以及通过设置图例的 `labelFormatter` 属性来显示具体数字。\n\n下面是一个示例代码：\n\njavascript\nHighcharts.chart('container', {\n chart: {\n type: 'pie'\n },\n title: {\n text: 'Pie Chart'\n },\n plotOptions: {\n pie: {\n allowPointSelect: true,\n cursor: 'pointer',\n dataLabels: {\n enabled: true,\n format: '{point.percentage:.1f}%'\n },\n showInLegend: true\n }\n },\n series: [{\n name: 'Brands',\n colorByPoint: true,\n data: [{\n name: 'Chrome',\n y: 61.41\n }, {\n name: 'Internet Explorer',\n y: 11.84\n }, {\n name: 'Firefox',\n y: 10.85\n }, {\n name: 'Edge',\n y: 4.67\n }, {\n name: 'Safari',\n y: 4.18\n }, {\n name: 'Other',\n y: 7.05\n }]\n }],\n legend: {\n labelFormatter: function() {\n return this.name + ': ' + this.y;\n }\n }\n});\n\n\n在上面的代码中，`dataLabels` 的 `enabled` 属性设置为 `true`，并且通过 `format` 属性设置了数据标签的显示格式为百分比。`showInLegend` 属性设置为 `true` 来显示图例。\n\n在图例的 `labelFormatter` 函数中，通过 `this.name` 获取图例名称，通过 `this.y` 获取具体的数值，并将它们拼接起来作为图例的文本。\n\n这样设置之后，饼图中的每个扇区上会显示占比的百分比，图例中会显示具体的数值。