'Chartjs is not showing charts in my Django project

I am trying to visualize data in my Django project using Chartjs. right now I'm only concerned with the visualize part and not the backend stuff but for some strange reason the charts refuses to display even though I took the boilerplate directly from the website just to display it before manipulating it.

<div id="chart_div" class="option-chart">
            <canvas id="myChart" width="648" height="495"></canvas>
          </div> 
          <script>
            const ctx = document.getElementById('myChart');
            const myChart = {
                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>

As you can see from the code above. its boilerplate but I just cant get it to visualize.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source