d3 круги создаются, но не появляются и пропускают первое значение массива

Question

Почему этот код создает видимые элементы круга с каждым значением в массиве, связываемом.

var expenses = [{"name":"jim","amount":34,"date":"11/12/2015"}, {"name":"carl","amount":120.11,"date":"11/12/2015"}, {"name":"jim","amount":45,"date":"12/01/2015"}, {"name":"stacy","amount":12.00,"date":"01/04/2016"}, {"name":"stacy","amount":34.10,"date":"01/04/2016"}, {"name":"stacy","amount":44.80,"date":"01/05/2016"} ];

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

svg;
d3.select("svg").selectAll("circle").data(expenses).enter().append("circle").attr("r","15").attr("cy",60).attr("cx",function(d,i){return (i*40) ;});

в то время как этот код создает элементы круга, но они не видны на экране и первое значение вмассив отсутствует в привязке.

var expenses = [{"name":"jim","amount":34,"date":"11/12/2015"}, {"name":"carl","amount":120.11,"date":"11/12/2015"}, {"name":"jim","amount":45,"date":"12/01/2015"}, {"name":"stacy","amount":12.00,"date":"01/04/2016"}, {"name":"stacy","amount":34.10,"date":"01/04/2016"}, {"name":"stacy","amount":44.80,"date":"01/05/2016"} ];

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

d3.select("svg").data(expenses).enter().append("circle").attr("r","15").attr("cy",60).attr("cx",function(d,i){return (i*40) ;});

Я подозреваю, что второй код пытается привязать первое значение массива к svg, а затем добавляет остальные как кружки, но даже если это было так, это необъясните, почему они не появляются (а вместо этого создаются в теле html).