एकाधिक डी 3 विंडो का आकार बदलने के लिए कैसे करें

Question

मेरे पास एक पृष्ठ पर तीन svg तत्व हैं, प्रत्येक डी 3 द्वारा चुने गए हैं। उत्तरदायी बनाने के लिए प्रत्येक के पास simple module I've written द्वारा असाइन किया गया अपना पृष्ठ-आकार का तर्क होता है।

समस्या यह है कि केवल अंतिम आकार का आयोजन फायरिंग है, क्योंकि ऐसा लगता है कि पहले पृष्ठ का आकार बदलना घटनाओं को अधिलेखित कर दिया गया है। क्या यह d3.select(window).on('resize', ...) का अनुमानित व्यवहार है? मैं $(window).resize(...) का आदी हूं, जो कई बार लागू होने पर ठीक काम करता है।

मैंने देखा है this previous answer सुझाव है कि डी 3 में एकाधिक आकार बदलने की घटनाएं संभव हैं। क्या मैं कुछ गूंगा कर रहा हूँ?

यहाँ एक सरल उदाहरण है मैं stuck on jsFiddle:

d3.select(window).on("resize", function() { 
    d3.select("#d3console").append("div").html("d3 resize event A!"); 
}); 

d3.select(window).on("resize", function() { 
    d3.select("#d3console").append("div").html("d3 resize event B!"); 
}); 

$(window).bind("resize", function() { 
    d3.select("#jQconsole").append("div").html("jQ resize event A!"); 
}); 

$(window).bind("resize", function() { 
    d3.select("#jQconsole").append("div").html("jQ resize event B!"); 
}); 

कौन सा आउटपुट:

d3 resize event B! 
d3 resize event B! 
jQ resize event A! 
jQ resize event B! 
jQ resize event A! 
jQ resize event B! 

मैं जानता हूँ कि एक एक श्रृंखला like so में पिछले आकार बदलने कार्यों shunting रख सकते हैं। बस डी 3 से अलग व्यवहार की उम्मीद है।

Answer 1

आपको श्रोताओं को नाम देने की आवश्यकता है उदा। on('resize.one') और on('resize.two')

API Docs से:

एक घटना श्रोता पहले से ही चयनित तत्व पर एक ही प्रकार के लिए पंजीकृत किया गया है, तो इससे पहले कि नया श्रोता जोड़ा जाता है मौजूदा श्रोता निकाल दिया जाता है। एक ही घटना प्रकार के लिए एकाधिक श्रोताओं को पंजीकृत करने के लिए, प्रकार को वैकल्पिक नामस्थान, जैसे "click.foo" और "click.bar" के बाद किया जा सकता है।