fusionChart is not loading with dynamic data using Json and C#

I have the below code in code behind.

      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 
     } 

I am having the below sample data into my hiddenfield 'hdndata' as

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

At the Design Page ......

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

Still the Chart is not populated. No Error is showing. The message is 'No Data found to display'.

If I provide the static Json format data after "data": then that works perfectly.

My Question is how to run the chart with dynamic data? Please help me to find my mistakes. Thank you All.