您好我正在创建一个Annotation Google Chart。我正确地从我的数据库中提取数据,但似乎无法避免图表中绘制的线条中断。我在我的数据库中插入了'null',它被拉为null。我已经对我的查询结果做了回应以确保这一点。但是,我还有休息时间。任何帮助都将非常感激。
有一个ajax函数从下拉中拉动$ q。这很有效。
以下是我正在使用的内容......
JS:
<script type='text/javascript' src='http://www.google.com/jsapi'></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1.1', {'packages':['annotationchart']});
google.setOnLoadCallback(drawChart);
function drawItems(num) {
var jsonData = $.ajax({
url: "getData.php",
data: "q="+num,
dataType:"json",
async: false
}).responseText;
// 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.AnnotationChart(document.getElementById('chart_div'));
var options = {
displayAnnotations: true,
};
chart.draw(data, options);
}
</script>
</head>
<body>
</body>
</html>
访问getdata.php:
<html>
<?php
$q=$_GET["q"];
$dbuser="user";
$dbname="db";
$dbpass="pass";
$dbserver="server";
$sql_query = "SELECT * FROM activityfield WHERE exercise_id = $q ORDER BY date DESC";
// Make a MySQL Connection
$con = mysql_connect($dbserver,$dbuser,$dbpass);
if (!$con){ die('Could not connect: ' . mysql_error()); }
mysql_select_db($dbname, $con);
$result = mysql_query($sql_query);
echo '{
"cols": [
{"id":"Date","label":"Date","type":"date"},
{"id":"","label":"Tonnage","type":"number"},
{"id":"","label":"Notes","type":"string"},
{"id":"","label":"Notes","type":"string"},
{"id":"","label":"Tonnage","type":"number"},
{"id":"","label":"Notes","type":"string"},
{"id":"","label":"Notes","type":"string"},
],
"rows": [ ';
$total_rows = mysql_num_rows($result);
$row_num = 0;
while($row = mysql_fetch_array($result)){
$row_num++;
if ($row_num == $total_rows)
{
echo '{"c":[';
echo '{"v":"Date(' .$row[date] .')"},';
echo '{"v":'. $row[tonnage] .',"f":null},';
echo '{"v":"'. $row[tonnage] .'"},';
echo '{"v":"null"},';
echo '{"v":'. $row[goal_tonnage] .'},';
echo '{"v":"Goals:' .$row[set1] .'lbs. x ' .$row[reps1] .'reps, '
.$row[set2] .' x ' .$row[reps2] .', '
.$row[set3] .' x ' .$row[reps3] .', '
.$row[set4] .' x ' .$row[reps4] .'"},';
echo '{"v":"This is the note that sayes what is going on here"},';
echo ']}, ';
} else {
echo '{"c":[';
echo '{"v":"Date(' .$row[date] .')"},';
echo '{"v":'. $row[tonnage] .',"f":null},';
echo '{"v":"'. $row[tonnage] .'"},';
echo '{"v":"null"},';
echo '{"v":'. $row[goal_tonnage] .'},';
echo '{"v":"Goals:' .$row[set1] .'lbs. x ' .$row[reps1] .'reps, '
.$row[set2] .' x ' .$row[reps2] .', '
.$row[set3] .' x ' .$row[reps3] .', '
.$row[set4] .' x ' .$row[reps4] .'"},';
echo '{"v":"'. $row[goal_tonnage] .'"},';
echo ']}, ';
}
}
echo " ] }";
?>
</html>
同样,空值拉得很好。谢谢!希望我已经包含了足够的细节。
编辑: 这是db查询的输出:
{ "cols": [ {"id":"Date","label":"Date","type":"date"}, {"id":"","label":"Tonnage","type":"number"}, {"id":"","label":"Tonnage","type":"number"}, ], "rows": [
{"c":[{"v":"Date(2014,04,20)"},{"v":40,"f":null},{"v":null},]},
{"c":[{"v":"Date(2014,04,19)"},{"v":null,"f":null},{"v":140},]},
{"c":[{"v":"Date(2014,04,16)"},{"v":110,"f":null},{"v":null},]},
{"c":[{"v":"Date(2014,04,15)"},{"v":50,"f":null},{"v":null},]},
{"c":[{"v":"Date(2014,04,13)"},{"v":85,"f":null},{"v":40},]},
{"c":[{"v":"Date(2014,04,10)"},{"v":75,"f":null},{"v":65},]},
{"c":[{"v":"Date(2014,03,31)"},{"v":65,},{"v":null},]}, ] }
图表的图片: