Help read the file and write it to a variable

I am writing an application using D3. It should build charts from input forms on a page and from a file. I have problems with the latter, I can’t read the file in any way and write it to a variable. The essence of the problem is that for reading I use the function and the value is stored in it, and the variable will need to be passed to other functions. Please help. There was of course the option of calling functions from the read function, but for some reason d3 gives an error.

Thank you for attention.

My program code.

//Добавления строки таблицы $('.btn').click(function () { var ind = $('tr:last').index(); $('.hide').clone().appendTo('table').addClass('row').removeClass('hide'); $('tr:last>td:nth-child(2)>input').addClass('x'); $('tr:last>td:nth-child(3)>input').addClass('y'); $('tr:last>td:first').text(ind); }); var rawData = []; var z = 0; var height = 500, width = 500, margin=30, data=[]; var numb; //функция построения графика var chart1 = function () { // создание объекта svg var svg = d3.select("body").append("svg") .attr("class", "axis") .attr("width", width) .attr("height", height); // функция, создающая по массиву точек линии var line = d3.svg.line() .x(function(d){return dx;}) .y(function(d){return dy;}); // добавляем путь svg.append("g").append("path") .attr("d", line(data)) .style("stroke", "steelblue") .style("stroke-width", 2); } //функция построения сетки координат var osi = function () { // создание объекта svg var svg = d3.select("body").append("svg") .attr("class", "axis") .attr("width", width + 10) .attr("height", height + 10); // длина оси X= ширина контейнера svg - отступ слева и справа var xAxisLength = width - 2 * margin; // длина оси Y = высота контейнера svg - отступ сверху и снизу var yAxisLength = height - 2 * margin; // функция интерполяции значений на ось Х var scaleX = d3.scale.linear() .domain([0, numb]) .range([0, xAxisLength]); // функция интерполяции значений на ось Y var scaleY = d3.scale.linear() .domain([numb, 0]) .range([0, yAxisLength]); // масштабирование реальных данных в данные для нашей координатной системы for(i=0; i<rawData.length; i++) data.push({x: scaleX(rawData[i].x)+margin, y: scaleY(rawData[i].y) + margin}); // создаем ось X var xAxis = d3.svg.axis() .scale(scaleX) .orient("bottom"); // создаем ось Y var yAxis = d3.svg.axis() .scale(scaleY) .orient("left"); for(i=0; i<rawData.length; i++) data.push({x: scaleX(rawData[i].x)+margin, y: scaleY(rawData[i].y) + margin}); // отрисовка оси Х svg.append("g") .attr("class", "x-axis") .attr("transform", // сдвиг оси вниз и вправо "translate(" + margin + "," + (height - margin) + ")") .call(xAxis); // отрисовка оси Y svg.append("g") .attr("class", "y-axis") .attr("transform", // сдвиг оси вниз и вправо на margin "translate(" + margin + "," + margin + ")") .call(yAxis); // создаем набор вертикальных линий для сетки d3.selectAll("gx-axis g.tick") .append("line") .classed("grid-line", true) .attr("x1", 0) .attr("y1", 0) .attr("x2", 0) .attr("y2", - (yAxisLength)); // рисуем горизонтальные линии координатной сетки d3.selectAll("gy-axis g.tick") .append("line") .classed("grid-line", true) .attr("x1", 0) .attr("y1", 0) .attr("x2", xAxisLength) .attr("y2", 0); } //функция которая читает значение переменных и записывает из в масив. //[{x: 1, y: 2} ,{x: 3, y: 4} ,{x: 5, y: 6} ,{x: 7, y: 8},{x: 9, y: 10}] так должен выглядеть масив чтобы D3 его могла прочитать. function inputToMass() { var inpx = $('.x'); var inpy = $('.y'); var x, y; var massx = []; var massy = []; var mass = {}; var cur = 0; for (i = 0; i < inpx.length; i++) { mass = {}; x = inpx[i].value; x = parseInt(x); mass.x = x; y = inpy[i].value; y = parseInt(y); mass.y = y; rawData[i] = mass; } for (i = 0; inpx.length > i; i++) { x = inpx[i].value; x = parseInt(x); massx[i] = x; y = inpy[i].value; y = parseInt(y); massy[i] = y; } for (var i = 0; i < massx.length; i++) { if (cur < massx[i]) { cur = massx[i]; } if (cur < massy[i]) { cur = massy[i]; } } var ax = cur/100*7; numb = cur + ax; } // общая функция которая при нажатии на кнопку вызывает остальные функции $('.btn2').click(function () { $('svg').remove(); inputToMass(); osi(); chart1() console.log(rawData); }); // функция чтения из файла $('.file').change(function () { var fr = new FileReader(); fr.onload = function(info) { var rezf = info.target.result; rawData = rezf; return rezf; } fr.readAsText(this.files[0]); }); 

D3 error code

 d3.v3.min.js:1 Error: <path> attribute d: Expected number, "MNaN,NaNLNaN,NaNL…". 

HTML code

  <div class="table"> <table border="1"> <tr> <th>#</th> <th>X</th> <th>Y</th> </tr> <tr class="hide"> <td></td> <td><input type="number"></td> <td><input type="number"></td> </tr> <tr class="row"> <td>1</td> <td><input class="x" type="number"></td> <td><input class="y" type="number"></td> </tr> </table> </div> <br><br> <button class="btn">Add Row</button> <button class="btn2">generate</button> <input class="file" type="file"> <pre class="cont"></pre>