I’m using Highchart API to display charts. There are many chart type to display and the idea is let the user choose a chart from a dropdown, make an ajax request and partially update the chart. The good is i can output a custom response, with custom chart options, layout and data.
The problem here is that chart layout and data are inside the script tag in head. An empty div is then populated by the API.
Which pattern should i use to partially update the chart? Sorry for the very noob question, but i’m feeling a bit confused when dealing with something different from updating div with plain text/html as server response.
Answer myself: make
charta global javascript variable, initialize charts options (not necessary) send an ajax request and return a JSON object that represent the entire chart object, overridingchartglobal. No need to callredraw. Limitations: as you can’t serialize function you can’t dynamically override formatters function (e.g. for tooltips).If you just want to update data call
addSeries,setSize,setTitle(and others) methods.All explained very well here (section 4) and here.