如何在StockChart中实现多趋势、多Y轴及同日期标记堆叠？

不用拆分多个系列，直接通过调整数据点Y值配合Y轴配置即可实现垂直堆叠：

• 单系列多数据点方案
  在散点/标记系列的data中，为同一日期创建多个数据点，分别设置不同的Y值（比如1、2、3），让标记在垂直方向排列。同时隐藏Y轴的刻度和标题，只保留标记展示：

  yAxis: {
    labels: { enabled: false },
    title: { text: '' },
    min: 0,
    max: 4 // 根据标记数量调整上限
  },
  series: [{
    type: 'scatter',
    data: [
      [Date.UTC(2024, 0, 1), 1],
      [Date.UTC(2024, 0, 1), 2],
      [Date.UTC(2024, 0, 1), 3],
      [Date.UTC(2024, 0, 2), 1],
      [Date.UTC(2024, 0, 2), 2]
    ],
    marker: { radius: 6 }
  }]
  

• 多系列区分样式方案
  如果需要不同标记有不同样式，创建多个系列，每个系列对应一种标记样式，同一日期的点设置对应的Y值（比如系列1用Y=1，系列2用Y=2），同样隐藏Y轴即可实现堆叠区分。

Highcharts原生支持多Y轴配置，每个系列可绑定独立的Y轴，步骤如下：

1. 在yAxis数组中定义多个轴，每个轴可设置独立的标题、颜色、位置等属性：

   yAxis: [
     {
       title: { text: '折线标记值' },
       lineWidth: 2,
       lineColor: '#2f7ed8' // 对应折线系列颜色
     },
     {
       title: { text: '柱状图数值' },
       lineWidth: 2,
       lineColor: '#0d233a', // 对应柱状系列颜色
       opposite: true // 将该轴显示在图表右侧
     }
   ]
   

2. 在每个系列中通过yAxis属性指定对应的轴索引（从0开始）：

   series: [
     {
       type: 'scatter', // 折线标记图
       yAxis: 0,
       data: [...],
       color: '#2f7ed8'
     },
     {
       type: 'column', // 柱状图
       yAxis: 1,
       data: [...],
       color: '#0d233a'
     }
   ]
   

如果需要更多独立Y轴，继续在yAxis数组中添加配置，系列绑定对应索引即可。

内容的提问来源于stack exchange，提问作者DhanaLaxshmi