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

Categories issue

Open ravenshore opened this issue 4 years ago • 3 comments

Hi,

thanks for the great plugin first of all! I have used several charts so far, but the bar chart surprisingly is giving me a ton of headache. Managed to implement heatmaps and pie charts on Vue 3, but the bar... Whenever I try to update the Options to update the categories I get a duplicate of the chart, like so:

image

Tried using this method, as described here:

        updateBarChartOptions() {

            let cats = this.loadDurationCategories();


            console.log('Categories updating to: ' + cats)

                this.chartOptions4 = { 

                    ...this.chartOptions4,
                    ...{
                    xaxis: {
                        categories: cats
                    }
                }
            }
        },

Tried to update them, by just using a computed property, like so:

        durationCategories() {
            let categories = this.loadDurationCategories()
            return categories
        },

Where the loadDurationategories() method just returns a new Array, like: [1, 2, 3.... etc] The computed property seems to not work at all, as I am getting an error from the slice, indicating that the array never makes it to the chart.

Any help is greatly appreciated! Thanks!

ravenshore avatar Nov 16 '21 05:11 ravenshore

Forgot to mention one more issue, if you look at the chart, the number of series and the number of categories is exactly the same: 11, but the width doesn't match. image

So they all look completely off.

ravenshore avatar Nov 16 '21 16:11 ravenshore

If I bunch all my data into a single Series, then the columns match the categories perfectly, but then then I still have the issue with the duplicate charts, every time I update the Options. However I would prefer to have the separate series for each entry, so I can have different colors. image

ravenshore avatar Nov 16 '21 16:11 ravenshore

Check #25 I was having similar issues and it was a matter of the watch not looking deep enough so I updated the entire chartOptions object.

conor-f avatar Feb 11 '22 17:02 conor-f