0đź‘Ť
All your problems occurs because of incorrect implementation of your code. First, setting chart categories doesn’t affect on chart at all. By default, appropriate “category” for every slice is taken from each point name
property, so your way of implementation won’t work. You need to change the point
values instead of categories.
The easiest way of implementing it, looks (step by step) like that:
– get your challenge_categories
by axios.
– create new series
array with new data in your setOccurence()
function.
– take every received category object, and parse it as a new point in new series. object defined before.
– watch all changes on series
field in your component, and when changed – update the chart with new series
object.
I prepared simplified example which shows how it should be implemented. Here is the link: http://jsfiddle.net/b2yLc1m3/1/
P.S
We have our official Vue wrapper for Highcharts, which makes the process of chart implementation much easier than with using native approach. I recommend you to take a look on that. I hope it will help you a lot.
Here is the link to npm package: https://www.npmjs.com/package/highcharts-vue