i try to make a new module for the JavaScript library ApexCharts using require. But no matter what I do, I always get an "Uncaught ReferenceError: ApexCharts is not defined".
here's my code:
Code: Select all
! $("body").append($("<div id='chart' style='width:500px;height:300px' />"));
! require(["https://cdn.jsdelivr.net/npm/apexcharts"], function(a, b, c) {
! var options = {
! chart: { type: 'line' },
! series: [ { name: 'sales', data: [30,40,35,50,49,60,70,91,125] } ],
! xaxis: { categories: [1991,1992,1993,1994,1995,1996,1997,1998,1999] }
! }
! var chart = new ApexCharts(document.querySelector("#chart"), options);
! chart.render();
! });
Code: Select all
<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<div id="chart" style="width:500px;height:300px"></div>
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<script>
var options = {
chart: { type: 'line' },
series: [{ name: 'sales', data: [30,40,35,50,49,60,70,91,125] }],
xaxis: { categories: [1991,1992,1993,1994,1995,1996,1997,1998,1999] }
}
var chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();
</script>
</body>
</html>