Question

我正在使用Google Charts绘制列和折线图。如何检查图表是否已成功绘制（或者数据表是否已成功填充）？

目前我只是检查是否已提交绘图表单，并确保为数组索引设置了默认值，以避免任何尺寸问题。但我仍然想知道如何以编程方式检查其成功与否。

我从Google获得的唯一提示是GadgetHelper Response，但我没有使用查询来生成数据。

我的代码如下：

<?php
    if(isset($_POST['submit'])){
        echo 'google.setOnLoadCallback(drawChart);';
    }
?>

<script>
function drawChart() {
    data = google.visualization.arrayToDataTable([
        <?php
            // populate array via PHP
        ?>
    ]);
    options = {
       // some options
    };
    chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, options); // some way of checking return value for success??

    // I 'd like to enable this only upon success, not when function is called
    document.getElementById('chart_selector').disabled = false;
}
</script>

Answer 1

为图表使用“ready”事件处理程序，以便在图表完成绘制时启用元素。如果你需要在图表无法绘制的情况下做某事，你也可以挂钩“错误”事件。

var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
google.visualization.events.addListener(chart, 'ready', function () {
    // do stuff when the chart is done drawing
    document.getElementById('chart_selector').disabled = false;
});
google.visualization.events.addListener(chart, 'error', function () {
    // do stuff when the chart fails to draw
});
chart.draw(data, options);

如果需要处理DataTable构造函数失败的情况，可以将构造函数调用包装在try-catch块中：

try {
    var data = new google.visualization.DataTable();
    // ...
}
catch (e) {
    alert('DataTable construction failed');
}

Google Charts API - 检查绘图是否成功

1 个答案: