Home forums Chart Support Plot graph from a large size .txt file

Tagged: , ,

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #32307

    I want to plot graph from a large .txt file (file size around 600 MB)
    file format is like below
    x y

    -960.147480 0.893751
    -960.139288 0.893751
    -960.131096 0.893751
    -960.122904 0.893751
    -960.114712 0.893751
    -960.106520 0.893751
    -960.098328 0.893751
    -960.090136 0.893751
    -960.081944 0.893751
    -960.073752 0.893751
    -960.065560 0.893751
    -960.057368 0.893751
    -960.049176 0.893751
    -960.040984 0.893751
    -960.032792 0.893751
    -960.024600 0.893751
    -960.016408 0.893751
    -960.008216 0.893751
    -960.000024 0.893751
    -959.991832 0.893751
    -959.983640 0.893751
    -959.975448 0.893751
    -959.967256 0.893751
    -959.959064 0.893751
    -959.950872 0.893751
    -959.942680 0.893751
    -959.934488 0.893751
    -959.926296 0.893751
    this is sample data
    there are around 6760150 lines of data is in that .txt file

    the code is below `<input type=”file” id=”input”>
    <div id=”chartContainer” style=”height: 360px; width: 100%;”></div>`

    var chart = new CanvasJS.Chart("chartContainer", {
      theme: "theme2",
       zoomEnabled: true, 
       zoomType: "xy",
      title: {
        text: "Live Chart from Text File"
      },
      data: [
        {
          type: "spline",
          dataPoints: []
        }
      ]
    }); 
    
    //-- Event handler for the input tag
    var inputElement = document.getElementById("input");
    inputElement.addEventListener("change", handleFiles, false);
    
    function handleFiles() {
      var fileList = this.files;
      var reader = new FileReader();
    
      setInterval(function() {
        reader.readAsText(fileList[0]);
        reader.onload = function() {
          renderChart(reader);
        }
      }, 1000);
    }
    
    function renderChart(reader) {
      var strDps = reader.result;  
      var dps = [];
      
      strDps = strDps.split("\n");
    
      for(var i = 0; i < strDps.length; i++) {
        dps.push({x: parseInt(strDps[i].split(" ")[0]),
                  y: parseInt(strDps[i].split(" ")[1])
                 });
      }
      chart.options.data[0].dataPoints = dps;
      chart.render();
    }

    jsfiddle link is http://jsfiddle.net/06fkn4es/1/

    i can’t plot the graph when the size is around 600 MB
    Please give a solution

    #32324

    @vpaswin1994,

    Considering this thread as duplicate of Plot graph from a large size .txt file and hence closing the same.

    —-
    Manoj Mohan
    Team CanvasJS

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.