我对谷歌图表非常陌生，我似乎无法在我的代码中找到问题:
我的 php 文件返回:
{"cols":[{"id":"","label":"Time","type":"string"},{"id":"","label":"Max","type":"number"},{"id":"","label":"Average","type":"number"}],"rows":[[{"c":[{"v":"2013-11-19 14:38:00"},{"v":2576},{"v":2144}]},{"c":[{"v":"2013-11-19 14:39:00"},{"v":1960},{"v":1682}]},{"c":[{"v":"2013-11-19 14:40:00"},{"v":1789},{"v":1565}]},{"c":[{"v":"2013-11-19 14:41:00"},{"v":1995},{"v":1654}]},{"c":[{"v":"2013-11-19 14:42:00"},{"v":14647},{"v":11638}]},{"c":[{"v":"2013-11-19 14:43:00"},{"v":7512},{"v":5202}]},{"c":[{"v":"2013-11-19 14:44:00"},{"v":2056},{"v":1681}]},{"c":[{"v":"2013-11-19 14:45:00"},{"v":1874},{"v":1524}]},{"c":[{"v":"2013-11-19 14:46:00"},{"v":1706},{"v":1385}]},{"c":[{"v":"2013-11-19 14:47:00"},{"v":2244},{"v":1667}]},{"c":[{"v":"2013-11-19 14:48:00"},{"v":16198},{"v":13145}]},{"c":[{"v":"2013-11-19 14:49:00"},{"v":17549},{"v":13886}]},{"c":[{"v":"2013-11-19 14:50:00"},{"v":1824},{"v":1513}]},{"c":[{"v":"2013-11-19 14:51:00"},{"v":2299},{"v":1762}]},{"c":[{"v":"2013-11-19 14:52:00"},{"v":20273},{"v":13167}]},{"c":[{"v":"2013-11-19 14:53:00"},{"v":3024},{"v":2231}]},{"c":[{"v":"2013-11-19 14:54:00"},{"v":14386},{"v":10450}]},{"c":[{"v":"2013-11-19 14:55:00"},{"v":16368},{"v":13741}]},{"c":[{"v":"2013-11-19 14:56:00"},{"v":4528},{"v":2717}]},{"c":[{"v":"2013-11-19 14:57:00"},{"v":3655},{"v":2601}]},{"c":[{"v":"2013-11-19 14:58:00"},{"v":3456},{"v":2624}]},{"c":[{"v":"2013-11-19 14:59:00"},{"v":4818},{"v":2917}]}]]}
我想绘制一个图表，在 x 上绘制时间，然后绘制两 strip 有最大值和平均值的线。
我相信问题出在我的 HTML/JAVASCRIPT 代码中。
<html>
<head>
<title>Dashboard</title><meta name=keywords /><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script><script type="text/javascript" src="https://www.google.com/jsapi"></script><meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<!---->
<style type="text/css">
body { background-color: #ffffff; padding-left: 1%; padding-bottom: 100px; }
footer{font-size:small;position:fixed;right:5px;bottom:5px;}
</style>
<style>h1 {color:white; font-size:24pt; text-align:center;font-family:arial,sans-serif }.menu {color:white; font-size:12pt; text-align:center;font-family:arial,sans-serif; font-weight:bold }table2 {background:black }p {color:black; font-size:12pt; text-align:justify;font-family:arial,sans-serif }p.foot {color:white; font-size:9pt; text-align:center;font-family:arial,sans-serif; font-weight:bold }a:link, a:visited, a:active {color:white}
</style>
</head>
<body>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load("visualization", "1", {"packages":["corechart"]});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
function drawChart() {
$.ajax({
url: "get_sql_data.php",
dataType: "json",
success: function (jsonData) {
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(jsonData);
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.LineChart(document.getElementById("chart_div"));
chart.draw(data, {width: 400, height: 240});
}
});
}
</script>
<!--this is the div that will hold the pie chart-->
<div id="chart_div"></div><table width=100% bgcolor=black cellpaddin g=0 border=0>
</body>
最佳答案
您的 json 数据格式似乎错误。 cols 没问题:
{
"cols":
[
{
"id":"", "label":"Time",
"type":"string"
},
rows 有一对额外的 [ ... ] 应删除:
"rows":
[
[
{
"c":[
{"v":"2013-11-19 14:38:00"},
{"v":2576},
{"v":2144}
]
},
获取
"rows":
[
{
"c":[
{"v":"2013-11-19 14:38:00"},
{"v":2576},
{"v":2144}
]
},
关于javascript - Google 图表获取 this.J[a].c 时出现问题未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20211954/