微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

使用Ajax将数据加载到Highcharts中

我试图在页面加载和使用JQUERY AJAX调用选择菜单更改时更新高级图表.在[[10,1228800000],[10,1228800000]]格式中返回数据.该图表为空白,不显示任何数据.

试过这里发布的几个解决方案,但都没有奏效.

var chart;
        $(document).ready(function() {


            var options = {
                chart: {
                    renderTo: 'stats',defaultSeriesType: 'spline'
                },title: {text:''},xAxis: {
                    type: 'datetime'
                },yAxis: {},series: []
            };
    var month = 'July';
    $.ajax({
        type: "POST",data: "month="+month,url: "update_visits_chart",success: function (data) {

            options.series.push(data);
            chart = new Highcharts.Chart(options);
        }
    });

错误吗?提前致谢.
编辑:

最新的代码仍然没有工作:

var options = {

            chart: {
                renderTo: 'stats',type: 'spline'
            },title: {
                text: ''
            },xAxis: {

                type:'datetime',tickInterval: 30 * 24 * 3600 * 1000,dateTimeLabelFormats: {
                    day: '%b %e'
                },labels: {
                    rotation: -45,align: 'right'
                }
            },yAxis: {
                title: {
                    text: 'Number of visits'
                },min: 0
            },tooltip: {
                formatter: function() {
                        return Highcharts.dateFormat('%b %e',this.x) +'<br />'+this.y+' visit(s)';
                }
            },legend: {
                enabled: true
            },credits: {
                enabled: false
            },exporting: {
                enabled: false
            },series: [{
                name: 'Number of Visits',data: []
            }]
        };
        var month = 'July';
        $.ajax({
            type: "POST",success: function(data){
                options.series[0].data = data;
                chart = new Highcharts.Chart(options);
            }
        });
您必须使用系列对象的setData方法,如文档中所述.在你的情况下,它是options.series [0] .setData(数据)

我认为你必须使用JSON.parse(data)将Ajax结果从字符串转换为真实的对象/数组.

编辑:
@Ricardo Lohmann:在ajax调用中,他没有在响应中指定他期望的dataType,所以jQuery会猜测dataType.但它不会识别以[作为JSON开头的字符串,我怀疑他的响应将使用正确的mime类型application / json.因此,指定正确的mime类型也应该可以解决问题.但我没有一个关于提问者完整的ajax响应的例子.所以我也只是在猜测.

我推荐以下ajax调用

$.ajax({
    type: "POST",data: {month: month},dataType: 'json',success: function(data){
        options.series[0].setData(data);
    }
});

@Jugal Thakkar

$.getJSON只是上面ajax调用的快捷方式,但由于选项较少,因此灵活性较低.

原文地址:https://www.jb51.cc/ajax/160016.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐