2

d3.js を使用して、CodeMirror でマークされたテキストを操作したいと考えています。ただし、CodeMirror でテキストをマークするには、 を呼び出しmarkText(from,to, {class: 'my-class'})て、クラスでテキストの周りにスパンを作成しますmy-class。

データに基づいて多くのテキストをマークし、イベント処理などを追加したいと考えています。したがって、私は次のようなことをしたいと思います:

var box = d3.selectAll('box').data(myData);
box.enter().each(function(d) {cm.markText(from(d), to(d), {class: 'box'});})
box.on('mouseover', function(d) {...});
box.exit().remove();

ただし、d3 の入力選択はappend、insert、およびのみをサポートしselectます。select私はすでに（例えば）で効果を偽造しようとしましbox.enter().select(arbitraryElt).each(...)たが、うまくいきませんでした。

もちろん、データをループしてテキストをマークし、d3 を使用して必要な他の属性を適用することもできますが、それでは d3 を使用する意味がなくなります。

エレガントな方法でd3でこれを行うことは可能ですか?

編集：

markText の仕組みを完全に誤解しているため、質問のコンテキストが無効であることに気付きました。ただし、追加の代わりに任意の関数を使用して要素を作成できるかどうかはまだ興味があります。

4

2 に答える 2

2

カスタム関数に使用できる.callので、.call(box).

于 2014-06-25T18:44:03.667 に答える
0

を使用することもできますinsert()が、任意の関数を使用することはできません。問題は、enter()選択範囲内の要素が実際にはまだ存在していないことです（つまり、対応するDOM要素がありません）。DOM要素がないため、それらを操作することはできません。

ドキュメントの詳細情報。もちろん、要素を処理するための独自のカスタム関数を実装することもできますenter()が、そのためには、d3が内部でどのように機能するかについてかなりの知識が必要になります。

于 2013-03-15T10:55:16.033 に答える