D3クロスフィルターの例でバーの幅を変更します。

Question

私はcrossfliterの例を見ています。棒グラフを再作成するためにいくつかのサンプルデータを使用しますが、データはバー幅を狭くしたいと思っています。それをどうやって行うのか分からなかった。助けてくれてありがとう！ページのソースの行463で

Answer 1

、あなたが持っている：

path.push('M', x(d.key), ',', height, 'V', y(d.value), 'h9V', height); 

h9Vコントロール各バーの幅を。 h5Vに変更して、少し小さなバーを付けます。あなたはまだ関連のビンに各バーが中央たい場合は、次の変更を加える必要がありますことを心に留め：

path.push('M', x(d.key) + 2, ',', height, 'V', y(d.value), 'h5V', height); 

あなたは、可変バー幅を持たせたい場合は、あなたがこのような何かを行うことができます：

var barWidth = 0.6; 

... 

path.push('M', x(d.key) + Math.round((10-barWidth*10)/2), ',', height, 'V', y(d.value), 'h', barWidth*10,'V', height); 

注Math.round()はちょうど私たちは、最も近い全体ピクセル値を取得することを確認することです。