JQuery загружает API визуализации Google с помощью AJAX

Ответ 1

Помню, когда я использовал API Google, он явно сказал, что сначала инициализирует загрузку. Поэтому, возможно, сохраните функцию google.load из AJAX, а затем просто продолжайте называть вторую часть своей функции успешной:

//Straight Away!
google.load('visualization', '1', {'packages': ['annotatedtimeline']}); 

$(document).ready(function(){
    // Get TIER1Tickets                 
    $("#divTendency").addClass("loading");

    $.ajax({
        type: "POST",
        url: "getTIER1Tickets.php",
        data: "",
        success: function(html){
            // Succesful, load visualization API and send data
            google.setOnLoadCallback(drawData(html)); 
        }
    });  
});

Ответ 2

Я знаю, что это более старая запись, но после некоторого поиска в документах google.load я нашел вариант async, если вы хотите динамически загружать библиотеки:

http://code.google.com/apis/loader/

function loadMaps() {
   google.load("visualization", "2", {"callback" : function(){ alert(4); }});
}

Ответ 3

Это немного выстрел в темноте:

google.setOnLoadCallback(function() { drawData(html) });

Возможно, ссылка на html потеряна, и требуется закрытие.

Ответ 4

Я знаю, что это старый поток, но это может помочь другим.
Я столкнулся с той же проблемой сейчас и очень похож (если не тот же), что и раньше, с CMS:

код на странице:

<div id='targetdiv'></div>
<script type="text/javascript">
$(document).ready( function () {
   $('#targetdiv').load('...some url...');
});
</script>

часть script, загруженная с помощью ajax:

<script type="text/javascript">
  document.write("hello");
</script>

Результатом является страница с текстом "привет", который выглядит так, будто он все еще загружается. Это вызвано методом document.write. Поскольку script загружается в уже завершенный и закрытый документ, браузер открывает новый, и я полагаю, что механизм javascript ожидает следующей строки кода, которая никогда не появится, поскольку открытие нового документа удалит исполняемый.

Ответ 5

Не могли бы вы предоставить образец возвращаемых данных? Вы можете напрямую вызвать drawData (html):

$.ajax({
type: "POST",
async: false,
url: "getTIER1Tickets.php",
data: "",
success: function(html){
    // Succesful, load visualization API and send data      
    google.load('visualization', '1', {'packages': ['annotatedtimeline']}); 
   //You are already in a callback function, better like this ? 
    drawData(html);                                                   
}}); 

Ответ 6

Вы пытались сделать это как синхронный запрос AJAX? Обратите внимание на настройку async ниже.

$.ajax({
    type: "POST",
    async: false,
    url: "getTIER1Tickets.php",
    data: "",
    success: function(html){
        // Succesful, load visualization API and send data      
        google.load('visualization', '1', {'packages': ['annotatedtimeline']}); 
        google.setOnLoadCallback(drawData(html));                                                   
    }
}); 

Ответ 7

Я вообще не знаком с google apis, но я предполагаю, что "html" в обратном вызове на самом деле json или script, вы можете попробовать опцию $.ajax 'dataType':

$.ajax({
    type: "POST",
    url: "getTIER1Tickets.php",
    dataType: "json",//"script"
    data: "",
    success: function(html){
        // Succesful, load visualization API and send data      
        google.load('visualization', '1', {'packages': ['annotatedtimeline']}); 
        google.setOnLoadCallback(drawData(html));                                                   
    }
});

Дополнительная информация: http://api.jquery.com/jQuery.ajax/

Ответ 8

Похоже, вам не хватает библиотеки Google, которая обеспечивает визуализацию. Вы уверены, что включили все необходимые скрипты Google?

Ответ 9

Я использую систему вкладок на основе AJAX и визуализацию интерактивной линейной диаграммы Google в одном из моих проектов и столкнулась с подобной кирпичной стеной.

Из-за присущей AJAX блокировки междоменных скриптов вы не можете загрузить API javascript Google (http://www.google.com/jsapi) или любой другие внешние ресурсы.

И поскольку условия использования Google запрещают офлайн-оффу (например, "не размещенные в Google" ) использование их API визуализации, вы не можете законно получить копию сценариев и разместить их самостоятельно, как это требуется.

Я попробовал взломанное обходное решение с включением в мои вкладки файла с именем "get_vis.php" вместо "visualization_page.php"; где содержимое "get_vis.php":

<?php 
echo file_get_contents('http://domain.com/path/to/visualization_page.php');
?>

Но, не удача, кажется, единственный способ правильно загрузить API для загрузки - это настроить параметры безопасности, чтобы обеспечить взаимодействие с серверами Google. Я не знаю, помогает ли она, но удачи.

Ответ 10

Это работает для меня

google.load("visualization", "1", { packages: ["corechart"] });

             var chart ;
             var data ;
             var options;
        function Change(s)
        {
              // s in json format    
              google.setOnLoadCallback(reDraw(s));
              function reDraw(s) {
                  console.log(new Function("return " + s)().length); // to test if json is right
                  data = google.visualization.arrayToDataTable(new Function("return "+s)());

                    options = {
                    title: 'Product Scanes',
                    vAxis: { title: '', titleTextStyle: { color: 'red'} }         
                };

              }         
                chart = new google.visualization.BarChart(document.getElementById('chart_div'));
                chart.draw(data, options);
        }  
        function requestDate() // cal the method when you want to draw the chart 
        {

            $.ajax({
                type: "POST", // CHANGED
               // contentType: "application/json; charset=utf-8",
                url: "something.php",
                data: {  parameters you wanna pass },
                success: function (d) { 
                Change(d);


                }
            });    
        }
}