fusionChart 未使用 Json 和 C# 加载动态数据

Question

我在后面的代码中有以下代码。

      protected void Page_Load(object sender, EventArgs e)  
       {    
         hdndata.Value = ShowFusionChart();    
       }  

      public string ShowFusionChart()  
       { 
        DataTable dt = new DataTable();     
        dt = LoadGrid();  
        System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();   
        List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>(); Dictionary<string, object> row;    

        foreach (DataRow dr in dt.Rows)        
         { 
         row = new Dictionary<string, object>(); 
         foreach (DataColumn col in dt.Columns) 
           {  
         if (col.ColumnName.ToLower() == "linkname")  
             row.Add("label", dr[col]);  
         if (col.ColumnName.ToLower() == "countno") 
             row.Add("value", dr[col]); 
        } 
        rows.Add(row);  
      }   
       return serializer.Serialize(rows); 
    }  

    Public DataTable LoadGrid()  
     {  
     // This code block is generating a DataTable from database 
     } 

我将以下示例数据放入我的隐藏字段“hdndata”中

[{"label":"Products","value":88},{"label":"Documents","value":77},{"label":"Videos","value":58}]  

在设计页面......

 <div id="chartContainer">FusionCharts XT will load here!</div>   
 <div id="chartContainer2"></div>   


<script type="text/javascript" src="fusioncharts/fusioncharts.js"></script>  
<script type="text/javascript" src="fusioncharts/themes/fusioncharts.theme.zune.js"></script>  

<script type="text/javascript">  

   $(function () {    
 `enter code here`  
    alert($('#hdndata').val());// getting alert with Json Data.  
    FusionCharts.ready(function () {       

    var jdata ;  
    jdata = $('#hdndata').val();  
    //console.log(jdata);    

           var revenueChart = new FusionCharts({  
            type: "column2d",  
            renderAt: "chartContainer",  
            width: "500",  
            height: "300",  
            dataFormat: "json",  
            dataSource: {   
                "chart": {   
                    "caption": "Asset Tracking Report",   
                    "subCaption": "Microsite Report",   
                    "xAxisName": "Assets",   
                    "yAxisName": "Count",   
                    "theme": "zune"   
                },   
                "data": jdata   
            }   
        });    
        revenueChart.render("chartContainer");   

    });   
    });    


</script>    

仍然没有填充图表。没有显示错误。消息是“找不到要显示的数据”。

如果我在 "data": 之后提供静态 Json 格式数据，那么效果很好。

我的问题是如何使用动态数据运行图表？请帮助我找出我的错误。谢谢你们。

Answer 1

请注意，如果您的图表显示“无数据可显示”消息，则可能是您的数据不包含任何可由 FusionCharts XT 绘制的数据或不正确的数据格式。

通过传递附加到 JSON 的“jdata”变量中的数据，可以正确呈现图表，因为我们已经测试了您的代码。

似乎问题可能是从数据库中获取数据并通过“jdata”变量传递到图表时引起的。请重新检查“'$('#hdndata').val();”是否代码正在生成需要传递给图表的正确数据。