需要根据.txt文件中的数据创建谷歌图表

Need to create a Google Chart from data in .txt file

本文关键字:创建 数据 谷歌 txt 文件      更新时间:2023-09-26

html 和 txt 文件都在同一个文件夹中。

尝试将完整位置放在网址上,例如:/home/lp505/桌面/图表/输出.txt,但它不起作用。

尝试使用类型作为"get",它也不起作用。

我认为错误在方法绘制图表中请帮助我调试代码以创建图表

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 

我发现了一些问题...

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>