需要從.txt文件中的數據創建谷歌圖表

試圖把完整的位置，像URL：/home/lp505/Desktop/chart/output.txt，但它沒有奏效。

嘗試使用類型爲'get'，它也沒有工作。

我認爲錯誤是在方法drawchart 請幫我調試的代碼創建一個圖表

HTML代碼

<html> 
    <head> 
    <!--Load the AJAX API--> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 

     google.load('visualization', '1.0', {'packages':['corechart']}); 
     google.setOnLoadCallback(drawChart); 

function drawChart() { 
    $.ajax({ 
     url: 'output.txt', 
     type: 'text', 
     success: function (txt) { 
      var dataArray = [['Name', 'Date']]; 
      var txtArray = txt.split('\n'); 
      for (var i = 0; i < txtArray.length; i++) { 
       var tmpData = txtArray[i].split(/\s+/); 
       dataArray.push(tmpData[0], parseInt(tempData[1])); 
      } 
      var data = google.visualization.arrayToDataTable(dataArray); 
      var chart = new google.visualization.LineChart(document.querySelector('chart_div')); 
     var options = {'title':'What is this','width':400,'height':300}; 
      chart.draw(data,options); 
     } 
    }); 
} 
google.load('visualization', '1', {packages:['corechart'], callback: drawChart}); 

    </script> 
    </head> 
    <body> 
    <div id="chart_div"></div> 
    </body> 
</html>

txt文件

Screen_Home 13 
Screen_Home 26 
Screen_Explore 26 
Screen_Explore 27 
Screen_Home 27 
Screen_Home 28

來源

2016-01-13 maker

我發現了幾個問題...

1）一定要包括JQuery，沒看出來你HTML
2）設置AJAX調用get
3）tmpData在這裏拼寫錯誤類型 - >parseInt(tempData[1])
4）數據中的每一行應值

從一個陣列：dataArray.push(tmpData[0], parseInt(tempData[1]));
到：dataArray.push([tmpData[0], parseInt(tmpData[1])]);

5）當上id使用querySelector，一定要與#

這個前綴應該引起您的圖表......

<script src="https://www.google.com/jsapi"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script type="text/javascript"> 
    google.load('visualization', '1.0', {'packages':['corechart']}); 
    google.setOnLoadCallback(drawChart); 

    function drawChart() { 
     $.ajax({ 
      url: 'output.txt', 
      type: 'get', 
      success: function (txt) { 
       var dataArray = [['Name', 'Date']]; 
       var txtArray = txt.split('\n'); 
       for (var i = 0; i < txtArray.length; i++) { 
        var tmpData = txtArray[i].split(/\s+/); 
        dataArray.push([tmpData[0], parseInt(tmpData[1])]); 
       } 
       var data = google.visualization.arrayToDataTable(dataArray); 
       var chart = new google.visualization.LineChart(document.querySelector('#chart_div')); 
       var options = {'title':'What is this','width':400,'height':300}; 
       chart.draw(data,options); 
      } 
     }); 
    } 

    google.load('visualization', '1', {packages:['corechart'], callback: drawChart}); 
</script> 

<div id="chart_div"></div>

來源

2016-01-13 19:50:23 WhiteHat

希望這可以幫助，讓我知道如果我錯過了什麼... – WhiteHat

na ...它只顯示空的html頁面 - @WhiteHat – maker

適用於我，請更新您的問題與最新的嘗試... – WhiteHat

需要從.txt文件中的數據創建谷歌圖表

回答

相關問題