1

この例では、各ノードのテキストをクリック可能なリンクにするにはどうすればよいですか?

このコードに似たものを試しましたが、値をクリックできませんでした:

var links = text.append("a").attr("xlink:href", "http://www.google.com/");

// A copy of the text with a thick white stroke for legibility.
links.append("svg:text")
    .attr("x", 8)
    .attr("y", ".31em")
    .attr("class", "shadow")
    .text(function(d) { return d.name; });

 links.append("svg:text")
    .attr("x", 8)
    .attr("y", ".31em")
    .text(function(d) { return d.name; });

編集/解決策:cssに次の属性があることがわかりました:pointer-events:none; 私はそれを削除してから、エリヤが提案したように使用しなければなりませんでした.

4

1 に答える 1

2

リンクを使用せず、ドロップしてテキストに直接追加すると、<g>機能するはずです。

text.append("svg:text")
        .attr("x", 8)
        .attr("y", ".31em")
        .attr("class", "shadow")
        .text(function(d) { return d.name; })
        .on("click", function() {yourFunction(yourVar)})
        .on("mouseover", function() {yourFunction2(yourVar)})
        .on("mouseout", function() {yourFunction3(yourVar)})
;

また、バインドされたデータを渡したい場合は、次のようにします。

.on("click", function(d) {yourFunction(d.yourVar)}

一方、実際の d オブジェクトを渡したい場合は、次のようにできます。

.on("click", yourFunction}

その場合、 yourFunction(d,i) はバインドされたデータから d.whatever を参照できます。

于 2012-09-25T19:42:34.260 に答える