1

DOM例外12の原因について、私は途方に暮れています。無効なセレクターと関係があるということは、私が見つけることができることはほとんどありません。

背景について:

たくさんの円が入ったSVGオブジェクトである散布図があります。

円にカーソルを合わせると、円が表すデータにアクセスしてツールチップを表示する必要があります。

現在、バックボーンを介してイベントをリッスンしているため(散布図はより大きなアプリケーションに分類されます)、を介して現在のターゲットであった要素ノードにアクセスできますe.currentTarget

最初のパスでは、単純に

d3.select(e.currentTarget) // from here we can access the datum() method

ただし、VML互換性レイヤーr2d3を使用する必要があるため、SVG内の要素を選択する場合は、svgから選択する必要があることに注意してください。

SVG要素のクエリは、SVGノードから発信される必要があります。使用例svg.select('rect')NOT d3.select('rect')

this.svgホバーイベントを介して、D3でラップされたSVG要素にアクセスできます。しかし、私が電話するとき:

this.svg.select(e.currentTarget)

DOM例外12が発生します。

Uncaught Error: SYNTAX_ERR: DOM Exception 12
    d3_select d3.v2.js:3578
    (anonymous function) d3.v2.js:372
    d3_selectionPrototype.select d3.v2.js:3606
    Backbone.View.extend.mouseEnterBin graph.js:828
    jQuery.each.jQuery.event.special.(anonymous function).handle jquery-1.7.2.js:3616
    jQuery.event.dispatch jquery-1.7.2.js:3332
    jQuery.event.add.elemData.handle.eventHandle

選択を試みる前に行を追加するdebugger;と、this.svg.selectAll('circle')を実行して、ノードe.currentTargetがそのセットに存在することを確認できます。

アドバイスや助けをいただければ幸いです。お時間をいただきありがとうございます。

4

1 に答える 1

2

のセレクター引数はselection.select(selector)、文字列(「円」など)または関数である必要があります。あなたの場合、それはDOMノードのようです。

https://github.com/mbostock/d3/wiki/Selections#wiki-selectを参照してください:

現在の選択の要素ごとに、指定されたセレクター文字列に一致する最初の子孫要素を選択します。..。

セレクターは、要素を返す関数として指定することもできます。一致する要素がない場合はnullを指定することもできます。..。

ノードにアクセスできる場合は、d3.select(node)(https://github.com/mbostock/d3/wiki/Selections#wiki-d3_select)を使用してノードをd3選択に変換できます。

あなたの説明から、あなたは単にe.currentTargetからD3セレクションを作成したいようです。だからd3.select(e.currentTarget)十分でしょう。

于 2013-01-08T00:13:03.663 に答える