Liaison tableau de données à google charts

Je dois utiliser Google Maps dans mon projet. Je dois implémenter C# et asp. Net pour le faire mais j'ai aussi essayé le script java mais la sortie n'est pas ce que je voulais. Est-ce que quelqu'un peut m'aider avec ça?Liaison tableau de données à google charts

Source

2012-03-05 Rahul Ranjan

Pour utiliser Google Chart vous devez utiliser l'appel ajax pour obtenir des données à partir des données et de se lier là dans le fichier ASPX

Source

2012-03-05 09:47:49

pouvez-vous s'il vous plaît expliquer ce que vous avez dit? –

Ici, il est plein de didacticiels:

http://code.google.com/intl/es-ES/apis/chart/

Il est vraiment plein de code de comment faire google-charts fonctionnent. Estimalement, ce que vous avez à faire est dinamically créer les données pour appeler l'API avec vos données.

Voyons voir un exemple de Google-Charts:

<html> 
    <head> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     google.load("visualization", "1", {packages:["corechart"]}); 
     google.setOnLoadCallback(drawChart); 
     function drawChart() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Year'); 
     data.addColumn('number', 'Sales'); 
     data.addColumn('number', 'Expenses'); 
     data.addRows([ 
      ['2004', 1000, 400], 
      ['2005', 1170, 460], 
      ['2006', 660, 1120], 
      ['2007', 1030, 540] 
     ]); 

     var options = { 
      title: 'Company Performance', 
      hAxis: {title: 'Year', titleTextStyle: {color: 'red'}} 
     }; 

     var chart = new google.visualization.AreaChart(document.getElementById('chart_div')); 
     chart.draw(data, options); 
     } 
    </script> 
    </head> 
    <body> 
    <div id="chart_div" style="width: 900px; height: 500px;"></div> 
    </body> 
</html>

Avec cela, il vous suffit d'utiliser une boucle avec ASP/C#/... pour créer les données dans data.addRows()

Si nous avons affaire C#, je suggère d'utiliser ceci: http://code.google.com/p/googlechartsharp/

ici vous avez un exemple de base:

using GoogleChartSharp; 

int[] data = new int[] { 0, 10, 20, 30, 40 }; 
LineChart chart = new LineChart(150, 150); 
chart.SetData(data); 
string url = chart.GetUrl();

Cependant, et comme vous Insistez sur la façon de fournir les données, je crains que vous allez créer votre propre algorithme pour fournir les données (il suffit de remplir un vecteur avec les valeurs que vous voulez)

Source

2012-03-05 09:59:32 ArcDare

J'ai déjà essayé, mais le fait est que j'en ai besoin dans un scénario différent. Dites par exemple, une table qui est déjà présente dans ma base de données et je veux lier cette table à l'un des graphiques google. –

Vous l'avez fait via javascript, mais je dois le faire en utilisant C# –

Là, vous avez un bon lien;) – ArcDare

Oui, vous pouvez utiliser Google Chart en utilisant C#:

string strCon2=ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString; 

SqlConnection con2 = new SqlConnection(strCon2); 

SqlDataAdapter da = new SqlDataAdapter("SELECT result,date_time FROM read_master WHERE user_id =" + Session["user_id"]+"ORDER BY date_time ASC", con2); 

DataTable dt = new DataTable(); 
try 
{ 

    da.Fill(dt); 

    //data.addColumn('string'(datatype), 'Year'(columnname according to the sql table)); 
    //data.addColumn('number'(datatype), 'Sales'(columnname according to the sql table)); 
    //data.addColumn('date'(datatype), 'Date'(columnname according to the sql table)); 

    str.Append(@"<script type=text/javascript> google.load(*visualization*, *1*, {packages:[*corechart*]}); //You can replace "corechart" to any other package of Google charts like For "Google Table" use "table" 

    google.setOnLoadCallback(drawLineChart); 
    function drawLineChart() { 
     var data = new google.visualization.DataTable(); 

     data.addColumn('date', 'Date Time'); 
     data.addColumn('number', 'Result'); 

     data.addRows(" + dt.Rows.Count + ");"); 

     Int32 i=0; 
     //here i am using for loop to fetch multiple recorod from the database 

     for (i = 0; i <= dt.Rows.Count - 1; i++) 
     { 

      str.Append("data.setValue(" + i + "," + 1 + "," + dt.Rows[i]["result"].ToString() + ");"); 

      DateTime cDate = DateTime.ParseExact(dt.Rows[i]["date_time"].ToString(), "dd-MM-yyyy tt hh:mm:ss", CultureInfo.InvariantCulture); 

      str.Append(" data.setValue(" + i + "," + 0 + ",new Date(" + cDate.Year.ToString() + "," + (cDate.Month-1).ToString() + "," + cDate.Day.ToString() + "," + cDate.Hour.ToString() + "," + cDate.Minute.ToString() + "," + cDate.Second.ToString() + "));"); 
     } 

     // To display LineChart in your project use "google.visualization.'LineChart'". 
     // And to display PieChart or Google DataTable, change to 
     // "google.visualization.'Piechart'" or "'google.visualization.'Table'" accordingly. 

     str.Append(" var chart = new google.visualization.LineChart(document.getElementById('LineChartDiv'));"); 
     // in the below line you can set width height of the chart according to your need 
     str.Append(" chart.draw(data, {width: 1200, height: 500, title: 'Your Glucodata',"); 
     // str.Append(" var chart = new google.visualization.BarChart(document.getElementById('chart_div'));"); 
     str.Append("vAxis: {title: 'Result', titleTextStyle: {color: 'green'}}"); 
     str.Append(",hAxis: {format: 'dd MMM,yyyy'}"); 
     str.Append("}); }"); 
     str.Append("</script>"); 
     ltLineChart.Text = str.ToString().TrimEnd(',').Replace('*', '"'); 
     con2.Close(); 
    }

Source

2013-04-10 06:41:25

Liaison tableau de données à google charts

Répondre

Questions connexes