简体   繁体   English

Javascript 读取txt文件

[英]Javascript reading txt file

I have found some code where I can make a javascript chart with.The values are loaded from a website.我找到了一些代码,我可以在其中制作 javascript 图表。这些值是从网站加载的。 But now I want to load the values from a local txt file like: :C:\Users\OneDrive\Bureaublad\Cha但现在我想从本地 txt 文件加载值,如::C:\Users\OneDrive\Bureaublad\Cha

The code代码

    <!DOCTYPE HTML>
<html>
<head>
<script>
//chart
window.onload = function() {

  var dataPoints = [];

  var chart = new CanvasJS.Chart("chartContainer", {
    theme: "light2",
    title: {
      text: "Live Data"
    },
    data: [{
      type: "line",
      dataPoints: dataPoints
    }]
  });
  updateData();

  // Initial Values
  var xValue = 0;
  var yValue = 10;
  var newDataCount = 6;

  function addData(data) {
    if (newDataCount != 1) {
      $.each(data, function(key, value) {
        dataPoints.push({
          x: value[0],
          y: parseInt(value[1])
        });
        xValue++;
        yValue = parseInt(value[1]);
      });
    } else {
      //dataPoints.shift();
      dataPoints.push({
        x: data[0][0],
        y: parseInt(data[0][1])
      });
      xValue++;
      yValue = parseInt(data[0][1]);
    }

    newDataCount = 1;
    chart.render();
    setTimeout(updateData, 1500);
  }
   function updateData() {
var rawFile = new XMLHttpRequest();
    rawFile.open("GET", "file:///C:\Users\nickv\OneDrive\Bureaublad\Cha\test.txt", false);
    rawFile.onreadystatechange = function ()
    {
        if(rawFile.readyState === 4)
        {
            if(rawFile.status === 200 || rawFile.status == 0)
            {
                var allText = rawFile.responseText;
                addData(allText);
            }
        }
    }
}
  }

}


</script>
</head>
<body>

<div id="chartContainer" style="height: 370px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script src="https://canvasjs.com/assets/script/jquery.canvasjs.min.js"></script>
</body>
</html>

But I want it to use a local txt file.但我希望它使用本地 txt 文件。

In the txt file: [[0, 7], [1, 12], [2, 7], [3, 3], [4, 0], [5, 4]]在txt文件中:[[0, 7], [1, 12], [2, 7], [3, 3], [4, 0], [5, 4]]

Anyone knows how to do this任何人都知道如何做到这一点

Change path of the file.更改文件的路径。 $.getJSON("https://www.mywebsite/thetextfile.txt", addData); to $.getJSON("C:\Users\OneDrive\Bureaublad\Cha.txt", addData);$.getJSON("C:\Users\OneDrive\Bureaublad\Cha.txt", addData); . .

I have found some code where I can make a javascript chart with.The values are loaded from a website.我找到了一些代码,可以在其中制作 javascript 图表。这些值是从网站加载的。 But now I want to load the values from a local txt file like: :C:\Users\OneDrive\Bureaublad\Cha但现在我想从本地 txt 文件中加载值,例如: :C:\Users\OneDrive\Bureaublad\Cha

The code编码

    <!DOCTYPE HTML>
<html>
<head>
<script>
//chart
window.onload = function() {

  var dataPoints = [];

  var chart = new CanvasJS.Chart("chartContainer", {
    theme: "light2",
    title: {
      text: "Live Data"
    },
    data: [{
      type: "line",
      dataPoints: dataPoints
    }]
  });
  updateData();

  // Initial Values
  var xValue = 0;
  var yValue = 10;
  var newDataCount = 6;

  function addData(data) {
    if (newDataCount != 1) {
      $.each(data, function(key, value) {
        dataPoints.push({
          x: value[0],
          y: parseInt(value[1])
        });
        xValue++;
        yValue = parseInt(value[1]);
      });
    } else {
      //dataPoints.shift();
      dataPoints.push({
        x: data[0][0],
        y: parseInt(data[0][1])
      });
      xValue++;
      yValue = parseInt(data[0][1]);
    }

    newDataCount = 1;
    chart.render();
    setTimeout(updateData, 1500);
  }
   function updateData() {
var rawFile = new XMLHttpRequest();
    rawFile.open("GET", "file:///C:\Users\nickv\OneDrive\Bureaublad\Cha\test.txt", false);
    rawFile.onreadystatechange = function ()
    {
        if(rawFile.readyState === 4)
        {
            if(rawFile.status === 200 || rawFile.status == 0)
            {
                var allText = rawFile.responseText;
                addData(allText);
            }
        }
    }
}
  }

}


</script>
</head>
<body>

<div id="chartContainer" style="height: 370px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script src="https://canvasjs.com/assets/script/jquery.canvasjs.min.js"></script>
</body>
</html>

But I want it to use a local txt file.但我希望它使用本地 txt 文件。

In the txt file: [[0, 7], [1, 12], [2, 7], [3, 3], [4, 0], [5, 4]]在txt文件中:[[0, 7], [1, 12], [2, 7], [3, 3], [4, 0], [5, 4]]

Anyone knows how to do this任何人都知道如何做到这一点

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM