2

我已经下载了Flot 库并且一直在玩。

我了解 Flot 库的工作原理以及如何绘制简单的图形。我正在努力解决的问题是从数据库中提取数据并将其传递到 Flot Graph 中，以便该图根据检索到的数据变得动态。

我相信您可以使用 JSON 函数将数据从数据库传递到 Flot Graph，但我不知道从哪里开始，有人可以帮我吗？任何示例代码或建议将不胜感激

我正在使用经典的 ASP 从数据库中提取数据。

4

2 回答 2

4

我不确定动态是否是指“实时更新”（AJAX）。如果不是这种情况，那么下面的示例应该可以帮助您开始使用 flot 和经典 ASP： 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Example</title>
    <!--[if IE]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]-->
    <script language="javascript" type="text/javascript" src="jquery.js"></script>
    <script language="javascript" type="text/javascript" src="jquery.flot.js"></script>
</head>

<body>

    <div id="placeholder" style="width:600px;height:300px;"></div>

    <script id="source" language="javascript" type="text/javascript">
    $(function () {
        var d1 = [];

        <%
            SET ac = Server.CreateObject("ADODB.Connection") 

            ac.Open "driver={sql server}; server=localhost; database=db_name; uid=user; pwd=secret" 

            SET rs = Server.CreateObject("ADODB.Recordset") 
            SET rs = ac.Execute("SELECT data_x, data_y FROM data_log") 

            FOR EACH field IN rs.Fields    
               Response.Write "d1.push([" & field.data_x & ", " & field.data_y & "]);"    
            NEXT
        %>

        $.plot($("#placeholder"), [d1]);
    });
    </script>

</body>
</html>
于 2009-12-17T21:23:37.203 回答
2

有几件事你必须看。第一个 JSON。您需要知道 JSON 字符串的结构。例如，您可以像这样创建一个 JSON 字符串：

 {"name":"Tom", "sales":200}

或者，如果有很多名称和销售额，则使用这样的数组：

{"names":["Tom", "Harry"], "sales":[200, 100]}

然后在 JavScript 中访问这些值...假设您有这样的 JSON 对象：

var myJSON = {"names":["Tom", "Harry"], "sales":[200, 100]};
document.write(myJSON.names[0]); //print out Tom
document.write(myJSON.sales[0]); //200

由于您想使用 AJAX 来获取此 JSON 对象，因此您可以创建一个 ASP 页面，该页面仅以正确的格式返回一个 JSON 字符串。例如：

 Set rs = Conn.Execute("SELECT name, sales FROM employees")
 If Not rs.EOF Then
  Response.Write "{'names':["   
  Do Until rs.EOF
    Response.Write rs("name")
    Response.Write ","
    rs.MoveNext
  Loop
  rs.Close : Set rs = Nothing : Conn.Close : Set Conn = Nothing 
  Response.Write "]}"
%>

免责声明：这不是经过测试的代码，我已经快 10 年没有写过经典的 ASP 了！例如，确保不打印 final 等。

现在，这个链接有一些使用 AJAX 加载数据和更新图表的示例。所以你必须修改 URL 指向你生成 JSON 字符串的 asp 页面，并修改 onDataRecieved 函数以根据你自己的结构添加数据。

希望这会有帮助。

于 2009-12-17T21:23:17.667 回答