Question

我想使用flot和mysql绘制图形但发生异常

访问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>

这段代码有什么问题？接下来我想绘制一个轴是时间图。

Answer 1

 $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);

以上将消除逗号分离的问题（从我所知，你从未解决过）。

接下来，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，则假设所有设置名称。

另请注意，我将脚本从html中删除并将其放在jquery window.onload语法中：$(function () {。这将成为你的html的主管。

据我所知，你并不真正需要ajax，因为你没有定义任何会触发$ .ajax函数的事件。当您可以将脚本放入加载页面的相同脚本时，看起来您正在使用ajax来调用脚本，例如：

 <?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.

Answer 2

首先，您使用PHP代码创建的JavaScript列表看起来并不是用逗号分隔符分隔每个数据点列表项。

根据jQuery $.ajax documentation，传递给success函数的第一个参数是从服务器返回的数据，根据'dataType'参数格式化。您尚未提供dataType参数。文档说，如果没有指定dataType，它将智能地将responseXML或responseText传递给成功回调，基于响应的MIME类型。

我猜测传递给plot函数的数据是一个普通的旧字符串，而不是Flot所期望的JavaScript列表对象。在dataType: 'json'电话中添加$.ajax选项应该可以解决此问题。

Answer 3

你要输出的是php端的json文档，它将被直接解析为java脚本数组（由jquery等库手动或自动解析）

因此无需在php中打印json，而是可以轻松地将数据输入到php数组中，并使用json_encode函数轻松将其转换为json字符串。

一个小例子可能有所帮助你试图输出

echo“[”。$ result ['msgCount']。“，”。$ result ['From_user']。“]”。“\ n”;

在java script [] = array中，你在数组中创建[[]] = array。但是当数组很大时，在php中回显很麻烦。我们做什么。数组结构在php中类似。您需要将数据添加到php中作为“数组内部数组” 例如：php array（array（1,2,3））= [[1,2,3]]。如何将它映射到json？

容易==＆GT; echo json_encode（array（array（1,2,3））;

干杯

用flot绘制Graph

3 个答案: