Question

我试图在D3.js中迭代X3DOM节点，但我收到了错误。

以下是代码：

  var disktransform = scene.selectAll('.disktransform');
  var shape = disktransform
                  .datum(slices)
                  .selectAll('.shape')
                  .data(partition.nodes)
            .enter()
            .append('shape')
                    .attr('class', 'shape')
                    .attr('data-name', function(d, i) { return d.name + ' ' + i; })

  shape
            .append('appearance')
            .append('material')
                    .attr('diffuseColor', function (d, i) { return color(d.name); })
    ;
  d3.selectAll('shape.shape').each(function (d) { console.log(d); d.node().addEventListener('click', function (event) { alert('key'); alert(d.attr('data-name')); }); });

这是错误。如您所见，它正在尝试使用HTMLUnknownElement.node（）。如何让上述代码与X3DOM一起使用？

TypeError: d.node is not a function at HTMLUnknownElement.<anonymous> (cross_chart.js:136) at d3.js:962 at d3_selection_each (d3.js:968) at Array.d3_selectionPrototype.each (d3.js:961) at CrossChart.addPath (cross_chart.js:136) at HTMLDivElement.<anonymous> (cross_chart.js:263) at d3.js:962 at d3_selection_each (d3.js:968) at Array.d3_selectionPrototype.each (d3.js:961) at Array.CrossChart.draw (cross_chart.js:196) (anonymous function) @ angular.js:10126 $get @ angular.js:7398 $get.Scope.$digest @ angular.js:12669 $get.Scope.$apply @ angular.js:12915 done @ angular.js:8450 completeRequest @ angular.js:8664 xhr.onreadystatechange @ angular.js:8603

Answer 1

应该是

d3.selectAll('shape.shape').each(function (d) { console.log(d); d3.select(this).node().addEventListener('click', function (event) { alert('key'); alert(d3.select(this).attr('data-name')); }); });

迭代d3.js中的X3DOM节点

1 个答案: