0

我有一个使用 SQL 数据的谷歌折线图。但是，当查询返回 0 行时，它会在页面上显示一个大的空图表。我想改为显示一些文本，说明没有数据。我尝试将图表函数包装在另一个函数中，如果数据存在则调用该函数，但即使数据存在，也没有显示任何内容。这是我的一些代码：

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
function displayChart()
{
    $(document).ready(function()
    {
        google.setOnLoadCallback(drawChart);
    });
}
function drawChart() 
{
// Here we tell it to make an ajax call to pull the data from the .json file
    var jsonData = $.ajax({
    url: "Data.json",
    dataType:"json",
    async: false
}).responseText;

// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(jsonData);

// Options for the graph, we set chartArea to get rid of extra whitespace
var options = {
                'width':1300,
                'height':500,
                'chartArea': {top:'10%', left:'5%', height:'75%', width:'85%'}
              };

// Instantiate and draw our chart, passing in some options and putting it in the chart_div.
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data,options); 
}
</script>
<?

...

if($got_data == true)
{
    displayChart();
}
else
    echo "There is no data";

关于我做错了什么的任何想法，或者更好的方法来实现这一点？提前致谢！

4

1 回答 1

0

正如 Serg 的评论所说，您需要设置是否在 ajax 调用的回调中显示图表。这是因为从您的 ajax 调用返回的数据在您调用$.ajax(). 如果您低头查看JQuery AJAX 页面，您将看到几个如何处理来自 ajax 调用的数据的示例，但您正在寻找的内容类似于以下内容：

$.ajax({
    url: "Data.json",
    dataType:"json",
    async: false
}).complete(function(data) {
    if (data) {
        // draw chart
    } else {
        // say no data
    }
);
于 2012-11-26T16:59:16.577 回答