2013-03-20 57 views
1

尽管从我的服务器传递给客户端的数据与Flot接受的数据相同,但并未绘制。在我尝试解析返回的字符串JSON的行上也有一个错误。下面的代码:为Flot饼图兼容性序列化数据

//server_processing.aspx.cs 
    [WebMethod] 
    public static string GetPieData() 
    { 
     List<PieData> pieData = new List<PieData>(); 
     pieData.Add(new PieData { label = "A", data = 40 }); 
     pieData.Add(new PieData { label = "B", data = 40 }); 
     pieData.Add(new PieData { label = "C", data = 20 }); 

     var serializer = new JsonSerializer(); 
     var stringWriter = new StringWriter(); 
     var writer = new JsonTextWriter(stringWriter); 
     writer.QuoteName = false; 
     serializer.Serialize(writer, pieData); 
     writer.Close(); 
     var json = stringWriter.ToString(); 
     return json; 
    } 

//PieData.cs 
[JsonObject(MemberSerialization.OptIn)] 
public class PieData 
{ 
    [JsonProperty] 
    public string label { get; set; } 
    [JsonProperty] 
    public int data { get; set; } 
} 

<%-- Charts.aspx --%> 
<script type="text/javascript"> 
var options = { series: { pie: {show: true} } }; 
$(document).ready(function() { 
    $.ajax({ 
     type: "POST", 
     url: "server_processing.aspx/GetPieData", 
     data: "{}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function (msg) { 
      // Replace the div's content with the page method's return. 
      var jsObj = []; 
      //Error on the line below 
      //0x800a03f6 - JavaScript runtime error: Invalid character 
      jsObj.push($.parseJSON(msg.d)); // [{label:"A",data:40},{label:"B",data:40},{label:"C",data:20}] 

      $.plot($("#piechart"), jsObj, options); 
     } 
    }); 
}); 

我做的海军报线图同样的事情,它完美地工作。有人可以请指点我哪里出错了吗?

+1

您可以将jsObj记录到控制台并向我们显示数据的具体内容吗? – DNS 2013-03-20 13:09:34

+0

其实这就是发生错误的那一行。解析为JSON时。但在发送数据的Internet Explorer控制台中,我得到'[object Object]'。 – lbrahim 2013-03-20 13:42:03

+1

你应该在你的问题中提到有一个错误,并提供你有关于它的任何信息;你描述这个问题的方式就像情节一样悄无声息地失败了。此外,日志msg.d,因为这是什么被解析。 – DNS 2013-03-20 13:57:25

回答

0

我发现了这个问题。我评论了以前的代码并插入了新代码,以使差异显而易见。

<script type="text/javascript"> 
var options = { series: { pie: {show: true} } }; 
$(document).ready(function() { 
    $.ajax({ 
     type: "POST", 
     url: "server_processing.aspx/GetPieData", 
     data: "{}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function (msg) { 
      //var jsObj = []; 
      //jsObj.push($.parseJSON(msg.d)); 
      var data = ($.parseJSON(msg.d); 
      $.plot($("#piechart"), data, options); 
     } 
    }); 
}); 
</script> 

//server_processing.aspx.cs 
    [WebMethod] 
    public static string GetPieData() 
    { 
     List<PieData> pieData = new List<PieData>(); 
     pieData.Add(new PieData { label = "A", data = 40 }); 
     pieData.Add(new PieData { label = "B", data = 40 }); 
     pieData.Add(new PieData { label = "C", data = 20 }); 

     JavaScriptSerializer js = new JavaScriptSerializer(); 
     string returnArray = js.Serialize(pieData); 
     return returnArray; 

     //var serializer = new JsonSerializer(); 
     //var stringWriter = new StringWriter(); 
     //var writer = new JsonTextWriter(stringWriter); 
     //writer.QuoteName = false; 
     //serializer.Serialize(writer, pieData); 
     //writer.Close(); 
     //var json = stringWriter.ToString(); 
     //return json; 
    } 

因为,我正在将解析的数据推入已初始化的数组中。似乎数据被推到了第一个索引上,这对于Flot饼图来说是不可接受的格式,因此,屏幕上的异常和无饼图。请随时纠正我的解释。