Home Forums Chart Support Plot graph froma large .txt file

Plot graph froma large .txt file

Viewing 5 posts - 1 through 5 (of 5 total)
  • #32306

    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
    around 6760150 lines of data are there

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

    //-- 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

    #32323

    @vpaswin1994,

    Can you kindly share text file you are using over Google-Drive or Onedrive so that we can run it at our end and help you with an appropriate solution?

    —-
    Manoj Mohan
    Team CanvasJS

    #32368

    I could not upload or share the .txt file. Is there any solution for that? means can u create a demo file like this?
    and i have a doubt that ,plotting can’t done because of converting large array list to json format??

    #32398

    @vpaswin1994,

    We are looking into your query and will get back to you at the earliest.

    —–
    Manoj Mohan
    Team CanvasJS

    #32483

    @vpaswin1994,

    We constructed the txt file with sample / dummy data in the format that you have shared – which was approx 150MB. We observed that the time taken to read txt-file and parse the data to the format accepted by CanvasJS is approx 7 seconds. And it’s taking few more seconds to render 7 million datapoints. We observe that in the JSFiddle that you have shared you are trying to read txt file and render chart every second which might be causing issue. We recommend you to read txt file every 30 seconds or 1 minute to improve the performance of your application. Also, you can filter / group the data to reduce number of dataPoints to be shown within a part of screen than trying to visualizing 7 millions of dataPoints. Filtering / data-grouping will also improve the performance, which you can achieve with the help of rangeChanging event as shown in this JSFiddle.

    —-
    Manoj Mohan
    Team CanvasJS

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

You must be logged in to reply to this topic.