javascript - 重绘Highchart系列方法。 Vue.js

Question

在 Vuejs 和 Hightcharts 上构建响应式(Reactive)图表。堆积如山，试图为 redraw() 创建方法。

我试过 this.chart.series[0].setData(this.values,true); 但它不起作用，因为我需要设置整个 series 而不是 series.data。我的系列数据格式:[{"data": 'value', "name": 'value'}]，但我只知道如何重绘系列数据部分。任何提示将不胜感激!

// My data format:
    values: [ 
    { "data": [ 6000000, 0, 0, 0, 0, 0, 0, 0, 0, 0, { "isSum": true } ], "name": "Shares A" }, 
    { "data": [ 9600000, 0, 0, 0, 0, 0, 0, 0, 0, 0, { "isSum": true } ], "name": "Shares B" }, 
    { "data": [ 0, 0, 4000000, 0, 0, 0, 0, 0, 0, 0, { "isSum": true } ], "name": "Share C" }, 
    { "data": [ 0, 5000000, 0, 0, 0, 0, 0, 0, 0, 0, { "isSum": true } ], "name": "Shares D" } 
    ]
    // Redraw method:
    methods:{
        redraw(){
            // this doesn't work, need help with this part 
            this.chart.series[0].setData(this.values,true);

            // I've also tried this way, but it redraws only 1st seria, not every of them
            this.chart.series[0].update({
                data: this.values[0].data,
                name: this.values[0].name
            }, true); 
        }
    },
    watch:{
        values(){this.redraw()},
    },
    series: this.values

Answer 1

我终于找到了解决方案:

methods:{
        redraw(){
            chart = this.chart

            if(chart.series.length > 1){
                var s = 0;
                for(var i in this.values){
                    chart.series[s].setData(this.values[i].data);
                    chart.series[s].name = this.values[i].name;
                    s++;
                }
            }else{
                this.chart.series[0].setData(this.values[0].data);
                this.chart.series[0].name = this.values[0].name;
            }
        }
    },