Javascript 如何在堆叠柱形图和高度图中显示所有系列数据的图例？

在这张图表中，我想显示所有人的名字和乐队的颜色，就像传说中有不同果实的人一样。这里有些人可以有很多种水果，但我不想显示两次名称。这里只显示系列名称，但我想在底部显示所有人的名称。有人能帮我吗

Highcharts.chart（'container'{
图表：{
类型：“列”
},
标题：{
文本：“”
},
xAxis：{
类别：[‘苹果’、‘橘子’、‘香蕉’]
},
亚克斯：{
分:0,，
标题：{
文本：“”
},
堆叠标签：{
启用：对，
风格：{
fontWeight:'粗体'，
颜色：（Highcharts.theme&&Highcharts.theme.textColor）| |“灰色”
}
}
},
工具提示：{
headerFormat:“{point.x}
”，
pointFormat:“{point.name}:{point.y}
总计：{point.stackTotal}”
},
打印选项：{
专栏：{
堆叠：“正常”，
数据标签：{
启用：对，
颜色：（Highcharts.theme&&Highcharts.theme.dataLabelsColor）| |“白色”
}
}
},
学分：{
已启用：false
},
系列：[{
数据：[{
x:0,，
y:3，
姓名：'约翰'，
颜色：“#FF5733”
},
{
x:0,，
y:5，
姓名:"帕克",，
颜色：'#009900'
},{
x:0,，
y:1,，
姓名：'亚当'，
颜色：“#95FF33”
},{
x:1，
y:5，
姓名:"亚历克斯",，
颜色：“#E3FF33”
},{
x:1，
y:3，
姓名：'Pukal'，
颜色：“#33BDFF”
},{
x:1，
y:4，
姓名:"马克",，
颜色：“#FB33FF”
},{
x:2，
y:3，
姓名：'约翰'，
颜色：“#FF5733”
},{
x:2，
y:4，
姓名:"帕克",，
颜色：'#009900'
},{
x:2，
y:2，
姓名:"马克",，
颜色：“#FB33FF”
}]
}]
});
我会将数据转换为多个系列的形式，而不是一个系列，如下所示：

{
  series : [
    { name: "John", color: "#FF5733", data: [3, 0, 3] }
    { name: "Parker", color: "#009900", data: [5, 0 4] }
    .. etc ...
  ]
}

然后Highcharts将自动使用此人的姓名作为图例

这里有一个例子来说明我的意思

我使用以下代码将数据转换为多个系列：

var data = [];
var seriesLookup = {};
original.forEach(function(item){
  var series = seriesLookup[item.name];
  if(!series){
    series = {
      name: item.name,
      color: item.color,
      data: [0, 0, 0]
    };
    data.push(series);
    seriesLookup[item.name] = series;
  }
  series.data[item.x] = item.y;
});

然后我将
工具提示.pointFormat
更改为使用
series.name
而不是
point.name

tooltip: {
  headerFormat: '<b>{point.x}</b><br/>',
  pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}'
},

您也可以只设置
legendType:“点”
：

series: [{
    legendType: 'point',
    data: [ ... ]
}]

现场演示：
谢谢@sheilak这看起来太棒了！我真的很感谢你的帮助：）
series: [{
    legendType: 'point',
    data: [ ... ]
}]