In this fiddle I'm attempting to draw circles read from a file : 

<http://jsfiddle.net/zzz8svuq/17/>

But no circles are appearing.

Here I am binding the data to svg : 

```
    svg.data(data)
            .enter().append("circle")
            .attr("stroke", "red")
            .attr("stroke-width" , "2px")
            .attr("cx", xMap)

```

This is not correct ?

fiddle code : 

```
 var data = d3.csv.parse( d3.select("pre#data").text() );

        var margin = {top: 20, right: 20, bottom: 130, left: 140},
                width = 960 - margin.left - margin.right,
                height = 500 - margin.top - margin.bottom;

        var svg = d3.select("body").append("svg")
                .attr("width", 500)
                .attr("height",500)
                .append("g");

        var xValue = function (data) {
            return data.x;
        }

        xScale = d3.scale.linear().range([0, width - margin.left - margin.right]) // value -> display

        xMap = function (d) {
            return xScale(xValue(d));
        }

        svg.data(data)
                .enter().append("circle")
                .attr("stroke", "red")
                .attr("stroke-width" , "2px")
                .attr("cx", xMap)

<pre style="display:none" id="data">
    label,x,y,r
l1,100,30,50
l2,5,5,100
l3,50,50,20
</pre>

    body {
        font: 11px sans-serif;
    }

    .axis path,
    .axis line {
        fill: none;
        stroke: #000;
        shape-rendering: crispEdges;
    }

```

Update : 

Added

```
.attr("cy", 5)
.attr("r", 5)

```

but same result