D3.js の d3.svg.line() を試してみた

circles.enter() .attr('cx', function(d, i) { return i * 280 / n + 10; }) のような座標を計算する関数が何箇所かに散らばっていた。 これ、d3.svg.line() を使ったらまとめられるし、便利な interpolate の機能も使えるよ、というのが今回のお話。 d3.svg.line() の使い方 たとえば var line = d3.svg.line() .x(function(d, i) { return i; }) .y(function(d, i) { return d * d; }); としておくことにする。line.x() とすると function(d, i) { return i; } を返してくれるので、関数を再利用してコードが読みやすくなる。line.y() も同様。 さらに、line([5,2,

[yasu-log]

【B!】D3.js の d3.svg.line() を試してみた - てっく煮ブログ