जावास्क्रिप्ट पुस्तकालय डी 3 कॉल फ़ंक्शन


81

मुझे समझ में नहीं आ रहा है कि d3.call () कैसे काम करता है और कब और कहां उपयोग करना है। यहाँ ट्यूटोरियल लिंक है जिसे मैं पूरा करने की कोशिश कर रहा हूँ।

क्या कोई विशेष रूप से समझा सकता है कि यह टुकड़ा क्या कर रहा है

var xAxis = d3.svg.axis()
              .scale(xScale)
              .orient("bottom");

svg.append("g").call(xAxis);

आपके द्वारा दिया गया लिंक बताता है कि क्या call()है
— Ibu

17
हाँ, लेकिन फिर भी मुझे वह नहीं मिल पा रहा है जो svg.append ("g") .call (xAxis); कर रहा है :(
— एंडी

जवाबों:


112

मुझे लगता है कि यहाँ चाल यह समझने की है कि xAxis एक फ़ंक्शन है जो SVG तत्वों का एक समूह बनाता है। वास्तव में यह फ़ंक्शन द्वारा लौटाया गया है d3.svg.axis()। स्केल और ओरिएंट फ़ंक्शंस चाइनिंग सिंटैक्स का केवल एक हिस्सा है (इसके बारे में और अधिक पढ़ें: http://alignleft.com/tutorials/d3/chaining-methods/ )।

तो svg.append("g")एक SVG समूह तत्व को svg में जोड़ता है और चयन के रूप में स्वयं को संदर्भित करता है (उसी समय सिंटैक्स भी)। जब आप callएक चयन पर उपयोग करते हैं तो आप चयन xAxisके तत्वों पर नामित फ़ंक्शन कह रहे हैं g। इस मामले में आप धुरी समारोह चल रहे हैं, xAxis, पर नव निर्मित और संलग्न समूह, g।

अगर यह अभी भी समझ में नहीं आता है, तो ऊपर का सिंटैक्स इसके बराबर है:

xAxis(svg.append("g"));

या:

d3.svg.axis()
      .scale(xScale)
      .orient("bottom")(svg.append("g"));

कोई svg.axis () के G तत्वों को कैसे संपादित करेगा? मेरे पास ऐसे लेबल हैं जो एक दूसरे में खून करते हैं और मैं उनके लिए एक परिवर्तन लागू करना चाहता हूं। लेकिन मैं उन तत्वों तक पहुँचने के लिए प्रतीत नहीं हो सकता
— CQM

यहां उत्तर की जाँच करें stackoverflow.com/questions/12825630/… आपके द्वारा पाठ या टिक तत्वों का चयन करने के बाद आप चाहें तो ट्रांसफ़ॉर्म लागू करने में सक्षम होना चाहिए।
— सुपरबगली

क्या एक्सएक्सिस को कॉल करने के लिए एक या दूसरे को करने में कोई अंतर है?
— मुझे

4
यह .call()सामान्य रूप से अच्छी तरह से विधि की व्याख्या करता है । यह विशेष रूप से अक्ष वस्तु को कॉल करने के परिणामों की व्याख्या नहीं करता है। और यह एक वस्तु और एक फ़ंक्शन दोनों की तरह व्यवहार करने वाले अक्ष वस्तु की वास्तविक स्थिति को सही ठहराने के करीब नहीं आता है । दुनिया में ऐसा क्यों है? ठीक है, इसलिए डॉक्स कहते हैं कि यह धुरी प्रदान करता है । अक्ष वस्तु (।) विधि देने से बेहतर है? अधिक सीधाxAxis.scale(...).orient(...).render(...)
— बॉब स्टीन

1
डॉक्स से सेलेक्शन कॉल में: "एकमात्र अंतर यह है कि Selection.call हमेशा चयन लौटाता है, न कि फ़ंक्शन, नाम का रिटर्न वैल्यू।"
— हेलटनबीकर

5

IMO को छोड़ दिया गया स्वीकृत उत्तर क्या है जो कि .call()एक 3D API फ़ंक्शन है और इसे Function.prototype.call () के साथ भ्रमित नहीं किया जाना है

selection.call(function[, arguments…])

किसी भी वैकल्पिक तर्कों के साथ इस चयन में पास होने के लिए निर्दिष्ट फ़ंक्शन को एक बार आमंत्रित करता है। यह चयन लौटाता है। यह हाथ से फ़ंक्शन को लागू करने के बराबर है, लेकिन विधि जंजीर की सुविधा देता है। उदाहरण के लिए, पुन: प्रयोज्य फ़ंक्शन में कई शैलियों को सेट करने के लिए:

अब कहो:

d3.selectAll("div").call(name, "John", "Snow");

यह लगभग बराबर है:

name(d3.selectAll("div"), "John", "Snow");

अंतर केवल इतना है कि Selection.call हमेशा चयन को लौटाता है, न कि फ़ंक्शन , नाम का रिटर्न मान ।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.