d3js線グラフの軸外線を描画

Question

チュートリアルhereを使用して、d3.jsで動的線グラフを作成しようとしています。私はほとんどそれを働かせましたが、わずかな問題があります。ビューポートを使用して日付間隔を選択し、グラフを再描画すると、軸の外に線も描画されます。下の図の左側を参照してください。

通常、私は以下のように線を引く：

var valueline = d3.svg.line() 
       .x(function (d) { 
        return xScale(d.timestamp); 
       }) 
       .y(function (d) { 
        return yScale(d.value); 
       }); 

plotChart.append("path") 
       .attr("class", "line") 
       .attr("id", "lineGraphId") 
       .attr("d", valueline(data)); 

そして、私の再描画チャート機能は以下の通りです：

function redrawChart() { 
      plotChart.select("#lineGraphId").remove(); 
      plotChart.append("path") 
        .attr("class", "line") 
        .attr("id", "lineGraphId") 
        .attr("d", valueline(data)); 
      plotChart.select('.x.axis').call(xAxis); 
     } 

私は外に描画するための解決策を見つけることができませんでした軸の私はcsvデータをロードする必要があったのでjsfiddleで自分のコードをホストできませんでしたが、すべてのソースコードhereを見ることができます。

Answer 1

はどうやら、私はredrawChart関数にコード行を追加する必要：

.attr('clip-path', 'url(#plotAreaClip)')