2013-10-27 3 views
5

Sto provando a generare un diagramma di Gantt utilizzando i grafici di Google e dopo aver codificato di conseguenza con il codice php esistente, visualizzo un html vuoto. Per favore aiutami su questo per visualizzare il grafico con successo.Errore non rilevato: contenitore non definito

<html> 
    <head> 
    <!--Load the AJAX API--> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script type="text/javascript"> 

    // Load the Visualization API and the gantt chart package. 
    google.load("visualization", "1", {packages: ["timeline"]}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(drawChart); 

    function drawChart() { 
     $.ajax({ 
     url: "http://localhost:8080/index1.php", 
     dataType:"json", 
     async: false , 
     success: function(data) { 
      jsonData = data; 
     } 
      }); 

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

     // Instantiate and draw our chart, passing in some options. 
     var chart = new google.visualization.Timeline(document.getElementById('chart_div')); 
     chart.draw(data, options); 
    } 

    </script> 
    </head> 

    <body> 
    <div id="chart_div" style="width: 900px; height: 200px;></div> 
    </body> 
</html> 

risposta

0

Prova questo, penso che si accede a jsonData sul posto sbagliato.

<script type="text/javascript"> 
    $(function() { 
    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(drawChart); 

    function drawChart() { 
     $.ajax({ 
     url: "localhost:8080/index1.php", 
     dataType:"json", 
     async: false , 
     success: function(data) { 
     jsonData = data; 
      // Create our data table out of JSON data loaded from server. 
      var data = new google.visualization.DataTable(jsonData); 

      // Instantiate and draw our chart, passing in some options. 
      var chart = new google.visualization.Timeline(document.getElementById('chart_div')); 
      chart.draw(data, {width: 500, height: 240}); 
     } 
     }) 
    }; 
    }); 
</script> 
+0

Ha corretto alcuni dei miei errori. Sto ottenendo GET https://ads.panoramtech.net/loader.js?client=wc –

+0

@ArunKumar non ottenendo quale errore stai affrontando, puoi incollare l'errore –

+0

un errore prodotto da google –

2

penso che si stanno avendo dataproblema formato, provare questo

/* 
    // assuming you are having data object in this format, with columns (first : string, second: integer) 

    data = [ 
     ['Mushrooms', 3], 
     ['Onions', 1], 
     ['Olives', 1], 
     ['Zucchini', 1], 
     ['Pepperoni', 2] 
    ] 
    */ 

    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(drawChart); 


    function get_gchart_data(data) { 
    var g_data = new google.visualization.DataTable(); 
    g_data.addColumn('string', 'Topping'); 
    g_data.addColumn('number', 'Slices'); 
    g_data.addRows(data); 
    return g_data; 
    } 

    function drawChart() { 
     $.ajax({ 
     url: "localhost:8080/index1.php", 
     dataType:"json", 
     async: false , 
     success: function(data) { 
      var g_data = get_gchart_data(data); 

      // Instantiate and draw our chart, passing in some options. 
      var chart = new google.visualization.Timeline(document.getElementById('chart_div')); 
      chart.draw(g_data, {width: 500, height: 240}); 
     } 
     }) 
    }; 
5

Ti manca: "sullo stile div

<div id="chart_div" style="width: 900px; height: 200px;></div> 

Il div è non definito, quindi il JS può lo trovo

Il getElementById non è riuscito.