0

我正在尝试通过使用 jQuery 调用 PHP 页面来自动创建图表（使用 Google Charts API）。我正在为数据返回 JSON，目前，我只是为选项返回一个字符串。

图表“数据”工作正常，但我很难自动传递“选项”。我的代码片段如下：

    var jsonData = $.ajax({
        url: "http://server.com/charts/dev/data.php",
        dataType:"json",
        async: false
    }).responseText;

    var optionData = $.ajax({
        url: "http://server.com/charts/dev/options.php",
        dataType:"text",
        async: false
    }).responseText;

    var data = new google.visualization.DataTable(jsonData);
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
    chart.draw(data, optionData);

如果我删除试图获取“optionData”的 jQuery，并自己提供它，图表就会加载。否则，我得到“无法读取 null 的属性 '0'”显示为错误（控制台上没有任何内容）。

PHP 页面 'options.php' 看起来像这样（现在）：

<?php
echo <<< 'EOT'
{width: 400, height: 240}
EOT;

如果我添加 Console.Log(optionData)，我会得到{width: 400, height: 240}预期的结果。

4

3 回答 3

0

你能测试替换optiondata的数据类型吗？

从：

    var optionData = $.ajax({
        url: "http://server.com/charts/dev/options.php",
        dataType:"text",
        async: false
    }).responseText;

到：

    var optionData = $.ajax({
        url: "http://server.com/charts/dev/options.php",
        dataType:"JSON",
        async: false
    }).responseText;
于 2013-03-07T06:58:05.050 回答
0

要对 ajax 调用进行故障排除，请定义错误、成功和完成回调：

var optionData = $.ajax({
    url: "http://server.com/charts/dev/options.php",
    dataType:"json", // I think using 'text' here is wrong as `draw` expects objects
    async: false,
    error: function(xhr, status, err){
        console.log('Error: ' + xhr); // you can also output status and err if needed
    },
    success: function(data){
        console.log('Success: ' + data);
    },
    complete: function(data){
        console.log('Complete: ' + data);
    }
}).responseText;

还有一件事，要确保 PHP 返回一个对象 json 在 PHP 中对其进行编码：

echo json_encode($your_data);
于 2013-03-07T07:34:04.933 回答
0

无论我尝试什么，jQuery 似乎总是返回一个字符串，而不是一个对象。

这对于“google.visualization.DataTable”来说很好，但“google.visualization.AreaChart”需要一个对象。我现在正在使用这样的东西，效果很好：

var optionData = jQuery.parseJSON($.ajax({
    url: "http://server.com/charts/release/getChartOptions.php",
    dataType:"json"
    async: false
}).responseText);

感谢您的帮助！

于 2013-03-09T12:12:55.207 回答