Chart.js PHP База данных не отображается

Question

В моем текущем проекте я хочу использовать Chart.js для отображения определенных данных из базы данных.Теперь у меня проблема в том, что мне не дают никаких данных, вместо этого я всегда получаю сообщение об ошибке «$ is not function» в Chrome.Я уже попробовал некоторые вещи, к сожалению, безуспешно.Я также включил последнюю версию JQuery в начало моих сценариев JS.

Значения моей базы данных MySQL, которые я получаю с помощью сценария PHP, который представлен в JSON.Там я получаю все данные.

Мой JS-скрипт вызывает:

<script src="vendors/jquery/dist/jquery.min.js"></script>
<script src="vendors/popper.js/dist/umd/popper.min.js"></script>
<script src="vendors/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/admin.js"></script>

<script src="vendors/chart.js/dist/Chart.bundle.min.js"></script>
<script src="assets/js/statistics/show-all-views.js"></script>

Мой код Chart.js:

$(document).ready(function() {
    $.ajax({
        url: "http://localhost/fitnesslaeufer_cms/admin/includes/statistics/charts-data/show-all-views.php",
        method: "GET",
        success: function(data) {
            console.log(data);
            var views = [];

            for(var i in data) {
                views.push(data[i].score);
            }

            var ctx = document.getElementById("monthlyViews");
            ctx.height = 50;
            var myChart = new Chart(ctx, {

                type: 'line',
                data: {
                       labels: ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"],
                       datasets: [ 
                           {
                              label: "My First dataset",
                              borderColor: "rgba(0,0,0,.09)",
                              borderWidth: "1",
                              backgroundColor: "rgba(0,0,0,.07)",
                              data: views
                           }
                      ] ........

Answer 1

Используйте jQuery для своего документа и заставьте sur передать $ в обратном вызове.

  jQuery(document).ready(function($) {
      // Your code here
  });