विस्तृत draw.io अनुभाग के लिए समेटे जा सकने वाले कंटेनर का उपयोग करें और अवलोकन-स्तर के कनेक्शनों को उस कंटेनर से जोड़ें। इससे समेटे हुए दृश्य में एक अर्थपूर्ण अंतिम बिंदु मिलता है और बाहर की आकृतियों के बीच सीधा कनेक्शन अपने-आप बनने के लिए फ़ोल्डिंग पर निर्भर नहीं रहना पड़ता।
यह मार्गदर्शिका उन लोगों के लिए है जो Mac पर draw.io Desktop में आरेख संपादित करते हैं और किसी एक अनुभाग के भीतर के विवरण तथा पढ़ने योग्य अवलोकन के बीच आना-जाना चाहते हैं। draw.io का आधिकारिक दस्तावेज़ पुष्टि करता है कि उसका स्वतंत्र डेस्कटॉप अनुप्रयोग macOS पर चलता है। draw.io ऑफ़लाइन चलाएँ
तय करें कि समेटे हुए अनुभाग का अर्थ क्या होना चाहिए
एक छोटे, काल्पनिक उदाहरण से शुरू करें: Input A लेबल वाली बाहर की एक आकृति, Section B लेबल वाला एक अनुभाग और Output C लेबल वाली बाहर की एक आकृति। Section B के भीतर B1, B2 और B3 लेबल वाली तीन विवरण-आकृतियाँ रखें और उन्हें क्रम से जोड़ें।
अवलोकन का उद्देश्य सरल है: Input A, Section B से जुड़ता है और Section B, Output C से। अनुभाग को फैलाने पर पता चलता है कि उसके तीन आंतरिक चरण एक-दूसरे से कैसे जुड़े हैं। विवरण छिपे होने पर भी अनुभाग अवलोकन में अर्थपूर्ण बना रहता है।
यह संरचना दो दस्तावेज़ित सुविधाओं का उपयोग करती है: कंटेनर में अन्य आकृतियाँ रखी जा सकती हैं और उन्हें फ़ोल्ड किया जा सकता है; कनेक्टर कंटेनर की सीमाएँ पार कर सकते हैं। हालाँकि, कंटेनर का दस्तावेज़ यह नहीं बताता कि किसी भी मनमानी शृंखला को फ़ोल्ड करने से उसके बाहर की पड़ोसी आकृतियों के बीच नया सीधा कनेक्शन बन जाता है। फ़ोल्डिंग का उपयोग विवरण दिखाने या छिपाने के लिए करें; अवलोकन के संबंधों को स्पष्ट रूप से तय करें। कंटेनर आकृतियों पर समेटने/फैलाने की सुविधा चालू या बंद करें
पाठकों को क्या समझना है, उसके अनुसार संरचना चुनें:
| पाठक का सवाल | सुझाई गई संरचना | अवलोकन में बना रहने वाला अर्थ |
|---|---|---|
| कौन-से अनुभाग जुड़े हैं? | बाहर की आकृतियों को अनुभाग के कंटेनर से जोड़ें। | अनुभाग समग्र प्रवाह में भाग लेता है। |
| बाहर से कौन-सा सटीक आंतरिक चरण जुड़ता है? | उस आंतरिक आकृति से कनेक्शन बनाए रखें और संबंध को स्पष्ट रूप से लेबल करें। | विस्तृत अंतिम बिंदु मॉडल का हिस्सा बना रहता है; फ़ोल्ड की दोनों अवस्थाएँ देखें। |
| क्या पूरा अनुभाग गायब होकर बाहर की दोनों आकृतियों के बीच एक सीधा तीर छोड़ सकता है? | यदि वह संबंध सही है, तो अवलोकन के लिए एक स्पष्ट निरूपण बनाएँ। | सीधा संबंध बनाया गया सारांश है, फ़ोल्डिंग का माना हुआ परिणाम नहीं। |
यह निर्णय-सहायक दस्तावेज़ित सुविधाओं से निकली आरेख-डिज़ाइन की सलाह है। इससे केवल इसलिए किसी कनेक्टर को नया अर्थ नहीं दिया जाता कि कुछ आकृतियाँ अब दिखाई नहीं दे रही हैं।
Mac पर समेटे जा सकने वाला अनुभाग बनाएँ
मौजूदा आरेख की संरचना बदलते समय उसकी एक प्रति पर काम करें। नया आरेख बना रहे हों, तो पहले छोटा उदाहरण बनाएँ और फिर वही व्यवस्था बड़े अनुभागों पर लागू करें।
विवरण जोड़ने से पहले कंटेनर बनाएँ
एक आयत जोड़ें और उसे इतना बड़ा बनाएँ कि तीनों आंतरिक आकृतियाँ उसमें आ जाएँ। सिर्फ़ उस आयत को चुनें और Cmd+G दबाएँ। आधिकारिक कंटेनर मार्गदर्शिका में आकृति को कंटेनर बनाने के लिए Mac का यह शॉर्टकट दिया गया है। Extras > Collapse/Expand चालू करें; चेक मार्क से पता चलता है कि सुविधा चालू है। Minimal थीम में दस्तावेज़ित रास्ता है: राइट-क्लिक करें और फिर Options > Collapse/Expand चुनें। कंटेनर सेटअप और फ़ोल्डिंग नियंत्रण
कंटेनर को Section B नाम दें। यह नाम इतना छोटा रखें कि अवलोकन के आकार पर भी अनुभाग पहचाना जा सके। शीर्षक के पास फ़ोल्डिंग नियंत्रण के लिए जगह छोड़ें; वहाँ किसी विवरण-आकृति को ठीक ऊपर न रखें।
कंटेनर के भीतर B1, B2 और B3 जोड़ें, फिर उन्हें क्रम से जोड़ें। Input A और Output C को बाहर रखें। ये नाम और व्यवस्था केवल उदाहरण के लिए हैं: इनका उद्देश्य पैरेंट अनुभाग और उसकी सामग्री को आसानी से अलग पहचानने योग्य बनाना है।
मौजूदा आकृतियों और आंतरिक कनेक्टरों के समूह के लिए भी draw.io में उन्हें एक साथ चुनकर Arrange > Group चुनने या Cmd+G दबाने की सुविधा है। चयन में आंतरिक कनेक्टर शामिल करें। बाहर की आकृतियों को समूह से बाहर रखें। आकृतियों और कनेक्टरों को समूहित और समूह से अलग करें
सुनिश्चित करें कि अनुभाग को फ़ोल्ड किया जा सकता है
अनुभाग का फ़ोल्डिंग नियंत्रण क्लिक करके उसे समेटें, फिर फैलाने के लिए दोबारा क्लिक करें। मौजूदा समूह दस्तावेज़ में फ़ोल्ड किए जा सकने वाले सेल के लिए −/+ नियंत्रण बताया गया है और collapsible=1 को उस शैली सेटिंग के रूप में पहचाना गया है जो किसी सेल को फ़ोल्ड करने योग्य बनाती है। वैश्विक विकल्प चालू करने के बाद किसी साधारण समूह में नियंत्रण न दिखे, तो आरेख को बार-बार समूहित करने के बजाय चुने गए सेल की सेटिंग देखें। दस्तावेज़ित शैली सेटिंग Edit Style… या Arrange टैब के Properties अनुभाग में मिलती हैं। समूहों को समेटें और फैलाएँ
अवलोकन कनेक्टर जोड़ने से पहले पुष्टि करें कि अनुभाग समेटने पर अपेक्षित विवरण छिप जाते हैं और उसका नाम पढ़ने योग्य रहता है। अगर कोई चीज़ समेटे हुए अनुभाग से बाहर रह जाती है, तो यह मानने के बजाय कि दृश्य रूप से ऊपर होने से वह कंटेनर का हिस्सा बन गई, उसकी सदस्यता जाँचें।
अवलोकन कनेक्शनों को अनुभाग से जोड़ें
उदाहरण में Input A से Section B की सीमा तक एक कनेक्टर बनाएँ और Section B से Output C तक दूसरा। ये दोनों कनेक्शन समग्र आरेख में अनुभाग की जगह बताते हैं। आंतरिक B1–B2–B3 क्रम उसके विवरण को दर्शाता है।
जहाँ सटीक जुड़ाव की जगह मायने न रखती हो, वहाँ फ़्लोटिंग कनेक्शन का उपयोग करें। स्रोत आकृति पर दिशा-सूचक तीर से कनेक्टर खींचें, फिर लक्ष्य पर तब छोड़ें जब उसकी रूपरेखा नीली हो। आरेख बदलने पर फ़्लोटिंग अंतिम बिंदु आकृति की परिधि पर खिसक सकते हैं। स्थिर कनेक्शन के लिए हरे रंग में उभरे कनेक्शन बिंदुओं से शुरू करें और वहीं समाप्त करें। स्थिर अंतिम बिंदु उन्हीं बिंदुओं से जुड़े रहते हैं। स्थिर और फ़्लोटिंग कनेक्टरों का अंतर देखें
इस अवलोकन के लिए फ़्लोटिंग अंतिम बिंदु शुरुआत में ठीक हैं, क्योंकि मुख्य बात यह है कि कौन-सा अनुभाग जुड़ता है। जब कोई खास किनारा या कनेक्शन की जगह अर्थ रखती हो, तो स्थिर अंतिम बिंदु चुनें। दोनों में से कोई विकल्प समेटे और फैलाए गए दृश्यों को देखने की ज़रूरत खत्म नहीं करता।
अगर तीरों से अर्थ स्पष्ट न हो, तो Input to B और Output from B जैसे लेबल जोड़ें। जहाँ लेबल दिखना चाहिए वहाँ कनेक्टर पर डबल-क्लिक करें। लेबल को दूसरी जगह ले जाने के लिए उसे चुनें और उसके डायमंड हैंडल को खींचें। कनेक्टरों को लेबल करें
अगर संबंध वास्तव में B2 से जुड़ा है, तो वह विस्तृत कनेक्शन बनाए रखें। जब तक व्यापक कथन भी सही न हो, उसे कंटेनर कनेक्शन से न बदलें। एक उपयोगी लेबल Input to B2 हो सकता है, साथ में ऐसा अनुभाग नाम जो अवलोकन में भी समझ में आए। आधिकारिक दस्तावेज़ कंटेनर की सीमाओं के पार कनेक्शन की अनुमति देता है, लेकिन केवल इस अनुमति से यह साबित नहीं होता कि फ़ोल्ड करने के बाद हर विस्तृत अंतिम बिंदु कितनी स्पष्टता से दिखेगा। उस विशेष आरेख को दोनों अवस्थाओं में देखें। कंटेनर की सीमाओं के पार कनेक्शन
पारदर्शी लेआउट-कंटेनर के जाल से बचें
Arrange > Insert > Layout से बनाया गया कंटेनर, जुड़ने योग्य दिखाई देने वाली सीमा वाले अनुभाग से अलग विकल्प है। आधिकारिक लेआउट मार्गदर्शिका के अनुसार, डाले गए इन लेआउट कंटेनरों की सीमाएँ पारदर्शी होती हैं और उन पर कनेक्शन नहीं जोड़े जा सकते; कनेक्टरों को उनके भीतर की आकृतियों से जोड़ना पड़ता है। यह मार्गदर्शिका Advanced लेआउट आकृतियों में अंतर भी बताती है, जिन्हें ऐसे स्विमलेन घेरे रहते हैं जो कनेक्शन स्वीकार कर सकते हैं। Advanced लेआउट आकृतियाँ और लेआउट कंटेनर
अगर आपके अवलोकन में अनुभाग की सीमा से जुड़े तीर चाहिए, तो ऐसा कंटेनर या स्विमलेन इस्तेमाल करें जिससे कनेक्शन जोड़े जा सकें। पारदर्शी लेआउट कंटेनर तब चुनें जब उसके भीतर की आकृतियों को अपने-आप व्यवस्थित करना प्राथमिकता हो और उन आंतरिक आकृतियों से कनेक्शन आरेख के लिए उपयुक्त हों।
कनेक्टरों के रास्ते ठीक करने से पहले दोनों दृश्य जाँचें
उदाहरण बनाने के बाद यह क्रम अपनाएँ। इससे मोड़ और जगह ठीक करने में समय लगाने से पहले पता चलेगा कि अवलोकन इच्छित संबंध स्पष्ट करता है या नहीं।
Section Bको फैलाएँ और आंतरिक क्रम की पुष्टि करें।- सुनिश्चित करें कि दोनों अवलोकन कनेक्टर अनुभाग से जुड़े हैं, केवल उसकी रूपरेखा के पास समाप्त नहीं होते।
- अनुभाग को समेटें और केवल दिखाई देने वाले नामों तथा कनेक्टर लेबलों से आरेख पढ़ें।
- जाँचें कि हर दिखाई देने वाला तीर अब भी सही कथन करता है।
- फिर से फैलाएँ और आंतरिक कनेक्टरों तथा लेबलों को देखें।
- प्रत्येक पड़ोसी अनुभाग को पहले अलग-अलग और फिर एक साथ समेटकर दोहराएँ।
अगर फ़ोल्ड करने के बाद बहुत ज़्यादा खाली जगह रह जाए, तो स्थान को सोच-समझकर समायोजित करें। समूह दस्तावेज़ में बताया गया है कि फ़ोल्डिंग नियंत्रण पर Shift-क्लिक करने से आकार बदलने के साथ-साथ सहोदर सेल दाईं ओर या नीचे खिसकते हैं। यह फ़ोल्डिंग का एक खास व्यवहार है; इसे इस गारंटी की तरह न समझें कि मनमाना आरेख अपने-आप फिर से डिज़ाइन हो जाएगा। फ़ोल्डिंग और पड़ोसी सेल
अगर कनेक्टर में अनावश्यक घुमाव हो, तो उसे चुनकर उसका रास्ता समायोजित करें। उसके नीले बिंदुओं को खींचें या कनेक्टर पर राइट-क्लिक करके Add Waypoint चुनें। वेपॉइंट में हाथ से बदलाव करने पर उस कनेक्टर की ऑटो-रूटिंग ऑर्थोगोनल शैली बंद हो जाती है; इसलिए मोड़ तभी जोड़ें जब वे दोनों दृश्यों को बेहतर बनाएँ। पुराना रास्ता हटाने के लिए राइट-क्लिक करके Clear Waypoints चुनें, फिर बने हुए रास्ते को देखें। कनेक्टर का रास्ता बदलने के लिए उसके वेपॉइंट के साथ काम करें
रास्ता बदलने के बाद लेबलों को अलग से देखें। हाथ से जगह पर रखा गया लेबल फिर से समायोजित करना पड़ सकता है। उसे कनेक्टर पर वापस लाने के लिए कनेक्टर या लेबल चुनें, फिर Arrange टैब में Reset चुनकर Label Positions चुनें। कनेक्टर लेबल की जगहें रीसेट करें
सजावट से पहले संरचना की समस्याएँ सुलझाएँ
| समस्या | क्या जाँचें | समर्थित अगला कदम |
|---|---|---|
| फ़ोल्डिंग नियंत्रण नहीं दिखता | वैश्विक फ़ोल्डिंग विकल्प और चुने गए सेल की फ़ोल्ड करने की क्षमता | Extras > Collapse/Expand चालू करें; ज़रूरत पड़ने पर collapsible=1 देखें। |
| फ़ोल्ड करने के बाद कोई विवरण दिखाई देता रहता है | क्या वह अनुभाग का हिस्सा है | उसकी दिखाई देने वाली जगह के बजाय कंटेनर या समूह की सदस्यता जाँचें। |
| अनुभाग की सीमा पर कनेक्टर नहीं जुड़ता | क्या वह डाला गया पारदर्शी लेआउट कंटेनर है | सीमा-स्तर के संबंधों के लिए जुड़ने योग्य कंटेनर या स्विमलेन का उपयोग करें। |
| समेटा हुआ तीर अस्पष्ट है | क्या उसका अर्थ आंतरिक अंतिम बिंदु पर निर्भर करता है | संबंध को लेबल करें या अनुभाग-स्तर का स्पष्ट कनेक्शन बनाएँ। |
| रेखा में अनावश्यक मोड़ बना रहता है | मौजूदा वेपॉइंट | वेपॉइंट समायोजित करें या हटाएँ, फिर लेबल दोबारा जाँचें। |
इन जाँचों में दस्तावेज़ित कंटेनर नियंत्रण, समूह सेटिंग, लेआउट-कंटेनर की सीमा और वेपॉइंट उपकरण शामिल हैं। कौन-सा संबंध दिखाना है, यह आरेख के बारे में संपादकीय निर्णय बना रहता है।
समेटा हुआ उपयोगी आरेख देखकर कोई व्यक्ति हर विवरण खोले बिना प्रत्येक अनुभाग पहचान सके और उसके दिखाई देने वाले कनेक्शन समझ सके। उस अवलोकन को स्पष्ट रूप से बनाएँ, फिर सहायक संरचना दिखाने के लिए फ़ोल्डिंग का उपयोग करें। अगर पाठक को ऐसा सीधा कनेक्शन चाहिए जो पूरे अनुभाग को छोड़ दे, तो वह सारांश जान-बूझकर बनाएँ और जहाँ आंतरिक संबंध अब भी मायने रखते हों, वहाँ विस्तृत दृश्य बनाए रखें।
स्रोत
- draw.io ऑफ़लाइन चलाएँ — draw.io
- कंटेनर आकृतियों पर समेटने/फैलाने की सुविधा चालू या बंद करें — draw.io
- आकृतियों और कनेक्टरों को समूहित और समूह से अलग करें — draw.io
- स्थिर और फ़्लोटिंग कनेक्टरों का अंतर देखें — draw.io
- कनेक्टरों को लेबल करें — draw.io
- Advanced लेआउट आकृतियाँ और लेआउट कंटेनर — draw.io
- कनेक्टर का रास्ता बदलने के लिए उसके वेपॉइंट के साथ काम करें — draw.io