在highchart.js

Question

您好，所有开发人员： - ）

我想问一个关于在highchart.js库中进行Ajax调用的问题

我有一些值，我根据我给后端（它的MVC .NET项目）的信息通过Ajax返回，然后我想在每个div中使用类gainChart渲染一个新图表（我正在为其他目的添加ID，所以不要打扰他们:-)）

        var iteratorJs = 0;
    $(".gainChart").each(function (i) {
        $(this).attr('id', "gainChart" + (i + 1));

            var chart = new Highcharts.Chart({
                chart: {
                    renderTo: this,
                    type: 'line',
                    margin: 0,
                    backgroundColor: 'rgba(255,255,255,0.3)'
                },
                colors: ['#2E5430'],
                xAxis: {
                    lineWidth: 0,
                    minorGridLineWidth: 0,
                    lineColor: 'green',
                    //type: 'datetime',
                    labels: {
                        enabled: false
                    },
                    categories: [
                        $.ajax({
                            type: "POST",
                            url: "forex-copy-points-days",
                            data: { page: 0, perPage: 5, iterator: iteratorJs },
                            dataType: 'json',
                            async: false,
                            success: function (data) {
                                var daysArr = data.days;
                                JSON.stringify(daysArr);
                                categories = daysArr;
                                console.log(daysArr);
                           }
                        })
                    ]
                },
                tooltip: {
                    formatter: function () {
                        var text = '';
                        text = this.y + '$';
                        return text;
                    }
                },
                credits: { enabled: false },
                title: { text: null },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        stacking: 'normal',
                        pointWidth: 10
                    }
                },
                series: [{
                    name: 'Balance',
                    showInLegend: true,
                    legendMarkerColor: "green",
                    legendText: "Profit for account",
                    data: [
                        $.ajax({
                            type: "POST",
                            url: "forex-copy-points-balance",
                            data: { page: 0, perPage: 5, iterator: iteratorJs },
                            dataType: 'json',
                            async: false,
                            success: function (balances) {
                                var balArr = balances.balances;
                                JSON.stringify(balArr);
                                data = balArr;
                                console.log(balArr);
                            }
                        })
                    ]
                }],
                exporting: {
                    enabled: false
                },
                responsive: {
                    rules: [{
                        condition: {
                            maxWidth: 600
                        },
                        chartOptions: {
                            legend: {
                                enabled: false
                            }
                        }
                    }]
                }
            });
            iteratorJs++;           
        });

返回的数据应该是（不同的字符串），但没有显示任何内容 - 只有图表的背景。有人可以给我一个线索，如何解决这个问题，以及为了解决我的问题需要改变什么。

提前致谢！

Answer 1

jQuery $.ajax方法调用不会返回此调用产生的数据，因此您无法编写myData = $.ajax()。您必须使用success回调来获取数据，然后才能使用它。

例如，不要写这个：

categories: [
    $.ajax({
        type: "POST",
        url: "forex-copy-points-days",
        data: { page: 0, perPage: 5, iterator: iteratorJs },
        dataType: 'json',
        async: false,
        success: function (data) {
            var daysArr = data.days;
            JSON.stringify(daysArr);
            categories = daysArr;
            console.log(daysArr);
       }
    })
]

你应该写这样的东西：

$.ajax({
    type: "POST",
    url: "forex-copy-points-days",
    data: { page: 0, perPage: 5, iterator: iteratorJs },
    dataType: 'json',
    async: false,
    success: function (data) {
        // create graph from AJAX call results
        var chart = new Highcharts.Chart({
            xAxis: {
                categories: JSON.stringify(data.days)
            },
            series: [{
                data: JSON.stringify(balances.balances)
            }]
        });
   }
});