Question

仅使用d3我可以使用以下js将idAttr var值设置为'myId'：

var idAttr = d3.select(document.getElementById('imgMap').contentDocument).select('#myId').attr('id');

但是，如果我在页面中添加一个jquery src并在document.ready（）处理程序中包含上面的行，那么jQuery会抛出以下异常：

jQuery.Deferred exception: Cannot read property 'getAttribute' of null TypeError: Cannot read property 'getAttribute' of null
    at zi.K_ [as attr] (https://d3js.org/d3.v4.min.js:6:24649)
    at HTMLDocument.<anonymous> (http://localhost:8080/svg-tester-2.html:18:100)
    at j (https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js:2:29588)
    at k (https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js:2:29902) undefined

我猜jQuery试图覆盖d3的attr（）函数实现。我需要将我的逻辑放在document.ready（）函数中。我确信其他人遇到过这种行为/挑战。在同一页面上使用d3和jquery有什么好的解决方案？

Answer 1

这可能有点晚了，因为我看到这个问题是在大约 5 年前发布的。但是通读这些答案，我觉得最初的问题/情况没有得到完全解答。

我有像@user6867266（原始海报）这样的情况，我同时使用 jQuery 和 D3。我看到了一篇建议如何将 HTML 元素包装在 D3 中的 JavaScript 变量中的帖子。答案是d3.select(var holding html element)。

但是，当您这样做时，看起来 _parent 成员变量设置为 NULL - 我在浏览器调试模式下进行了验证。现在，如果你调用 .attr() 成员函数，你会得到帖子中提到的错误。

现在，您只需通过传递 css 选择器字符串来获得一个纯 D3 Selector 对象，您将看到 _parent 成员字段不是 NULL 并且 .attr() 成员函数按预期工作。

如何在同一页面上使用j3与d3？

1 个答案: