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

是否可以合并以下内容

（编辑）作为主模板：

• 带有杆段的单个水平堆叠杆

结合了以下功能（编辑）：

在条段上始终可见：

• 数据名称（标签）（i.c.“

  apples

  ”、“

  pears

  ”、…）
• 百分比（如有可能计算：“

  50%

  ”、“

  50%

  ”、…）

鼠标悬停上显示：

• 原始数据编号（例如“

  15

  ”、“

  15

  ”、…）
• 系列名称/说明（i.c.“

  浏览器共享”

  ”）

---

差不多但不完全：

一个带有“百分比”的水平条形图示例，鼠标上方的“原始数据编号”可在（编辑）中找到，但缺少“数据名称”，我无法找到更改“系列名称””的方法。此外：这是一个水平条形图，但不是一个单堆叠的

---

---

非常感谢您的帮助。

再次强调，这是对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',
           },
        },

  },

条：{
数据标签：{
启用：对，
距离：-50，
格式化程序：函数（）{
var dlabel=this.series.name+'
'；
dlabel+=Math.round（此.percentage*100）/100+'%'；
返回标签
},
风格：{
颜色：'白色'，
},
},
},

---

我想这就是你想要的？

太好了！感谢大家提供了另一个精确的答案。然后（只是一个模拟小提琴1布局的小改动）

gridLineWidth:0

，可以添加到

yAxis:{

…

}

，以移除垂直条纹/测量条——但在那之后，我仍然想知道如何移除剩下的唯一垂直条纹（最左边）它在小提琴1中也被移除。像一个符咒一样工作！我注意到您的完美解决方案是添加

线宽：0，

内部

xAxis:{

..

}

。很抱歉再次打扰您，但我仍在寻找一些其他细节，以完全模仿小提琴1可以通过在

图例：{

..

}

中添加

启用：false，

来删除图例，可以通过将

标题：{

..

}

中的文本更改为

文本：“”来删除标题，

可以通过将

yAxis:{

..

}

中的文本更改为

文本：“”来删除x轴名称，

——但我还没有发现如何删除图表下方的x轴测量值。也不知道如何删除y轴名称“Fruits”，因为这似乎与mousehover上的系列名称（我想保留）结合在一起。您宝贵的帮助让我实现了我想要的。--不幸的是，一个小问题是，对于小条段，

dataLabels

将不可读我在这里发布了一个关于它的新问题：，在这里您还可以看到我想要实现的实现。