Highcharts 单个水平堆叠条形图，始终显示数据名称（标签）和百分比，鼠标悬停时显示数据编号和系列名称

Question

是否可以合并以下内容？

Fiddle 1 (answered by mäksä) 作为主模板:

带有条形段的单个水平堆叠条形

结合Fiddle 2 (ed by aus_lacy的以下特点):

在条形段上始终可见：

数据名称（标签）（i.c。"apples", "pears",...)
百分比（如果可能的话计算：“50%”，“50%”，... )

鼠标悬停时显示：

原始数据数(i.c."15","15" ,...)
系列 name/description (i.c. "Browser share")

几乎但不完全是：

始终显示 "percentages" 且鼠标悬停时 "original data numbers" 的水平条形图示例可在 Fiddle 3 (answered by jlbriggs) 中找到，但是“数据名称”缺少，我找不到更改“系列名称”的方法。此外：这是一个水平条形图，但这不是 单层堆叠。

非常感谢任何帮助，非常感谢。

Answer 1

这也是对 Highcharts 属性的简单修改，特别是这个小片段：

bar: {
        dataLabels: {
           enabled: true,
           distance : -50,
           formatter: function() {
                 var dlabel = this.series.name + '<br/>';
                 dlabel += Math.round(this.percentage*100)/100 + ' %';
                 return dlabel
           },
           style: {
                 color: 'white',
           },
        },

  },

我想this snippet是你想要的？

Highcharts 单个水平堆叠条形图，始终显示数据名称（标签）和百分比，鼠标悬停时显示数据编号和系列名称

Highcharts single horizontal stacked bar chart with data names (labels) and %-ages always shown and data numbers and series name shown on mousehover

javascript

jquery

html

css

highcharts