ApexCharts如何配置禁用图表拖拽、滚动及缩放功能

你需要在options.chart配置节点下新增两组配置即可完全禁用所有拖拽操作：

• 关闭缩放与平移拖拽：添加zoom: { enabled: false }
• 关闭框选拖拽：添加selection: { enabled: false }

另外你现有配置中x轴配置的键名存在笔误，xasis应为xAxis，否则对应配置不会生效。

修改后的完整代码如下：

// My component
<Chart
  options={performanceLineChart.options}
  series={performanceLineChart.series}
/>

// My configurations
export const performanceLineChart = {
  options: {
    chart: {
      id: 'my-chart',
      type: 'line' as 'line',
      toolbar: {
        show: false // Disable toolbar
      },
      // 禁用缩放及配套的平移拖拽
      zoom: {
        enabled: false
      },
      // 禁用框选拖拽
      selection: {
        enabled: false
      }
    },
    stroke: {
      width: 5,
      curve: 'smooth' as 'smooth'
    },
    markers: {
      size: 4,
      hover: {
        size: undefined,
        sizeOffset: 2
      }
    },
    // 修正笔误：原xasis改为xAxis
    xAxis: {
      type: 'numeric',
    }
  },
  series: [{
    name: 'Line 1',
    data: [
      [3066, 323],
      [6317, 312],
      [12498, 313],
      [24091, 326]
    ]
  },{
    name: 'Line 2',
    data: [
      [3516, 281],
      [7378, 268],
      [11502, 344],
      [21219, 371]
    ]
  }]
}

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