阿贾克斯数据FLOT图表格式是否正确？ [英] Ajax data to FLOT chart in correct format?

问题描述

我知道有这个几个职位，但我觉得我失去了一些东西。我返回下面的数据在Ajax调用，但它似乎并没有在为FLOT正确的格式。有没有更好的格式返回数据，或者是应该改变的FLOT承认它？ TIA

 ＆LT;脚本类型=文/ JavaScript的＆GT;
     $（文件）。就绪（函数（）{
         //添加页面的方法调用作为一个onclick处理程序分区。
         $（＃结果）。点击（函数（）{
             $阿贾克斯（{
                 键入：POST，
                 网址：WebTest.aspx /的GetData
                 数据： {}，
                 的contentType：应用/ JSON的;字符集= UTF-8，
                 数据类型：JSON，
                 成功：函数（MSG）{
                     //替换div的内容与页面方法的返回。

                     VAR jsObj = []
                     jsObj.push（$ parseJSON（msg.d））;

                     $ .plot（$（＃结果），jsObj，{
                         格： {
                             的backgroundColor：＃E5E5E5

                             mouseActiveRa​​dius：20
                         }


                     }
                 ）;
                 }
             }）;
         }）;
     }）;
＆LT; / SCRIPT＆GT;


[WebMethod的]
公共静态字符串的GetData（）
{

    DataLines dataLine1 =新DataLines（）;
    DataLines dataLine2 =新DataLines（）;


    INT [] lineA_Point1 =新INT [] {4,6};
    INT [] lineA_Point2 =新INT [] {2,10};

    名单＆LT; INT [] GT;数据A =新的名单，其中，INT []＆GT;（）;
    dataA.Add（lineA_Point1）;
    dataA.Add（lineA_Point2）;

    dataLine1.data =数据A;
    dataLine1.label =DataLine1;

    JavaScriptSerializer JS =新JavaScriptSerializer（）;

    串线路1 = js.Serialize（dataLine1）;

    返回1号线;
}
 

解决方案

1）JSON字符串转换回在你的JavaScript的JavaScript对象：

  VAR jsObj = $ .parseJSON（D）; //使用jQuery方法
 

2。）在你的GetData方法，您

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

是行不通的。这将让你的数据元素的字符串在JSON，而不是一个javascript数组。这将是最好的解决这个问题在你的WebMethod：

  DataLines dataLine1 =新DataLines（）;
dataLine1.data =新的名单，其中，INT []＆GT;（）;
dataLine1.data.Add（新INT [] {1356328800000,5}）;
dataLine1.data.Add（新INT [] {1356933600000,3}）;
 

这是完全未经检验的（我从来没有使用 JavaScriptSerializer 前，但类似code工作与ServiceStack串行器。

I know there are several posts about this but I think I'm missing something. I'm returning the data below in an ajax call but it doesn't seem to be in the right format for FLOT. Is there a better format to return the data in or what should be changed for FLOT to recognize it? 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;
}

解决方案

1.) Convert the JSON string back to a javascript object in your javascript:

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

2.) In your GetData method, your

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

isn't going to work. That will make your data element a string in the JSON instead of a javascript array. It would be best to fix this in your WebMethod:

DataLines dataLine1 = new DataLines();
dataLine1.data = new List<int[]>();
dataLine1.data.Add(new int[] {1356328800000,5});
dataLine1.data.Add(new int[] {1356933600000,3});

That's totally untested (I've never used the JavaScriptSerializer before, but similar code works with the ServiceStack serializer.

这篇关于阿贾克斯数据FLOT图表格式是否正确？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！