vue3-apexcharts icon indicating copy to clipboard operation
vue3-apexcharts copied to clipboard

series is not update when global state is changed

Open Gartleypattern opened this issue 3 years ago • 1 comments

I've assigned a global state to series.data but is not changed when global state is changed. data() { return { series: [{ name: 'apicalls', data : apiCalls[this.$store.state.currentDay] }], chartOptions: { chart: { zoom: { enabled : false, }, }, fill : { type : 'gradient', colors : "#00FFDC" }, dataLabels : { enabled: false }, stroke : { curve: 'straight', width : .5, },

        title : {
          // text: 'Fundamental Analysis of Stocks',
          // align: 'left'
        },
        subtitle : {
          // text: 'Price Movements',
          // align: 'left'
        },
        labels : [10,20,30,40,50],
        xaxis : {
          type : 'datetime',
        },
        yaxis : {
          opposite: true
        },
        legend : {
          horizontalAlign: 'right'
        }
    },
}

}

Gartleypattern avatar Jan 25 '22 08:01 Gartleypattern

I was making an API call after which I needed to update the chart so I wrote a function

const updateChart = ()=>{ series.pop() series.push(30) } It popped the last value from the array and pushed a new value which somehow started updating my chart. I called this update method from my API response like this:

myStore.someMethod({ }).then(response => { updateChart() }).catch(error => { console.log(error) })

This way it started working, wasted hours in solving this, hope it helps someone.

kumarravisingh avatar Feb 17 '23 01:02 kumarravisingh