以正确的格式将Ajax数据转换为FLOT图表

本文关键字:转换 数据 FLOT 图表 Ajax 格式 | 更新日期: 2023-09-27 17:53:35

我知道有几个帖子关于这个,但我想我错过了一些东西。我在ajax调用返回下面的数据,但它似乎不是在正确的格式为FLOT。是否有更好的格式来返回数据,或者应该对FLOT进行哪些更改以识别它?TIA

<script type="text/javascript">
     $(document).ready(function() {
         // Add the page method call as an onclick handler for the div.
         $("#Result").click(function() {
             $.ajax({
                 type: "POST",
                 url: "WebTest.aspx/GetData",
                 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 = []
                     jsObj.push($.parseJSON(msg.d));
                     $.plot($("#Result"), jsObj, {
                         grid: {
                             backgroundColor: "#E5E5E5",
                             mouseActiveRadius: 20
                         }

                     }
                 );
                 }
             });
         });
     });
</script>

[WebMethod]
public static string GetData()
{
    DataLines dataLine1 = new DataLines();
    DataLines dataLine2 = new DataLines();

    int[] lineA_Point1 = new int[] { 4, 6 };
    int[] lineA_Point2 = new int[] { 2, 10};
    List<int[]> dataA = new List<int[]>();
    dataA.Add(lineA_Point1);
    dataA.Add(lineA_Point2);
    dataLine1.data = dataA;
    dataLine1.label = "DataLine1";
    JavaScriptSerializer js = new JavaScriptSerializer();
    string Line1 = js.Serialize(dataLine1);
    return Line1;
}

以正确的格式将Ajax数据转换为FLOT图表

1。将JSON字符串转换回javascript中的javascript对象:

var jsObj = $.parseJSON(d); // using jquery method

2)。在GetData方法中,

dataLine1.data = "[[1356328800000,5],[1356933600000,3]]";

不起作用。这将使您的数据元素成为JSON中的字符串,而不是javascript数组。最好在你的WebMethod:

中修复这个问题。
DataLines dataLine1 = new DataLines();
dataLine1.data = new List<int[]>();
dataLine1.data.Add(new int[] {1356328800000,5});
dataLine1.data.Add(new int[] {1356933600000,3});

这是完全未经测试的(我以前从未使用过JavaScriptSerializer,但类似的代码与ServiceStack序列化器一起工作。