折れ線グラフのパスに円を追加する方法d3.js

Question

これは私のグラフです。

http://plnkr.co/edit/Cej2NcyUWysAsKiMAEXj?p=preview

私は線経路に沿った各データポイントに円を追加しようとしているが、それを行うための方法を見つけるように見えることはできません。

グラフの円/線を描画するコードは次のとおりです。

var selectLine = svg.selectAll(".line") 
    .data([data]) 

    var selectCircle = svg.selectAll(".circle") 
    .data([data]) 

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

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

    selectLine.enter().append("path") 
    .attr("class", "line") 
    .attr("d", line); 

    selectCircle.enter().append("circle") 
    .attr("class", "circle") 
    .attr("r", 3.5) 
    .attr("cx", function(d) { 
     return x(new Date(2016, moment(d.date, 'MMMM').format('M') - 1, 1)) 
    }) 
    .attr("cy", function(d) { 
     return y(d.close) 
    }) 

すべてのヘルプ/アドバイスははるかに高く評価されます！

var selectCircle = svg.selectAll(".circle") 
.data(data) 

へ

おかげ

Answer 1

変更

var selectCircle = svg.selectAll(".circle") 
.data([data]) 

あなたは各点が別々のアイテムとして扱われるようにしたいので

はhttp://plnkr.co/edit/NCQyDtykbxjlvK687WIu?p=preview

を参照してください。