jquery Flot从经典的ASP数据库

问题描述：

我已经下载了Flot library，并一直玩。jquery Flot从经典的ASP数据库

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

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

我使用传统的ASP从数据库中提取数据。

答

有几件事你必须看看。第一个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！例如，确保最后一个，不会打印等。

现在，this link有一些使用AJAX加载数据并更新图形的示例。因此，您必须修改URL以指向生成JSON字符串的asp页面，并修改onDataRecieved函数以根据您自己的结构添加数据。

我希望这会有所帮助。

答

我不确定动态是否意味着“实时更新”（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>

jquery Flot从经典的ASP数据库

相关推荐