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
.
