Qlik - Require JS Module Dependency with ChartJS

Viewed 153

I want to load Javascript plugins for chartJS within QLIK Sense Developer.

I have set up the define as below.

define( [
   'jquery',
   './PropertiesPannel',

   '//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js',
   '//cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js',
   //'./chartjs-plugin-zoom',
   './chartjs-plugin-annontation',
   //'./chartjs-plugin-datalabels',
   'qlik'
],
function ( $, ProperitesPannel, Chart,Hammer,ChartAnnotation,qlik) { foo,baa}
  • Problem 1: ON Qlik App run time, 'Chart' is undefined error is happening for the data labels plugin.
  • Problem 2: ON Qlik App run time, on occasion, the Zoom and annotations plug error as Problem 1

I believe the problem is because the packages are not loading in order so the plugins are loading before main chartJS plugin thus making Chart not globally ready to be used.

How can I load these in a way that will make sure on run time, everything is loaded correctly?

1 Answers

How can I load these in a way that will make sure on run time, everything is loaded correctly?

This option is called shim. Here quick example:

requirejs.config({
  shim: {
    '//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js': ['jquery'],
  }
});

In this example I am telling Require to load jQuery before loading Chart.bundle.js because it needs it. For all files which does not AMD support you have to set that.

You can learn more in the official page: https://requirejs.org/docs/api.html#config-shim

Related