AmCharts.ready is not ready when loaded asynchronously

Andy picture Andy · Jul 29, 2014 · Viewed 8.5k times · Source

Initially I put all AmChart configs in AmCharts.ready is everything worked fine.

<script src="amcharts/amcharts.js" type="text/javascript"></script>
<script src="amcharts/serial.js" type="text/javascript"></script>
<script>
    AmCharts.ready(function() {
      console.log("this works");
      /* Other configs */
    })
</script>

Somehow it stops working when I introduce RequireJS as instructed in amCharts meets requireJS. Whatever code inside AmChart.ready's callback will not be executed. (Oddly it was executed one time during the debugging)

Answer

Andy picture Andy · Jul 29, 2014

After a few tests I realized AmChart.ready only pushes the callback into the onReadyArray which is later popped for execution after the window.load/onload event. In other words, if AmChart is loaded after window.onload event, AmChart.ready is useless. My workaround is as followed:

<script>
    configChart = function() {
      /* Create charts stuff */
    };
    if (AmCharts.isReady) {
      configChart();
    } else {
      AmCharts.ready(configChart);
    }
</script>