CODEWITHSUNDEEP
javascriptd3.jsdom-eventsx3dom
John Carlson
John Carlson

Reputation: 328

Iterate over X3DOM nodes in d3.js

I'm trying to iterate over X3DOM nodes in D3.js, but I'm getting an error.

Here's the code:

  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')); }); });

and here's the error. As you can see, it's trying to use HTMLUnknownElement.node(). How do I get the above code to work with 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

Upvotes: 0

Views: 262

Answers (1)

Jegan
Jegan

Reputation: 139

It should be 

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')); }); });

Upvotes: 0

Related Questions