tjugg
tjugg

Reputation: 3367

Issue loading chart.js zoom plugin with require.js

I'm trying to use the chart.js zoom plugin with my Qlik Sense extensions. Qlik is not really relevent here I guess but I will mention it anyways.

So here is how I try to load the plugin via require.js:

require.config({
    paths: {
        chart: "//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min",
        datalabels: "//cdn.jsdelivr.net/npm/[email protected]/dist/chartjs-plugin-datalabels.min",
        zoom: "//cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/0.6.3/chartjs-plugin-zoom.min"
    },
    map: {
        datalabels: {
            "chart.js": "chart"
        },
        zoom: {
            "chart.js": "chart"
        }
    }
});

I had a similar issue with the datalabels plugin, but it was solved by the mapping in the above code snippet.

The error I always keep getting is

Uncaught TypeError: Cannot read property 'helpers' of undefined

This is coming from line 11 here .

Any help on how should I require this plugin to overcome this error? I have tried to search for a solution with no luck so far. Thanks in advance.

Upvotes: 1

Views: 1716

Answers (1)

Koshux
Koshux

Reputation: 346

We also had a similar issue. We had tried endlessly to attempt the owners solutions however to no avail. Please see this issue and let me know about your findings: https://github.com/chartjs/chartjs-plugin-zoom/issues/73.

The issue occurs since RequireJS expects libraries to omit .js and therefore the Module ID chart.js will not load appropriately.

Regarding the error on line 11, we also replicated that issue and our conclusion was that chart was not loaded correctly.

Upvotes: 1

Related Questions