Highcharts 柱形图：如何同时显示数字和百分比

要在 Highcharts 柱形图中同时显示数字和百分比，您可以使用柱形图的数据标签功能。\n\n首先，您需要确保数据标签功能已启用。可以通过在plotOptions中的column属性中设置dataLabels为true来启用数据标签。例如：\n\njavascript\nplotOptions: {\n column: {\n dataLabels: {\n enabled: true\n }\n }\n}\n\n\n接下来，您需要指定要显示的数据标签格式。可以使用formatter选项来自定义数据标签的显示内容。在这个函数中，您可以使用this.y来获取柱形图的数据值，并使用this.percentage来获取百分比值。\n\njavascript\nplotOptions: {\n column: {\n dataLabels: {\n enabled: true,\n formatter: function() {\n return this.y + ' (' + this.percentage.toFixed(2) + '%)';\n }\n }\n }\n}\n\n\n在上述代码中，我们使用toFixed(2)将百分比的小数部分限制为两位。\n\n最后，将上述配置应用到您的柱形图对象中即可：\n\njavascript\nvar chart = new Highcharts.Chart({\n // 图表配置\n plotOptions: {\n column: {\n dataLabels: {\n enabled: true,\n formatter: function() {\n return this.y + ' (' + this.percentage.toFixed(2) + '%)';\n }\n }\n }\n },\n // 数据配置\n series: [{\n // 数据系列\n }]\n});\n\n\n这样，您的 Highcharts 柱形图将同时显示数据和百分比。