search

chartjs / Chart.js

Simple HTML5 Charts using the <canvas> tag
https://www.chartjs.org/
MIT License
63.9k stars 11.88k forks source link

can't run on firefox #11818

Closed JakodYuan closed 6 days ago

JakodYuan commented 1 week ago

Expected behavior

I have follow code,

<!DOCTYPE html>
<html>
<head>
    <title>Chart.js in Firefox</title>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
    <canvas id="myChart" width="400" height="200"></canvas>
    <script>
    var ctx = document.getElementById('myChart').getContext('2d');
    var myChart = new Chart(ctx, {
        type: 'bar',
        data: {
            labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
            datasets: [{
                label: '# of Votes',
                data: [12, 19, 3, 5, 2, 3],
                backgroundColor: [
                    'rgba(255, 99, 132, 0.2)',
                    'rgba(54, 162, 235, 0.2)',
                    'rgba(255, 206, 86, 0.2)',
                    'rgba(75, 192, 192, 0.2)',
                    'rgba(153, 102, 255, 0.2)',
                    'rgba(255, 159, 64, 0.2)'
                ],
                borderColor: [
                    'rgba(255, 99, 132, 1)',
                    'rgba(54, 162, 235, 1)',
                    'rgba(255, 206, 86, 1)',
                    'rgba(75, 192, 192, 1)',
                    'rgba(153, 102, 255, 1)',
                    'rgba(255, 159, 64, 1)'
                ],
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                y: {
                    beginAtZero: true
                }
            }
        }
    });
    </script>
</body>
</html>

run on the following firefox version image get following error: image this code run on the windows edge is ok. image

Current behavior

image

Reproducible sample

code in "Expected behavior"

Optional extra steps/info to reproduce

No response

Possible solution

No response

Context

No response

chart.js version

https://cdn.jsdelivr.net/npm/chart.js

Browser name and version

60.8.0esr (64-bit)

Link to your project

No response

LeeLenaleee commented 1 week ago

Firefox 60.8.0esr is 5 years old, as stated here all modern and updated browsers are supported. If I try to run the code in a updated version of firefox (127.0.1) it works fine.

The fix here is to update your browser to a more up to date version

JakodYuan commented 6 days ago

Thank you for your reply. After updating the latest firefox browser, the code works fine!