このグラフをエミュレートしようとしています: http://www.nytimes.com/interactive/2012/11/30/us/tax-burden.html
ここに必要最小限のレンディションがあります: http://jsfiddle.net/jd5Ym/6/
それぞれの都市のデータをたどるさまざまなカーソルを取得できません。一度にできることは 1 つだけです。私のコードはこの関数に依存しています:
function mousemove() {
// p is the fraction of a graph traversed. decimalize strips integers.
var p=decimilize((x0.rangeBand()-d3.mouse(this)[0]+margin.left)/(x0.rangeBand()));
var u=data[Math.round(data.length-p*data.length)];
var v=cities[1].values[Math.round(data.length-p*data.length)];
cursor.data(data).attr("transform", "translate(" + (x1(u.date)) +","+y(v.temperature)+")");
}
と書かれているところではv=cities[1]
、インデックスはどの都市のデータに従うかを決定します。各都市自体をインデックスしたいのですが、function (d,i) {...}
セットアップを使用してみるとうまくいかずmousemove
、都市の宣言の変換属性内に関数を追加しようとしましたが、それもうまくいきませんでした。
私は初心者のプログラマーなので、これは簡単かもしれません。データ構造と解析は、Mike Bostock の例から生まれました。