.csv binding for d3.js issue

New guy starting in d3.js, coming from PHP / python, but my JS knowledge is very weak. I am trying to bind the X / Y position to a scatter plot and I keep getting the error

Error: Invalid value for attribute d = "MNaN, NaN"

or

Error: Invalid value for attribute cx = "NaN" Error: Invalid value for attribute cy = "NaN"

and I am a bit at a loss as to what I am doing wrong. This is how I do it: a simple html page, nothing more than the required html and script (see below):

    <script>

    var margin = {top: 30, right: 20, bottom: 30, left: 50},
        width = 600 - margin.left - margin.right,
        height = 270 - margin.top - margin.bottom;

    var x = d3.scale.linear().range([0, width]);
    var y = d3.scale.linear().range([height, 0]);

    var xAxis = d3.svg.axis().scale(x)
        .orient("bottom").ticks(5);

    var yAxis = d3.svg.axis().scale(y)
        .orient("left").ticks(5);


    var valueline = d3.svg.line()
        .x(function(d) { return x(d.posX); })
        .y(function(d) { return y(d.posY); });


    var svg = d3.select("body")
        .append("svg")
            .attr("width", width + margin.left + margin.right)
            .attr("height", height + margin.top + margin.bottom)
        .append("g")
            .attr("transform",
          "translate(" + margin.left + "," + margin.top + ")");


    d3.csv("test.php", function(error, data) {
        data.forEach(function(d) {
        d.posX = +d.posX
        d.posY = +d.posY;
    });

x.domain(d3.extent(data, function(d) { return d.posX; }));
y.domain(d3.extent(data, function(d) { return d.posY; }));



svg.append("path")
    .attr("class", "line")
    .attr("d", valueline(data));


svg.selectAll("dot")
    .data(data)
  .enter().append("circle")
    .attr("r", 3.5)
    .attr("cx", function(d) { return x(d.posX); })
    .attr("cy", function(d) { return y(d.posY); });


svg.append("g")
    .attr("class", "x axis")
    .attr("transform", "translate(0," + height + ")")
    .call(xAxis);


svg.append("g")
    .attr("class", "y axis")
    .call(yAxis);

});

</script>

      

        
        
        
      

    

"test.php" invokes a mysql query that creates a csv formatted array. Here are the first five lines of the output (as seen when they navigate to localhost / test.php):

    "posX","posY"
    -10,50
    20,143
    14,128
    -40,8

      

        
        
        
      

    

etc .. A few things that I definitely noticed. I am calling d3.js; I am getting a reverse axis, just no data. The errors also reference the d3 script being called, so I'm pretty sure it works. I am happy to switch to json if this was the best method of approach. It's probably really obvious, but I can't figure it out.

Thanks for the help.

Edit: my '.csv' is created with a simple loop from the mysql array

     echo $posX . "," . $posY . "<br>";

      

        
        
        
      

    

Could this (especially br) be a problem?