Question

我知道这听起来有点奇怪，但我在这里得到了一段代码：

let globalResult = [];
let defaultData = ["None", 1200, 1200, 1200, 1200, 1200, 1200, 1200,
1200, 1200, 1200, 1200];
$(document).ready(() => {
    // set a listener on the textbox
    $('#input').on("change", (evt) => {
        let text = $('#input').val();
        // the {text: text} sends a parameter named text with the
        // value of what was typed in the textbox
        $.get("/display", {text: text})
            .done((data) => {
                globalResult = data['result'];
                $('#input').val('');   // reset the textbox
                //Draw Graph
                google.charts.load('current', {'packages':['corechart']});
                google.charts.setOnLoadCallback(drawChart);

                function drawChart() {
                    //Chart stuff.... Doesn't matter
                    //It's programmed to Draw Line with defaultData and globalResult
                    };

                    var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

                    chart.draw(data, options);
                    //Swap Value here:
                    defaultData = globalResult;
                }

            })

我在绘制图表后尝试交换defaultData和globalResult，但是在交换数据时它总是如何绘制新图表，因此会导致图形中断（就像另一条线刚刚死掉一样）在图纸的中间，左边的一半线挂在那里）。如果我试图将这些放在function drawChart之外，它将在中间绘制另外两个模具的相同线。我也不能将其置于$.get()范围之外，因为不会绘制图表。我该如何解决这个问题？

Answer 1

加载语句（google.charts.load）将等待文档准备就绪，
在执行回调之前，或者保证它返回...
因此，不需要 - ＆gt; $(document).ready

首先使用承诺加载谷歌，
然后创建图表并保存参考以供以后使用，
这将允许您使用任何数据绘制相同的图表

建议类似以下设置...

let globalResult = [];
let defaultData = ["None", 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200, 1200];

google.charts.load('current', {
  packages: ['corechart']
}).then(() => {
    // save reference to chart here
    var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

    $('#input').on("change", (evt) => {
        let text = $('#input').val();
        // the {text: text} sends a parameter named text with the
        // value of what was typed in the textbox
        $.get("/display", {text: text})
            .done((data) => {
                globalResult = data['result'];
                $('#input').val('');   // reset the textbox

                //Chart stuff....
                chart.draw(data, options);

                //Swap Value here:
                defaultData = globalResult;
            });

    });
});

程序完成绘制Google Charts后如何分配值？

1 个答案: