Visualisation de Google (PieChart/LineChart) Jquery Ajax Firefox issue

Question

J'ai rencontré un bug avec firefox et j'ai cherché partout et n'ai pas semblé trouver la réponse à un problème que j'ai eu.

Mon programme fonctionne très bien dans Chrome et IE, mais les graphiques iframe ne fonctionnent pas dans Firefox. J'utilise un gestionnaire, puis jquery.ajax pour saisir les données et exécuter le script.

jQuery.ajax({ 
        url: jQuery(this).attr("href"), 
        data: data, 
        dataType: 'script' 
}); 

data = toutes les informations pour un diagramme à secteurs et toutes les informations pour un tableau. La table est correcte, mais le graphique à secteurs iframe est vide. Si j'appuie sur le bouton retour arrière, le diagramme à secteurs s'affiche. C'est presque comme si le tableau de bord dépassait Firefox.

les données ressemblent à ceci sauf avec mes propres données. Cela devient passé du gestionnaire à l'appel ajax

var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Task'); 
    data.addColumn('number', 'Hours per Day'); 
    data.addRows(5); 
    data.setValue(0, 0, 'Work'); 
    data.setValue(0, 1, 11); 
    data.setValue(1, 0, 'Eat'); 
    data.setValue(1, 1, 2); 
    data.setValue(2, 0, 'Commute'); 
    data.setValue(2, 1, 2); 
    data.setValue(3, 0, 'Watch TV'); 
    data.setValue(3, 1, 2); 
    data.setValue(4, 0, 'Sleep'); 
    data.setValue(4, 1, 7); 

    var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
    chart.draw(data, {width: 450, height: 300, title: 'My Daily Activities'}); 

Quelqu'un at-il d'autre rencontré un problème similaire? Je sais que les données sont transmises correctement et tout est reçu, mais il semble que Firefox ne joue pas bien avec les iframes.

Si quelqu'un a des suggestions ou des idées, ce serait une grande

Merci

Answer 1

Juste quelques heures après avoir lu votre message que le problème est que dans FF j'ai trouvé la solution. Importation JQuery sur votre page

<script src="../GoogleJs/jquery-1.4.2.min.js" type="text/javascript"></script> 

puis ajoutez une étiquette

$(document).ready(function() { 
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler); 

     function EndRequestHandler(sender, args) { 
     drawVisualization() 
     } 

    }); 

où drawVisualization() est la fonction de dessin. Cela fonctionne comme charme ...

p.s. merci de noter que FF était le problème

Answer 2

J'ai eu le même problème sur FFox seulement.

Je résolus d'emballage tout en fonction et de l'appeler avec un petit setTimeout

function drawChart() { 
    //... 
} 

setTimeout(drawChart, 200); 

Answer 3

J'ai eu le même problème avec Firefox la semaine dernière et une combinaison des deux réponses travaillé pour moi très bien aussi. Une différence est que j'utilise $ .load au lieu d'un iframe, donc je n'ai pas besoin d'inclure jQuery dans le pgae récupéré par AJAX bien sûr.

en chrome qui suit travaillé sur la page AJAX:

<script> 
    google.setOnLoadCallback(drawChart, true); 
</script> 

Dans Firefox cela ne fonctionne cependant pas, donc je simplement utilisé:

<script> 
    $(document).ready(function() { 
     function drawChart() {} // omitted 
     drawChart(); 
    }); 
</script> 

Ce qui a fonctionné pour moi à la fois Chrome 22 et Firefox 16.0.1