ツールヘルパー、より具体的にはこれをd3.layout.partition example に追加しようとしています。ポイントは、四角形 (つまり、ツリー内の要素) にカーソルを合わせると、そのセクションに関する情報を表示するツールバーが表示されることです。私は以前、次のようにサンバーストの例でツールバーを表示させることができました:
path.enter().append("path")
.attr("id", function(d, i) { return "path-" + i; })
.attr("d", arc)
.attr("fill-rule", "evenodd")
.style("fill", color)
.call(d3.helper.tooltip()
.attr({class: function(d, i) {
return d + ' ' + i + ' A';
}})
.style( {font: '10px sans-serif'} )
.text(function(d, i) {
return d.reportHTML;
})
)
.on("click", click);
しかし...パーティションの例に似たものを試すと:
g.append("svg:rect")
.attr("width", root.dy * kx)
.attr("height", function(d) { return d.dx * ky; })
.attr("class", function(d) { return d.children ? "parent" : "child"; })
.call(d3.helper.tooltip()
.attr({class: function(d, i) {
return d + ' ' + i + ' A';
}})
.style( {font: '10px sans-serif'} )
.text(function(d, i) {
return d.reportHTML;
})
)
.on("click", click);
ツールバーが表示されません。パーティションレイアウトでも機能するようにするにはどうすればよいですか?
四角形にカーソルを合わせようとしたときに Web コンソールに表示されるエラー メッセージは次のとおりです。
Uncaught TypeError: Object #<Object> has no method 'indexOf'
Uncaught TypeError: Object #<Object> has no method 'mouse'