Я не знаю, если его слишком много, чтобы спросить в стеке, но я просто так измучен и разочарован своей собственной способностью. Я делал эту диаграмму, как 3 месяца, и не был успешным. Я всегда пытаюсь снова составить диаграмму Google. м с просьбой о помощи там.
У меня есть мой liveata.php(time_stamp (named ts), ph, wet - значения данных в моей базе данных) в json формате, показывающем:
[{ "TS": "12", "Ph": 736, "влажный": 92}, { "TS": "27", "Ph": 0, "влажный": 0}, { "ц": "21", "ph": 192, "влажный": 24}, { "TS": "15", "ph": 0, "влажный": 0}]
то есть "ts" (отметка времени ("d")) показывает конкретный день месяца (этот пример месяц август). "ph" и "влажность" являются общей стоимостью этого конкретного дня. Очевидно, что я делаю чарты здесь, и я знаю, что я немой полный амбиций. Я пытаюсь создать живой график, который выглядит так
Теперь моя проблема с этим кодом ниже, который я нашел, который работает на их примере, но попытка моего php json терпит неудачу.
функция drawChart() {
var jsonData = $.ajax({ url: 'livedata.php', dataType: 'json', async: false }).done(function (results) { var data = new google.visualization.DataTable(jsonData); data.addColumn('datetime', 'time_stamp'); data.addColumn('number', 'ph'); data.addColumn('number', 'moist'); $.each(results, function (i, row) { data.addRow([ (new Date(row.time_stamp)), parseFloat(row.ph), parseFloat(row.moist) ]); }); var chart = new google.visualization.LineChart($('#chart').get(0)); chart.draw(data, { title: 'Soil Analysis' }); }); } // load chart lib google.load('visualization', '1', { packages: ['corechart'] }); // call drawChart once google charts is loaded google.setOnLoadCallback(drawChart);
здесь есть несколько вопросов, я постараюсь помочь...
для начала используйте текущую версию графиков Google...
используйте это → <script src="https://www.gstatic.com/charts/loader.js"></script>
jsapi
- это старая версия...
не это → <script src="https://www.google.com/jsapi"></script>
это изменит только оператор load
google.charts.load('current', {
callback: drawChart,
packages: ['corechart']
});
как для ajax async: false
устарел, удалите его...
next, contructor для таблицы данных принимает только данные json в определенном формате
найдено здесь → Формат конструктора JavaScript Литеральные данные Параметр
просто оставьте аргумент пустым
var data = new google.visualization.DataTable();
наконец, опубликованный json-пример не содержит свойства для time_stamp
выглядит как ts
вместо этого, вы можете попробовать использовать текущий месяц вместо этого
рекомендуем что-то похожее на следующее...
google.charts.load('current', {
callback: drawChart,
packages: ['corechart']
});
function drawChart() {
$.ajax({
url: 'livedata.php',
dataType: 'json'
}).done(function (results) {
var data = new google.visualization.DataTable();
data.addColumn('date', 'time_stamp');
data.addColumn('number', 'ph');
data.addColumn('number', 'moist');
$.each(results, function (i, row) {
var today = new Date();
data.addRow([
new Date(today.getFullYear(), today.getMonth(), row.ts),
parseFloat(row.ph),
parseFloat(row.moist)
]);
});
var chart = new google.visualization.LineChart($('#chart').get(0));
chart.draw(data, {
title: 'Soil Analysis'
});
});
}