我对此失去了理智，无法弄清楚这个问题。我使用以下代码使用 morris.js 渲染图表，但不断收到“未捕获的类型错误：无法读取未定义的属性‘匹配’”错误。 javascript和php代码如下，我将php json输出到控制台并将其粘贴到此->在此输入链接描述 http://jsbin.com/uqawig/441/embed?javascript,live有用！但它不在我的代码中（我已经从使用示例和 jsbin 中很好地复制了它）
HTML
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.0/morris.js"></script>
<meta charset=utf-8 />
<title>Temperature Monitor</title>
</head>
<body>
<h3 style="text-align: center">Temperature Monitor</h3>
<div id="tempMonitor"></div>
<script src="aquaponics.charts.js"></script>
</body>
</html>
脚本语言
function getSensorData() {
var dataSet;
$.ajax({
type: "POST",
url: "sensor-data.php",
data: { waterTemperature: true },
async: false,
success: function(data) {
dataSet = data;
}
});
return dataSet;
}
var dataSet = getSensorData();
var chart = Morris.Line({
element: 'tempMonitor',
data: [0, 0],
xkey: 'datetime',
ykeys: ['temp_c'],
labels: ['Series A', 'Series B']
});
chart.setData(dataSet);
PHP（传感器数据.php）
<?php
require('app-config.php');
$limit = query_limit;
$stmt = $dbh->prepare('SELECT * FROM sensor_waterTemperature ORDER BY id DESC');
$stmt->execute();
echo json_encode($stmt->fetchAll(PDO::FETCH_ASSOC));
JSON 输出（来自sensor-data.php）
[{"id":"590","datetime":"2014-07-06 19:05:24","temp_c":"26.25","temp_f":"79.25"},{"id":"589","datetime":"2014-07-06 19:00:14","temp_c":"26.31","temp_f":"79.36"},{"id":"588","datetime":"2014-07-06 18:55:13","temp_c":"26.31","temp_f":"79.36"},{"id":"587","datetime":"2014-07-06 18:50:12","temp_c":"26.31","temp_f":"79.36"},{"id":"586","datetime":"2014-07-06 18:45:11","temp_c":"26.31","temp_f":"79.36"},{"id":"585","datetime":"2014-07-06 18:40:10","temp_c":"26.38","temp_f":"79.48"},{"id":"584","datetime":"2014-07-06 18:35:09","temp_c":"26.38","temp_f":"79.48"},{"id":"583","datetime":"2014-07-06 18:30:08","temp_c":"26.38","temp_f":"79.48"},{"id":"582","datetime":"2014-07-06 18:25:07","temp_c":"26.38","temp_f":"79.48"},{"id":"581","datetime":"2014-07-06 18:20:06","temp_c":"26.38","temp_f":"79.48"},{"id":"580","datetime":"2014-07-06 18:15:05","temp_c":"26.38","temp_f":"79.48"},{"id":"579","datetime":"2014-07-06 17:17:44","temp_c":"26.38","temp_f":"79.48"},{"id":"578","datetime":"2014-07-06 18:07:48","temp_c":"26.38","temp_f":"79.48"}]
UPDATE我做了更多调试，发现错误发生在 morris.js:598 上（见下文）。
Morris.parseDate = function(date) {
var isecs, m, msecs, n, o, offsetmins, p, q, r, ret, secs;
if (typeof date === 'number') {
return date;
}
m = date.match(/^(\d+) Q(\d)$/); **<<< RIGHT HERE**
n = date.match(/^(\d+)-(\d+)$/);
o = date.match(/^(\d+)-(\d+)-(\d+)$/);
UPDATE 2我也尝试过这个，并且出现同样的错误。
脚本语言
function getSensorData() {
$.ajax({
type: "POST",
url: "sensor-data.php",
data: { waterTemperature: true },
async: false,
success: function(data) {
Morris.Line({
element: 'tempMonitor',
data: data,
xkey: 'datetime',
ykeys: ['temp_c'],
labels: ['Series A', 'Series B']
});
}
});
}
getSensorData();
PHP
<?php
require('app-config.php');
$limit = query_limit;
$stmt = $dbh->prepare('SELECT * FROM sensor_waterTemperature ORDER BY id DESC');
$stmt->execute();
//echo json_encode($stmt->fetchAll(PDO::FETCH_ASSOC));
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
echo '{ datetime: \''.$row['datetime'].'\', temp_c: '.round($row['temp_c'], 2).' },';
}
