在儀表板上顯示儀表板使用jQuery中的asp.net c＃

Question

我想在儀表板上使用jQuery在c＃中顯示實時連接調用。以不同中心的連接呼叫爲例。所以，讓我知道我可以告訴活在電話的工作..提前 謝謝..
此代碼試過..

string str_caption = "Month Wise Sales"; 
       string str_Sub_caption = "No Of Sales"; 

       string x_axis = "Month"; 
       string y_axis = "No. Of Sales"; 

       string str_xml = null; 

       str_xml = @"<graph caption='" + str_caption + @"' subCaption='" + str_Sub_caption + @"' decimalPrecision='0' 
          pieSliceDepth='30' formatNumberScale='0' xAxisName='" + x_axis + @"' yAxisName='" + y_axis + @"' rotateNames='1' >"; 

       int i = 0; 

       foreach (DataRow dr in dt.Rows) 
       { 


        str_xml += "<set name='" + dr[0].ToString() + "' value='" + dr[1].ToString() + "' color='" + color[i] + @"' " 
           + " link=&quot;JavaScript:myJS('" + dr["x_month"].ToString() + ", " + dr["no_of_sales"].ToString() + "'); &quot;/>"; 

        i++; 
       } 

       str_xml += "</graph>"; 

       FCLiteral1.Text = FusionCharts.RenderChartHTML("Bootstrap/FusionCharts/FCF_Doughnut2D.swf", "", str_xml, "mygraph1", 
             graph_width, graph_height, false); 

這是ASPX代碼..

<asp:Literal ID="FCLiteral1" runat="server"></asp:Literal> 

Answer 1

的位之後奮鬥，我成功地顯示在asp.net c＃中使用javascript的實時調用。這是我在頁面加載時調用的C sharp代碼。

public void sales_rpt() 
     { 
      string sql_data = "Select grp.Group_Name,count(ccls.caller_id) as x_calls from currentcalls as ccls " 
           + " inner join group_master as grp on ccls.group_id=grp.ID where ccls.`Status`=1"; 
      ViewState["data"] = sql_data; 

      DataSet ds = BusinessLogic.GetDataSet(ViewState["data"].ToString()); 
      dt = ds.Tables[0]; 


      str.Append(@"<script type=text/javascript> 
         google.load(*visualization*, *1*, {packages:[*corechart*], callback:drawChart}); 
         function drawChart() { 
         var data = new google.visualization.DataTable(); 
         data.addColumn('string', 'Group_Name'); 
         data.addColumn('number', 'x_calls'); 
         data.addColumn({type: 'string', role: 'style'}); 
         data.addRows(" + dt.Rows.Count + ")"); 

      lbl_grp_name.Text = dt.Rows[0]["Group_Name"].ToString(); 

      for(int i = 0; i <= dt.Rows.Count - 1; i++) 
      { 
       str.Append("data.setValue(" + i + "," + 0 + "," + "'" + dt.Rows[i]["Group_Name"].ToString() + "'"); 
       str.Append("data.setValue(" + i + "," + 0 + "," + "'" + dt.Rows[i]["x_calls"].ToString() + "'"); 
      } 


      str.Append(@" var view = new google.visualization.DataView(data); 
         view.setColumns([0, { 
         sourceColumn: 1, 
         calc: function() {return 0;} 
        }, 2]); 

         var chart = new google.visualization.ColumnChart(document.getElementById('g2')); 
          google.visualization.events.addOneTimeListener(chart, 'ready', function() { 
          chart.draw(data, { 
             width: 700, 
             height: 400, 
             title: 'Group Name', 
             color: '#0092CB', 
              min: 0, 
              max: '100', 
             hAxis: { 
             title: 'Connected Calls', 
             label: 'No Of Calls' 

          }, 
          animation: { 
            duration: 1000 
           } 
         }); 
        }); 
         chart.draw(view, { 
            width: 700, 
            height: 400, 
            title: 'Group Name', 
            color: '#0092CB', 
            hAxis: { 
            title: 'Connected Calls', 
            label: 'No Of Calls' 

          }, 
          animation: { 
            duration: 1000 
           } 
         }); 
        } 
        </script>"); 

      FCLiteral1.Text = str.ToString().TrimEnd(',').Replace('*','"'); 
     } 

在上面的代碼之前，您需要在aspx頁面上添加javascript和圖形樣式。

<style> 
     body { 
     text-align: left; 
     } 

     #g1 { 
     width:600px; height:400px; 
     display: inline-block; 
     margin: 1em; 
     } 

     #g2, #g3, #g4 { 
     width:100px; height:80px; 
     display: inline-block; 
     margin: 1em; 
     } 

     p { 
     display: block; 
     width: 450px; 
     margin: 2em auto; 
     text-align: left; 
     } 
    </style> 
//JavaScript 
<script> 
     var graph; 

     window.onload = function() { 
      var graph = new JustGage({ 
       id: "g2", 
       value: getRandomInt(0, 100), 
       min: 0, 
       max: 100, 
       title: "Connected Calls", 
       label: "No of Calls" 
      }); 
     } 

    </script> 

//表單代碼，你需要調用的G1，G2，G3的標識。

<div id="g2" class="form-horizontal"> 
<asp:Literal ID="FCLiteral1" runat="server"></asp:Literal> 

    </div>