AccumulationChart with axios as datasource

Question

Hi,I really like opening tickets here, so can you provide an working example of using your chart with axios as datasource - not fixed datasource, and not using your DataManager.When using fixed datasource, the chart is loading just fine. But who would want to do that (as in your examples)?Annoyed to max, that simple things like thatx can not be done in 10 min.By the way, when are you planing to add some complex example for VUE 3 (as all (let's say 99%) of all your examples are done for VUE 2)BR

Vedran Hudec · Answer

Hello,I'll add a little update. I'm extending your control behind custom control with a template which contains accumulationChart. The control is the same as your example.
https://ej2.syncfusion.com/vue/demos/#/bootstrap5/chart/default-pie.html

The control has a prop with datasource (mapped to your datasource). Other control which uses this extended controls sets this datasource prop - which is a vuex store, collected as promise from axios (as should be done). I've just sent your test data found in above example (through promise) and got blank screen - nothing, no error, zero information.Which event I need to implement, so the data can be passed through prop to your control, to redraw the chart (with new data)?BR,Eveything is the same

Durga Gopalakrishnan · Answer

Hi Vedran, 

Greetings from Syncfusion. 

We have analyzed your query and prepared sample based on your requirement. Please check with below snippet and sample.  





mounted () { 
    axios 
      .get('https://api.coindesk.com/v1/bpi/currentprice.json') 
      .then(response => { 
                               let data = response.data.bpi; 
                               this.seriesData.push( 
                                             {x: data.EUR.code, y: data.EUR.rate_float},  
                                             {x: data.GBP.code, y: data.GBP.rate_float}, 
                                             {x: data.USD.code, y: data.USD.rate_float} 
                               ); 
                })           
  } 

  

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/Axios122308125.zip 

Note : We request you to assign the datasource format in array of objects after fetching data from API response using axios. 

Please revert us if you have any concerns. 

Regards, 
Durga G