我收到了这个错误:
未捕获的TypeError:无法读取null的属性'ownerDocument'
这是一行将.data()
设置为最近由d3
附加的元素:
const someSet = someSelection.filter('.some:(filter)')
someSet.each((d, i, nodes) => {
const someElement = d3.select(nodes[i])
const someChild = someElement.append('g')
someChild.data(this.data) // <-- This line throws the error
.enter()
.append('circle')
.classed('some-class', true)
})
环顾我所能找到的是a source saying they had this error when the element in question hadn't yet been added to the page,但我已经确认在抛出此错误时我的元素已添加到页面中。
答案 0 :(得分:5)
事实证明,在将.data()添加到嵌套元素之前,我忘了添加一个新的空选择:
const someSet = someSelection.filter('.some:(filter)')
someSet.each((d, i, nodes) => {
const someElement = d3.select(nodes[i])
const someChild = someElement.append('g')
someChild.selectAll('circle.some-class') // added empty selection here
.data(this.data)
.enter()
.append('circle')
.classed('some-class', true)
})
如果我执行类似创建组,存储对组的引用,附加数据和追加,然后尝试将新数据附加到对组的引用({{1 }})而不是组内容的选择。例如,这将导致此错误:
<g>
所以,最后它应该是:
const someObj = {} // or some class etc
const someSet = someSelection.filter('.some:(filter)')
someSet.each((d, i, nodes) => {
const someElement = d3.select(nodes[i])
const someChild = someElement.append('g')
someObj.someChild = someChild
someChild.selectAll('circle.some-class') // added empty selection here
.data(this.data)
.enter()
.append('circle')
.classed('some-class', true)
})
// ...do stuff
someObj.someChild.data(newData)
// Error because someObj.someChild is a D3 element, not a D3 selection
...或存储的引用应该是添加数据的选择。