Javascript 在压缩气泡高度图中为每个气泡添加标题

我有一个打包的气泡图，效果很好。我想为每个较大的、分开的气泡添加一个标题。标题应该总是显示，我想它是该系列的名称。我用的是分裂序列

“name”属性显示在工具提示中，但我希望它始终显示

以下是创建气泡的代码：

Highcharts.chart('bubble-split-chart', {
  chart: {
    type: 'packedbubble',
    animation: false,
    backgroundColor: {
      linearGradient: { x1: 0, y1: 0, x2: 1, y2: 1 },
      stops: [
          [0, '#15191b'],
          [1, '#15191b']
      ]
    },
  },
  // remove hamburger button
  exporting: {
    enabled: false
  },
  // remove chart watermark (highcharts.com)
  credits: {
    enabled: false
  },
  title: {
  text: '',
  enabled: false
  },
  tooltip: {
      useHTML: true,
      pointFormat: '<b>{point.name}</b>'
  },
  plotOptions: {
    packedbubble: {
      minSize: '1%',
      maxSize: '100%',
      zMin: 1,
      zMax: 400,
      layoutAlgorithm: {
        enableSimulation: false,
        gravitationalConstant: 0.05,
        splitSeries: true,
        seriesInteraction: false,
        dragBetweenSeries: false,
        parentNodeLimit: true
      }
    },
    legend: {
      enabled: false
    }
  },
  series: [{
    name: 'Test',
    data: [{
      name: "Lorem",
      value: 29.4,
      color: 'red'
    },
    {
      name: "Ipsum",
      value: 34.1,
      color: 'blue'
    },
    {
      name: "Dolor",
      value: 7.1,
      color: 'green'
    }],
  }, {
    name: 'Test 2',
    data: [{
      name: 'Lorem',
      value: 300.1,
      color: 'red'
    }, 
    {
      name: 'Ipsum',
      value: 20.7,
      color: 'blue'
    },
    {
      name: "Dolor",
      value: 97.2,
      color: 'green'
    }],
  }, {
    name: 'Test 3',
    data: [{
      name: "Lorem",
      value: 8.2,
      color: 'red'
    },
    {
      name: "Ipsum",
      value: 9.2,
      color: 'blue'
    },
    {
      name: "Dolor",
      value: 13.1,
      color: 'green'
    }],
  }]
});

Highcharts.chart（'bubble-split-chart'{
图表：{
类型：“packedbubble”，
动画：错，
背景颜色：{
线性半径：{x1:0，y1:0，x2:1，y2:1}，
停止：[
[0，#15191b']，
[1'#15191b']
]
},
},
//卸下汉堡按钮
出口：{
已启用：false
},
//删除图表水印（highcharts.com）
学分：{
已启用：false
},
标题：{
文本：“”，
已启用：false
},
工具提示：{
是的，
pointFormat:“{point.name}”
},
打印选项：{
包装气泡：{
minSize：“1%”，
maxSize:“100%”，
zMin:1，
zMax:400，
布局算法：{
enableSimulation:错误，
重力常数：0.05，
是的，
序列交互：错误，
DragBetween系列：false，
parentNodeLimit：对
}
},
图例：{
已启用：false
}
},
系列：[{
名称：'测试'，
数据：[{
姓名：“Lorem”，
价值：29.4，
颜色：“红色”
},
{
名称：“Ipsum”，
价值：34.1，
颜色：“蓝色”
},
{
姓名：“多洛”，
价值：7.1，
颜色：“绿色”
}],
}, {
名称：“测试2”，
数据：[{
名称：“Lorem”，
价值：300.1，
颜色：“红色”
}, 
{
名称：“Ipsum”，
价值：20.7，
颜色：“蓝色”
},
{
姓名：“多洛”，
价值：97.2，
颜色：“绿色”
}],
}, {
名称：“测试3”，
数据：[{
姓名：“Lorem”，
价值：8.2，
颜色：“红色”
},
{
名称：“Ipsum”，
价值：9.2，
颜色：“蓝色”
},
{
姓名：“多洛”，
价值：13.1，
颜色：“绿色”
}],
}]
});

---

这可能吗？此外，如果可能，如何从工具提示中删除名称？

您可以使用

注释
或
Highcharts.svgrender
类添加标签

要从工具提示集中删除系列名称，请执行以下操作：

tooltip: {
    headerFormat: '',
    ...
}


现场演示：

API参考：



谢谢您的帮助。我应该提到我的系列在系列数组中有多个数据点。我已经更新了代码以反映这一点。我尝试向系列中的每个数据数组添加注释，但没有成功。如何为每个系列添加标题？嗨@hashrocket，注释的确切问题是什么？您可以添加多个注释：感谢您的快速响应。我在注释方面遇到的问题是它们与系列中的数据没有关联。我必须分别放置每个气泡（并为序列中的每个数据段创建一个），如果气泡移动，注释将不在正确的位置。有没有办法将注释直接绑定到序列中每个数据集的name属性，并将其直接放置在每个黑气泡的中心？如果你看第二张图片，你可以看到我想要完成的。好的，我认为你有一个静态图表，因为禁用了动画。那么，问题是关于响应的吗？如果是，则需要在某些事件回调函数中重新定位注释，例如：抱歉。我禁用了动画，因为它需要很长时间才能停止。我为这么多的问题道歉。我是Ruby开发者，不是JavaScript开发者。问题不一定是反应灵敏。我只是在寻找一种方法，使name属性（当前在工具提示中）位于每个黑气泡的中心。这样，当有人看到每个黑气泡时，他们就可以看到气泡所属的公司，而不必在每个内部气泡上盘旋。