2

我想使用 d3.js 与 CodeMirror 中的标记文本进行交互。但是，要在 CodeMirror 中标记文本，您需要调用markText(from,to, {class: 'my-class'})它并使用 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 的工作原理，因此我的问题的上下文是无效的。但是，我仍然很好奇是否可以使用任意函数而不是 append 创建元素。

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 回答