Проблема цикла Chart.js, PHP и JSON

0

Я пытаюсь создать панель мониторинга, которая покажет некоторые данные из базы данных. Прямо сейчас я использую отдельный JSON-кодированный файл с именем "data.php". Я использую запрос JQuery Ajax для этих данных, чтобы заполнить диаграмму Chart.js.

Я также следовал примеру, подобному этому

На данный момент я сталкиваюсь с проблемой, рассматриваемой здесь в файле app.js:

$(document).ready(function(){
    $.ajax({
        url: "http://{redacted ip}/swordtest/data.php",
        method: "GET",
        success: function(data) {

            //var myData = $.parseJSON(data);
            console.log(data);
            var teamid = [];
            var teamName = [];
            var  ticketCount = [];

            for (var i in data) {
                teamid.push("ID " + data[i].id);
                teamName.push(data[i].name);
                ticketCount.push(data[i].count);
            }

            console.log(data);

            var chartData = {
                lables: teamName,
                datasets: [
                    {
                        label : 'Teams',
                        backgroundColor: 'rgba(200, 200, 200, 0.75)',
                        borderColor: 'rgba(200, 200, 200, 0.75)',
                        hoverBackgroundColor: 'rgba(200, 200, 200, 0.75, 1)',
                        hoverborderColor: 'rgba(200, 200, 200, 0.75, 1)',
                        data: ticketCount
                    }
                ] 
            };

            var ctx = $("#mycanvas");


            var myDoughnutChart = new Chart(ctx, {
                type: 'bar',
                data: chartData
            });

        }, 
        error: function(data) {
            console.log(data);
        }
    });
});

Однако происходит то, что, когда я пытаюсь выполнить цикл через объект JSON для разделения идентификаторов, имен команд и количества билетов, он будет непрерывно перебирать идентификатор и давать мне следующее:

teamid = (1) ["ID undefined", "ID undefined"]

Он также добавит один и будет продолжать говорить неопределенно. Когда я помещал точки останова в код, кажется, что он только прокручивает идентификатор. Любая помощь будет принята с благодарностью. Спасибо!

ОБНОВЛЕНИЕ еще одна вещь, котор нужно упомянуть что данные которые я получаю от моего data.php немного по-разному смотря чем пример я работаю от (ссылка упомянутая выше). когда я печатаю данные, которые он приходит в этом формате:

data = "{"playerid":"1","score":"10"},{  "playerid":"2","score":"40"},{ "playerid":"3","score":"20"},{  "playerid":"4","score":"9"},{  "playerid":"5","score":"20"}"

Где в примере выглядит:

[{"playerid":"1","score":"10"},{  "playerid":"2","score":"40"},{ "playerid":"3","score":"20"},{  "playerid":"4","score":"9"},{  "playerid":"5","score":"20"}]

Разные с кронштейнами и без. У меня был друг, просто попробуйте вынуть двойные кавычки, заменив их одинарными кавычками и завернув весь JSON в скобки. Казалось, что он начал работать. Я предполагаю, что это имеет какое-то отношение к тому, как JSON форматируется в моем data.php.

  • 0
    Можете ли вы так, чтобы код для data.php, а также. В настоящее время я также создаю панель мониторинга с использованием Chartjs, поэтому недавно использовал ее именно для этой цели.
Теги:
chart.js

1 ответ

0
Лучший ответ

Попытайтесь добавить свойство dataType в литерал объекта, который является аргументом функции ajax(). Когда вы получаете JSON от PHP, свойство должно иметь значение "json".

$.ajax({
    url: "test.php",
    method: "GET",
    dataType: "json",
    success: function(data) {
         // ...
    },
    error: function(jqXHR, textStatus, errorThrown) {
      console.log("AJAX ERROR",textStatus,errorThrown,jqXHR);
    }
});

Я тестировал этот файл PHP.

test.php

<?php
  echo '[{"id":"1", "name":"John Doe", "count":"7"},{"id":"2", "name":"ABC", "count":"5"},{"id":"3", "name":"XYZ", "count":"29"}]';
?>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню