Я столкнулся с новой проблемой относительно оси x. Мое намерение состояло в том, чтобы вывести ось x, которая указывает время, в то время как ось y указывает мощность. Я решил использовать time[i] и использовать graph.push([time[i], power[i]) . Однако мой график остается пустым. Я сделал предупреждение для функции вывода, и это было результатом:
({1:"14:36", 2:"14:39", 3:"14:42", 4:"14:45", 5:"14:48", 6:"14:51", 7:"14:54", 8:"14:57"})
Это hour: mins . Что я должен изменить, чтобы получить ось X времени?
$(function () { var graph = []; var power = <?php echo json_encode($data);?>; var time = <?php echo json_encode($times);?>; var row = <?php echo json_encode($nrow);?>; //alert(time.toSource()); for (var i = 1; i < row; i += 1) { //var test = time[i]; //alert(test); graph.push([time[i], power[i]]); } var plot = $.plot($("#placeholder"), [ { data: graph, label: "Power" } ], { series: { lines: { show: true }, points: { show: true } }, grid: { hoverable: true, clickable: true }, yaxis: { min: 0, max: 25 } });
Вы должны конвертировать время с часа: mins to number
for (var i = 1; i < row; i += 1) { //var test = time[i]; //alert(test); var hhmm = time[i].split(":"); var hh = parseInt(hhmm[0]); var mm = parseInt(hhmm[1])/60; var tt = hh + mm; graph.push([tt, power[i]]); }
EDIT (Евгений Вонг):
// var options = {// xaxis: {ticks: [[1, time [1]], [2, time [2]], [3, time [3]], [4, time [4]], [5, время [5]], [6, время [6]], [7, время [7]], [8, время [8]]]} //}; // оповещения (options.toSource ());
var plot = $.plot($("#placeholder"), [ { data: graph, label: "Power" } ], { series: { lines: { show: true }, points: { show: true } }, grid: { hoverable: true, clickable: true }, yaxis: { min: 0, max: 25 }, xaxis: { mode: "time", timeformat:"%hh:%mm" } //xaxis: { ticks:[[1,time[1]],[2,time[2]],[3,time[3]],[4,time[4]],[5,time[5]],[6,time[6]],[7,time[7]],[8,time[8]]]} });
EDIT (Diode):
Несмотря на то, что я создал временные диаграммы раньше, это время, когда настройка x-axis конфигурации не работала. Во всяком случае, я исправил это, добавив функцию tick tickter. См. Код ниже. «graph» – это массив данных выборки, который я использовал.
var graph = [[14.5, 10], [16.45, 15], [18.45, 20]]; var plot = $.plot($("#placeholder"), [ { data: graph, label: "Power" } ], { series: { lines: { show: true }, points: { show: true } }, grid: { hoverable: true, clickable: true }, yaxis: { min: 0, max: 25 }, xaxis: { min:14, max:20, tickSize:0.5, tickFormatter: function(value){ var hours = Math.floor(value); hours = (hours < 10)?"0"+hours:hours; var minutes = (value - hours) * 60; minutes = (minutes < 10)?"0"+minutes:minutes; return hours + ":" + minutes; } } });
Попросите PHP вывести метку времени Javascript вместо уже отформатированной даты / времени. Просто запомните несколько предостережений о отметках времени:
Не забудьте указать xaxis: { mode: "time" } в параметрах вашего флота.