Highcharts三层钻取中仅为第二层配置x轴setExtremes自动滚动的实现问题

先定义全局变量，用于存储定时器句柄和当前钻取层级：

let interval = null;
let equ_counter = 0; // 层级标记：0=第一层，1=第二层，2=第三层

抽离第二层专用的轮播启动函数：

function startSecondLevelScroll(chart) {
  // 清除残留定时器，避免重复触发轮播
  clearInterval(interval);
  let counter = 0;
  // 直接取当前x轴的类别总数作为站点总数量，避免自定义属性取值偏差
  const totalSites = chart.xAxis[0].categories.length;

  // 等待钻取渲染完成后设置初始x轴范围
  setTimeout(() => {
    chart.xAxis[0].setExtremes(counter, Math.min(counter + 9, totalSites - 1));
  }, 200);

  // 启动自动轮播定时器
  interval = setInterval(() => {
    counter++;
    // 全部站点轮播完成后自动重置到起始位置，开启新一轮
    if (counter >= totalSites) {
      counter = 0;
    }
    // 计算x轴结束位置，不超出实际数据范围，杜绝多余零值
    const endPos = Math.min(counter + 9, totalSites - 1);
    chart.xAxis[0].setExtremes(counter, endPos);
  }, 3000);
}

修改后的图表事件逻辑：

events: {
  drilldown: function() {
    const chart = this;
    // 所有钻取操作先清除当前定时器，避免非第二层视图残留轮播
    clearInterval(interval);
    equ_counter++;
    // 仅进入第二层时启动自动轮播
    if (equ_counter === 1) {
      startSecondLevelScroll(chart);
    }
  },
  drillup: function() {
    // 向上钻取时立刻终止轮播
    clearInterval(interval);
    equ_counter--;
    // 若回到第二层，重新初始化轮播并重置计数
    if (equ_counter === 1) {
      startSecondLevelScroll(this);
    }
  }
}

核心适配说明：

• 零值问题修复：x轴结束位置始终取当前起始偏移+9与实际站点总数-1的较小值，不会超出x轴有效数据范围，从根源避免渲染空的零值柱子。
• 不足10个站点的展示逻辑：自动适配总站点数，当剩余可展示的站点不足10个时，仅展示实际剩余的站点，不会强制凑数。
• 循环轮播实现：当起始偏移超过总站点数时，自动重置为0从头开始，移除了原有逻辑中冗余的奇偶判断分支，避免计数错乱。
• 层级约束落地：所有离开第二层的操作（下钻到第三层、上钻回第一层）都会先清除定时器终止轮播；每次进入第二层时都会重新初始化轮播计数，从第一个站点开始滚动。

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