2009-12-17 10 views
2

j'ai téléchargé le Flot library et ont été avec un jeu autour.jquery Flot à partir d'une base de données dans ASP classique

Je comprends le fonctionnement de la bibliothèque Flot et comment dessiner des graphiques simples. Le bit avec lequel je me bats est de tirer des données d'une DB et de les passer dans un graphe de flot pour que le graphe devienne dynamique en fonction des données récupérées.

Je crois que vous pouvez transmettre des données à partir d'un DB dans un Flot graphique à l'aide d'une fonction de JSON, mais je ne sais pas par où commencer, quelqu'un pourrait me aider s'il vous plaît? Tout exemple de code ou des conseils seraient appréciés

J'utilise ASP classique pour extraire les données de la DB.

Répondre

2

Il y a plusieurs choses à regarder. Premier JSON. Vous devez connaître la structure de votre chaîne JSON. Par exemple, vous pouvez créer une chaîne JSON comme ceci:

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

Ou si elle est beaucoup de noms et des ventes puis utilisez un tableau comme celui-ci:

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

ensuite d'accéder à ces valeurs dans javscript ... supposons que vous aviez l'objet JSON comme ceci:

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

Puisque vous voulez utiliser AJAX pour obtenir cet objet JSON, vous pouvez créer une page ASP qui retourne simplement une chaîne JSON dans le format. Par exemple:

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 "]}" 
%> 

Clause de non-responsabilité: Ce code n'est pas testé, je n'ai pas écrit d'ASP classique depuis près de 10 ans! Par exemple, assurez-vous qu'une finale n'est pas imprimée, etc.

Maintenant, this link contient des exemples de chargement de données avec AJAX et de mise à jour du graphique. Vous devez donc modifier l'URL pour pointer vers votre page ASP qui génère la chaîne JSON et modifier la fonction onDataRecieved pour ajouter les données en fonction de votre propre structure.

J'espère que cela aide un peu.

4

Je ne sais pas si par dynamique vous dire « mis à jour en temps réel » (AJAX). Si ce n'est pas le cas, l'exemple suivant devrait vous aider à démarrer avec ASP et ASP classique:

<!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>