ApexCharts 如何动态更新 y 轴刻度？答案

【问题标题】：ApexCharts How to update y-axis scales dynamically?ApexCharts 如何动态更新 y 轴刻度？
【发布时间】：2019-03-29 08:31:06
【问题描述】：

我正在使用带有 Vue 包装器的 ApexCharts。我可以通过使用函数设置它们来成功更改最小值和最大值。 this.options.yaxis[0].min = Number(4500);例如，当我在控制台中将其注销时，该值就是我设置的值。但是，它似乎对图表本身没有影响，刻度仍然读取推送系列的默认值。

initGraph(data) {
  var tempNum = 0;
  var tempNum2 = tempNum;
  this.options.yaxis[0].max = Number(5000);
  this.options.yaxis[0].min = Number(4500);
  console.log(this.options.yaxis[0].min);
  console.log(this.options.yaxis[0].max);
  for (var series in data) {
    this.series.push(data[series]);
  }
}

我的目标是在新系列被过滤到系列对象时更改 y 轴上的比例。

【问题讨论】：

标签： vue.js apexcharts

【解决方案1】：

您需要更新整个选项配置，而不仅仅是单个属性以允许 Vue 观察程序捕捉更改。

this.options = {
  yaxis: {
    min: 4500,
    max: 5000
  }
}

【讨论】：

【解决方案2】：

更新系列之前的更新选项并且它有效：

chart.updateOptions( {
  xaxis: {
    categories: ["Stackoverflow", "is", "great"]
  },
  yaxis: {
    min: 4500,
    max: 5000
  }
});

【讨论】：