Chartjs-Charts.js in Django: Charts cannot appear

0👍

In case charts js requires jquery put it on top.

    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- semantic UI -->
    <link rel="stylesheet" type='text/css' href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.14/semantic.min.css">


<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <!--Chart js-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.4.1/chart.min.js" integrity="sha512-5vwN8yor2fFT9pgPS9p9R7AszYaNn0LkQElTXIsZFCL7ucT8zDCAqlQXDdaqgA1mZP47hdvztBMsIoFxq/FyyQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <!-- jQuery -->
    <title>{% block title %}{% endblock title %}</title>
  </head>

Also make sure in network tab of chrome that the requests you make are responding with 200. eg
enter image description here

Then inside your js code make sure you have jquery running:

<script>
$(document).ready(function(){ console.log(123); })
</script>

Otherwise you can just you use native js instead eg: $(document).ready equivalent without jQuery
because since you have in console $ not defined your problem is jquery

Leave a comment