Блог

Как новичок, я борюсь с визуализацией Google для создания диаграмм из входных данных файла JSON. Я искал похожие вопросы, но не был уверен, что это поможет.

У меня есть набор данных в формате JSON. В настоящее время это статические данные, которые хранятся локально. Я хочу загрузить данные и визуализировать их с помощью Google visualization. Мои данные выглядят так:

      "rows":[{"Time":10:00:00,"Lat":53.02900044,"Long":7.44578671,"Altitude":57,"Speed":0,...}, {"Time": 11:00:00,"Lat":52.06000044,"Long":7.54578671,"Altitude":53,"Speed":12,...]}
 

Я стараюсь использовать этот способ:

     function init () {

var json3 = (function () {
    var json3 = [];
    $.ajax({
        'async': false,
        'global': false,
        'url': "Person3.json",
        'dataType': "json",
        'success': function (data3) {
            json3 = data3.rows;
        }
    });
    console.log("Number of message rows: "   json3.length);
    return json3;
})();
var readings3 = [];
if (json3.length > 0)
    var readings3 = json3;
    else
    readings3=[
        {"Time":"10:00:00 ","Lat":66.02794563,"Long":7.45527353,.....},
        {"Time":"13:40:52 ","Lat":66.16435456,"Long":7.98108809,......}
        ]
var data3 = new google.visualization.DataTable(readings3);

var graphview = new google.visualization.ChartWrapper({
    chartType: 'LineChart',
    containerId: 'visualization1',

    dataTable: data3,
options: {
        // chart options
    }
});

graphview.draw();    
}
google.load('visualization', '1', {packages:  ['corechart'], callback: init});
 

Может ли кто-нибудь помочь мне, чего здесь не хватает, или если вы видите, что подобные проблемы решаются.
Заранее спасибо…

Конструктор DataTable не примет объект с такой структурой; вам придется разобрать этот объект в DataTable вручную:

 var data3 = new google.visualization.DataTable();
data3.addColumn('timeofday', 'Time');
data3.addColumn('number', 'Lat');
data3.addColumn('number', 'Long');
//...
for (var i = 0; i < readings3.length; i  ) {
    var match = readings3[i].Time.match(/(d{2}):(d{2}):(d{2})/);
    var hours = parseInt(match[1], 10);
    var minutes = parseInt(match[2], 10);
    var seconds = parseInt(match[3], 10);
    data.addRow([[hours, minutes, seconds, 0], readings3[i].Lat, readings3[i].Long, /* ... */]);
}
 

Кроме того, в случае, если это не ошибка копирования / вставки, ваше время в строке JSON должно быть заключено в кавычки, поскольку "Time":10:00:00 оно недопустимо.