d3.v3.min.js：1错误：<path>属性d：预期数字，＆＃34; MNaN，NaNZ＆＃34;

Question

我正在编写一个绘图应用程序。要输入数据，使用带有表单的表，可以从文件中下载更多数据。 从表中一切都很好（好吧，差不多）。但是如果从文件加载，则线程会出错。我一直在各种论坛上搜索和写作。没有人帮助我，请帮助我。 我认为由于某种原因在变量日期写的NAN怀疑问题是在数据类型中我需要解析的东西，但我无法理解什么和如何。请帮忙。

这是一个文件结构，一个标准的JSON

[{"x": 1, "y": 2} ,{"x": 3, "y": 4} ,{"x": 5, "y": 6} ,{"x": 7, "y": 8},{"x": 9, "y": 10}];

这是我的代码：

＆＃13;

＆＃13;

    $('.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 height = 500, 
    width = 500, 
    margin=30,
    data=[],
    numb;
    var osi = function () {
    var svg = d3.select("body").append("svg")
        .attr("class", "axis")
        .attr("width", width )
        .attr("height", height );

    var xAxisLength = width - 2 * margin;     
  
    var yAxisLength = height - 2 * margin;
  
    var scaleX = d3.scale.linear()
        .domain([0, numb])
        .range([0, xAxisLength]);
             
    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});

        
    var xAxis = d3.svg.axis()
        .scale(scaleX)
        .orient("bottom");
    
    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);
 
    svg.append("g")       
        .attr("class", "y-axis")
        .attr("transform", // сдвиг оси вниз и вправо на margin
            "translate(" + margin + "," + margin + ")")
        .call(yAxis);
   
    d3.selectAll("g.x-axis g.tick")
        .append("line")
        .classed("grid-line", true)
        .attr("x1", 0)
        .attr("y1", 0)
        .attr("x2", 0)
        .attr("y2", - (yAxisLength));
     
    d3.selectAll("g.y-axis g.tick")
        .append("line")
        .classed("grid-line", true)
        .attr("x1", 0)
        .attr("y1", 0)
        .attr("x2", xAxisLength)
        .attr("y2", 0);
    }


    var chart1 = function () {
    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 d.x;})
        .y(function(d){return d.y;});

    svg.append("g").append("path")
    .attr("d", line(data))
    .style("stroke", "steelblue")
    .style("stroke-width", 2);
    }

    var inputToMass = function () {
    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();
    });
    
    $.getJSON('ААА.json',function (info) {
    rawData = info;
    osi();
    chart1();
    });

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>

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

		<button class="btnhelp">HELP</button>
	
</body>

＆＃13;

＆＃13;

＆＃13;