1

即使我从服务器传递到客户端的数据与 Flot 接受的数据相同，但它没有被绘制。在我试图解析返回的字符串 JSON 的行上也有一个错误。下面的代码：

    //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);
        }
    });
});

我对 Flot 折线图做了同样的事情，而且效果很好。有人可以指出我哪里出错了吗？

4

1 回答 1

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 饼来说是不可接受的格式，因此屏幕上出现异常并且没有饼图。请随时纠正我的解释。

于 2013-03-21T09:05:06.440 回答