d3.js - How should I enqueue events in d3? -

i working on small charting library using d3 code i've written. i've been adding configuration/customization options charts various use cases, , keep running conflicting event handlers.

transitions give me trouble, question more general that. way execute set of event handlers within charts?

one method i've used build literal array of handlers, iterate on list, executing each handler:

function chart(selection) {   selection.each(function(data) {      // initial config , options, including handlers array     var margin = {top: 20, right: 20, bottom: 50, left: 40},         ...         fadeonhover = true,         barmouseouthandlers = [],         barmouseoverhandlers = [];       // create chart       // option     if (fadeonhover) {       barmousemovehandlers.push(function(d, i) {         selection.selectall('.bar').filter(function(d, j){return i!=j;})           .transition().duration(100).style('opacity', '.5');         selection.selectall('.bar').filter(function(d, j){return i==j;})           .transition().duration(100).style('opacity', '1');       });        barmouseouthandlers.push(function() {         selection.selectall('.bar').transition().duration(100).style('opacity', '1');       });     }      // other options, may add handlers      // @ end of function, execute handlers     g.selectall('.bar')       .on('mouseover', function(d, i) {         barmouseoverhandlers.foreach(function(handler) { handler(d, i); });       })       .on('mouseout', function(d, i) {         barmouseouthandlers.foreach(function(handler) { handler(d, i); });       });   }); } 

this i've come when throwing features on charts in thick of things, isn't modular or well-organized. perhaps there's room extract of these pieces separate objects.

what other approaches there? love hear of thoughts on this.

i think need "namespace" multiple events not overwrite previously-registered event(s). this:

g.selectall('.bar')   .on('mouseover.one', function(d, i) {     //   })   .on('mouseover.two', function(d, i) {     // else   }); 

from api:

to register multiple listeners same event type, type may followed optional namespace, such "click.foo" , "click.bar".