使用自定义函数在d3.js中创建元素

Question

我想使用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是如何工作的，因此我的问题的情况下是无效的。但是，我仍然很好奇，如果可以使用任意函数而不是附加来创建元素。

Answer 1

对于自定义功能，您可以使用.call，因此将会是.call(box)。

Answer 2

您也可以使用insert()，但不是任意函数。问题在于enter()选择中的元素还没有真正存在（即没有相应的DOM元素）。由于没有DOM元素，因此无法对它们进行操作。

更多信息请登陆the documentation。您当然可以实现您自己的自定义函数来处理enter()元素，但这需要关于d3如何在内部工作的一些知识。