用浮点图 [英] plotting Graph with flot
问题描述
我想使用flot和mysql绘制图形,但是发生异常
I want to plot graph using flot and mysql but an exception occurs
getData.php
getData.php
$sql = mysql_query("SELECT count(Msg_ID) as msgCount,From_user
FROM Messages
GROUP BY From_user");
echo "[";
while($result = mysql_fetch_array($sql))
{
//print_r($result);
echo "[".$result['msgCount'].",".$result['From_user']."]"."\n";
}
echo "]";
用于绘图
<div id="plotarea" style="width:600px;height:300px;">
<script type="text/javascript">
var options = {
lines: { show: true },
points: { show: true },
xaxis: { min:0,max:5 },
yaxis: { min:1 ,max:60},
};
$.ajax({
url:"getData.php",
type:"post",
success:function(data)
{
alert(data);
$.plot($("#plotarea"),data,options);
//alert(data);
}
})
</script>
</div>
此代码有什么问题? 接下来,我想用轴之一是时间来绘制图.
What is wrong with this code? Next I want to plot graph with one of the axis is time.
推荐答案
$sql = mysql_query("SELECT count(Msg_ID) as msgCount,From_user
FROM Messages
GROUP BY From_user");
while($result = mysql_fetch_array($sql))
{
$user_data[] = array($result['msgCount'],$result['From_user']);
}
echo json_encode($user_data);
以上内容将消除逗号分隔的问题(据我所知,您从未解决过).
The above will eliminate issues with comma separation (which, from what I can tell, you never resolved).
接下来,javascript:
Next, the javascript:
<script type="text/javascript">
$(function () {
var options = {
lines: { show: true },
points: { show: true },
xaxis: { min:0,max:5 },
yaxis: { min:1 ,max:60},
};
$.get("getData.php", function(data){
$.plot($("#plotarea"),data,options);
},
json);
});
</script>
请注意,我没有将$.ajax
更改为$.get
,因为您没有将任何数据从页面传递到脚本,因此无需发布.如果使用$.get
,则假定所有设置名称.
Notice that I changed $.ajax
to $.get
, since you weren't passing any data from the page to the script, a post is not necessary. And if you use $.get
, all of the setting names are assumed.
还要注意,我从html中提取了脚本并将其放入jquery window.onload
语法:$(function () {
中.这将放在您的html的头部.
Also notice that I pulled the script out of the html and put it within the jquery window.onload
syntax : $(function () {
. This would go in the head of your html.
据我所知,您实际上并不需要ajax,因为您没有定义任何会触发$ .ajax函数的事件.只需将脚本放入加载页面的同一脚本中,就好像您正在使用ajax来调用脚本一样,
From what I can tell, you aren't really in need of ajax, since you didn't define any sort of event that would trigger the $.ajax function. It looks like you are using ajax to call a script when you could just put the script into the same script that loads the page, like:
<?php
$sql = mysql_query("SELECT count(Msg_ID) as msgCount,From_user
FROM Messages
GROUP BY From_user");
while($result = mysql_fetch_array($sql))
{
$user_data[] = array($result['msgCount'],$result['From_user']);
}
?>
<script type="text/javascript">
$(function () {
var options = {
lines: { show: true },
points: { show: true },
xaxis: { min:0,max:5 },
yaxis: { min:1 ,max:60},
};
var userposts = <?php echo json_encode($user_data); ?>;
$.plot($("#plotarea"),userposts,options);
</script>
<style type="text/css">
#plotarea {
width: 600px, height: 300px;
}
</style>
</head>
<body>
.....//Put whatever before the div
<div id="plotarea"></div>
.....//Finish up the page.
这篇关于用浮点图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!