Javascript jqPlot未正确显示轴的AJAX调用
我有一个AJAX函数,它调用数据库中的记录列表。然后,我尝试使用jqPlot来显示表上的某些行,x轴是记录的时间戳,y轴是心率(hr) 对jqPlot函数的调用在AJAX调用成功时进行,如下所示:Javascript jqPlot未正确显示轴的AJAX调用,javascript,jquery,jqplot,Javascript,Jquery,Jqplot,我有一个AJAX函数,它调用数据库中的记录列表。然后,我尝试使用jqPlot来显示表上的某些行,x轴是记录的时间戳,y轴是心率(hr) 对jqPlot函数的调用在AJAX调用成功时进行,如下所示: success: function(data) { if(data.moves) { $('#records').html(''); var html = "";
success: function(data) {
if(data.moves) {
$('#records').html('');
var html = "";
var dataarray = [];
html += "<table>";
$.each(data.moves, function(k, v) {
dataarray.push([v.timestamp, v.hr]);
html += "<tr>";
html += "<td>" + v.hr + "</td>";
html += "<td>" + v.time + "</td>";
html += "<td>" + v.title + "</td>";
html += "<td>" + v.zone + "</td>";
html += "</tr>";
});
html += "</table>";
$('.records').html(html);
var plot1 = $.jqplot('records', [dataarray], {
title: 'Heart Rate for this move',
axesDefaults: {
min: 0,
max: 200
},
axes: {
xaxis: {
label: "Time",
pad: 0,
renderer: $.jqplot.DateAxisRenderer,
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
tickOptions: {
formatString: '%H:%M',
angle: -45
}
},
yaxis: {
label: "Heart Rate"
}
}
});
}
}
不幸的是,这似乎不起作用,我不知道为什么。这就是我得到的:
如您所见,绘图未显示,x轴未显示正确的时间范围。
我以前没有真正使用过jqPlot,所以似乎无法调试这个。有人知道我哪里出错了吗?
谢谢好的,多亏了一些检查dataarray输出的建议,我已经成功地将其排序了。 基本上,UNIX时间戳以秒为单位,Javascript时间戳以毫秒为单位,因此我需要将时间戳从UNIX时间戳转换为Javascript,以便正确读取日期。
希望这对其他人有帮助 有几个问题:1-您是否使用示例数据对此进行了测试,2-您是否从您的查询中获得了一些真实的JSON数据,即
[dataarray]
中的内容?您好,我已经尝试使用示例数据,我遇到了一个问题,即时间在每个刻度上都会重复。下面是dataarray=[[1353438096,“64”],[1353438106,“66”],[1353438116,“71”],[1353438492,“60”],[1353438502,“66”]中的数据示例在JFIDLE上进行实验后,我注意到这是一个时间戳末尾缺少三个尾随零的问题。为什么会发生这种情况?
$moves = $this->myzone_model->getUsersMoves($options);
$moves_arr = array();
foreach($moves as $move) {
$timestamp = strtotime($move['time']);
$moves_arr[] = array(
'myzone_user_hr_records_id' => $move['myzone_user_hr_records_id'],
'GUID' => $move['GUID'],
'hr' => $move['hr'],
'time' => $move['time'],
'timestamp' => $timestamp,
'title' => $move['title'],
'maxHR' => $move['maxHR'],
'zone' => $move['zone']
);
}
$json = array('moves' => $moves_arr);