echarts横向柱状图每隔几秒自动滚动

你可以通过使用 echarts 的 dataZoom 组件来实现横向柱状图的自动滚动。首先，设置 dataZoom 组件的 type 为 slider，并设置 start 和 end 的初始值。然后，使用 setInterval 函数来动态更新 dataZoom 组件的 start 和 end 值，从而实现自动滚动效果。

以下是一个示例代码：

// 初始化 echarts 实例
var myChart = echarts.init(document.getElementById('myChart'));

// 定义数据
var data = [
  { name: 'A', value: 123 },
  { name: 'B', value: 234 },
  { name: 'C', value: 345 },
  { name: 'D', value: 456 },
  { name: 'E', value: 567 },
  { name: 'F', value: 678 },
  { name: 'G', value: 789 },
  { name: 'H', value: 890 },
  { name: 'I', value: 901 },
  { name: 'J', value: 1234 },
];

// 定义 option
var option = {
  xAxis: {
    type: 'value',
  },
  yAxis: {
    type: 'category',
    data: data.map(item => item.name),
  },
  series: [
    {
      type: 'bar',
      data: data.map(item => item.value),
    },
  ],
  dataZoom: [
    {
      type: 'slider',
      show: true,
      start: 0,
      end: 5,
    },
  ],
};

// 设置 option
myChart.setOption(option);

// 定义自动滚动函数
function autoScroll() {
  var start = myChart.getOption().dataZoom[0].start;
  var end = myChart.getOption().dataZoom[0].end;
  var maxEnd = myChart.getOption().yAxis.data.length - 1;
  if (end < maxEnd) {
    start++;
    end++;
  } else {
    start = 0;
    end = 5;
  }
  myChart.dispatchAction({
    type: 'dataZoom',
    start: start,
    end: end,
  });
}

// 每隔 2 秒钟自动滚动一次
setInterval(autoScroll, 2000);

在这个示例代码中，我们定义了一个包含 10 个数据项的数据数组，并且使用 echarts 的 xAxis 和 yAxis 组件以及 series 组件来渲染横向柱状图。我们还定义了一个 dataZoom 组件，并设置了它的初始 start 和 end 值。最后，我们使用 setInterval 函数来每隔 2 秒钟自动滚动一次横向柱状图。