Ludovic Wagner
Ludovic Wagner

Reputation: 117

Migration chart.js with zoom plugin and moment adapter

I managed to draw several charts with chart.js 3.9.1. I'm trying to migrate to the 4.x.x version, but encounter the following issues:

Uncaught SyntaxError: Cannot use import statement outside a module

Uncaught TypeError: Cannot read properties of undefined (reading 'helpers') for chartjs-plugin-zoom

Uncaught TypeError: Cannot read properties of undefined (reading '_adapters') for chartjs-adapter-moment

<script type="module" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.1.1/chart.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/2.0.0/chartjs-plugin-zoom.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-adapter-moment/1.0.1/chartjs-adapter-moment.min.js"></script>

I believe the first issue car be resolved by adding type="module", but generate the following error Uncaught TypeError: Failed to resolve module specifier "@kurkle/color". Relative references must start with either "/", "./", or "../".

Based on the integration documentation https://github.com/chartjs/awesome#integrations, both libraries are compatible with chart.js 4.x.x.

Does anyone have an idea about what cause the issue?

Upvotes: 5

Views: 3993

Answers (1)

LeeLenalee
LeeLenalee

Reputation: 31429

As described in the migration guide you need to use the UMD bundle:

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.1.1/chart.umd.js"></script>

Upvotes: 7

Related Questions