vue-apexcharts更新数据一次更改页面上的多个图表

时间:2018-09-23 04:32:24

标签: javascript apexcharts

我在一页上有多个顶点图,每个顶点都单独配置。尝试更新一个图表上的数据会更新所有数据,但是其他图表不会显示该数据。随后访问其他图表的数据数组时,它们已更改。

图表被标识为SHP1SHP8

使用:

Vue: Version 2.5.2
vue-apexcharts: version 1.1.1
apexcharts: version 1.4.12

模板:

      <apexcharts type='bar' :options='SHP1.chartOptions' :series='SHP1.series' @click.native="ProfileChange('SHP1')"></apexcharts>


<script>
import VueApexCharts from 'vue-apexcharts'

    export default {
  data () {
    return {

      SHP1: {
        series: [{
          name: 'SHP1',
          data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
        }],
        chartOptions: {
...

      SHP2: {
        series: [{
          name: 'SHP2',
          data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
        }],
        chartOptions: {

// to access a chart's data

    this.SHP1.series[0].data

// to set a chart's data (chartData)

        this.SHP1.series = [{
          data: chartData
        }]

0 个答案:

没有答案