You can use event delegation to solve this.

Instead of having one listener for each DOM node, you only use one listener on a parent node. Then whenever the event happens, you lookup to identify which node should be animated.

Example implementation, assuming you have the following html:

<svg id="parentNode">
    <!-- All the interactive nodes are here... -->

then this javascript does the trick:

d3.selectAll('#parentNode') // this is only one item
    .on('mouseover', function() {
        var element =
        // element is the DOM node with which you want to interact...
    .on('mouseout', function() {
        var element =
        // [...]

Related Query

More Query from same tag