在ASP.net中使用webservice的Highchart

时间:2013-08-14 07:50:50

标签: asp.net json web-services highcharts jsonp

我想要做的是从Web服务中获取一个简单的字符串数组(数字)到Highchart中。出于某种原因,图表甚至没有呈现,我无法通过此获得任何值。

在Highchart的文档中,我发现了这个跨域发送数据的例子:

http://docs.highcharts.com/#cross-domain-data

这是他们的例子(使用php):

The serverside php file:
<?php
header("content-type: application/json"); 

$array = array(7,4,2,8,4,1,9,3,2,16,7,12);

echo $_GET['callback']. '('. json_encode($array) . ')';    

?>

JavaScript使用jQuery调用回调函数。

$(document).ready(function() {
var options = {
    chart: {
        renderTo: 'container',
        type: 'spline'
    },
    series: [{}]
};

var url =  "http://url-to-your-remote-server/jsonp.php?callback=?";
$.getJSON(url,  function(data) {
options.series[0].data = data;
var chart = new Highcharts.Chart(options);
});
});

现在这就是我的WebService.cs的样子:

public WebService () {
    //Uncomment the following line if using designed components 
    //InitializeComponent(); 
}

[WebMethod(Description = "ID:2")]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]

public string GetSomeValues() {

    string[] values = { "3", "5", "6", "7", "3"};

    string[][] jaggedTable = new string[values.Count()][];

    int i = 0;
    foreach (var value in values)
    {
        jaggedTable[i] = new string[] { value + "" };
        i++;
    }

    JavaScriptSerializer js = new JavaScriptSerializer();
    string strJSON = js.Serialize(jaggedTable);

    return strJSON;
}

Default.aspx:

<script type="text/javascript">
    $(document).ready(function () {
        var options = {
            chart: {
                renderTo: 'container',
                type: 'spline'
            },
            series: [{}]
        };

        var url = "WebService.asmx/GetSomeValues";
        $.getJSON(url, function (data) {
            options.series[0].data = data;
            var chart = new Highcharts.Chart(options);
        });
    });
</script>

更新:我刚刚看到我在控制台出现此错误:

GET http://localhost:53566/WebService.asmx/GetSomeValues 500 (Internal Server Error)
jquery.min.js:130
c.extend.ajax jquery.min.js:130
c.extend.get jquery.min.js:122
c.extend.getJSON jquery.min.js:122
(anonymous function) highchart.aspx:23
c.extend.ready jquery.min.js:26

匿名函数是:

$.getJSON(url, function (data) {
            options.series[0].data = data;
            var chart = new Highcharts.Chart(options);
        });

我做错了什么?

0 个答案:

没有答案