需要从.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文件中的数据创建谷歌图表

回答

相关问题