SQLサーバーデータを使用するハイチャート

Question

ハイチャートを使用し始めたばかりで、SQLサーバーデータベースから値をレンダリングする必要があります。

私はサーバサイド言語としてasp.netを使用してこれを行うための最良の方法は何ですか。

ありがとうございました 回答者のおかげで、少し進歩しています。しかし、xAxisカテゴリをデータベースから動的に取得することは困難であることが証明されています。ここでY軸データを移入し、グラフ上に正しくレンダリング

DataSet dsSeries = new DataSet(); 
     public string hidValues1; 
     public string hidXCategories1; 
     protected void Page_Load(object sender, EventArgs e) 
     { 

      if (!IsPostBack) 

      dsSeries=BindData(); 

      if (dsSeries == null) return; 

      foreach (DataRow dr in dsSeries.Tables[0].Rows) 
      { 
       hidXCategories1=hidXCategories1+ dr["symbol"].ToString()+","; 

      } 

      foreach (DataRow dr1 in dsSeries.Tables[0].Rows) 
      { 
       hidValues1=hidValues1+dr1["value"].ToString()+","; 

      } 


     } 

     public DataSet BindData() 
     { 
      string connString = ConfigurationManager.ConnectionStrings["Chartdata"].ToString(); 
      SqlConnection con = new SqlConnection(connString); 
      SqlCommand cmd = new SqlCommand(); 
      cmd.Connection = con; 
      cmd.CommandText = "SELECT symbol,value FROM Ticker"; 
      SqlDataAdapter da = new SqlDataAdapter(cmd); 
      try 
      { 
       DataSet ds = new DataSet(); 
       da.Fill(ds); 
       return ds; 

      } 
      catch (Exception ex) 
      { 
       throw ex; 
      } 
     } 
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script> 
     <script type="text/javascript" src="Scripts/highcharts.js"></script> 
     <script type="text/javascript" src="Scripts/exporting.js"></script> 
     <script type="text/javascript"> 

      var firstSeries = '<%=hidValues1 %>'; 
      var xAxis = '<%=hidXCategories1 %>'; 
      var banksname; 
      var seriesOne = new Array(); 
      seriesOne = firstSeries.split(','); 
      for (var i = 0; i < seriesOne.length; i++) { 

       seriesOne[i] = parseInt(seriesOne[i]); 
      } 
      var xAxisSeries = new Array(); 
      xAxisSeries = xAxis.split(','); 
      for (var i = 0; i < xAxisSeries.length; i++) { 

       banksname =banksname+ seriesTwo[i]; 

      } 


      var _MyArray = seriesOne; 
      var _MyArray2 = banksname; 
      $(document).ready(function() { 
       chart = new Highcharts.Chart({ 
        chart: { 
         renderTo: 'container', 
         defaultSeriesType: 'line' 
        }, 
        title: { 
         text: 'Fruit Consumption' 
        }, 
        xAxis: { 
         categories:[_MyArray2] 
        }, 
        yAxis: { 
         title: { 
          text: 'Fruit eaten' 
         } 
        }, 
        series: [{ 
         name:'Share Price', 
         data:_MyArray 
        }] 


       }); 
       $('tspan').last().remove(); 
      }); 
</script> 
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 
<div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div> 

以下私のコードであり、但しX軸カテゴリがまだデータベーステーブル内のカテゴリの数のリストがある（図中に表示する。

Answer 1

DotNet.Highchartsはあなたに簡単に任意のJavaScriptコードなしでサーバーサイト上Highchartsを構築する可能性を与えるここではあなたがあなたのASP.NETアプリケーションでグラフを作成する方法のコードです：。

Highcharts chart = new Highcharts("chart") 
      .SetTitle(new Title { Text = "Fruit Consumption" }) 
      .SetXAxis(new XAxis { Categories = _MyArray2 }) 
      .SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Fruit eaten" } }) 
      .SetSeries(new Series { Name = "Share Price", Data = new Data(_MyArray) }); 

さらに詳しいサンプルについては、http://dotnethighcharts.codeplex.com/releases/view/80650

Answer 2

Highcharts.Netなどがあり、ハイチャートをASP .NetのWebサイトに統合することもできます。実際、あなたが直面している正確な問題は議論されて解決されました。here

Answer 3

var firstSeries = '<％= hidValues1％>'; var xAxis = '<％= hidXCategories1％>'; ここにhidValues1 とhidXCategoriesはテーブルの列名ですか？ "現在のコンテキストでエラーが表示されるのをデバッグするにはhidvalues1が見つかりません..