स्पॉइलर: DOT भाषा में लिखे गए DAG को प्रस्तुत करने के लिए   उपयोग करें Vizdom.dev का  एक सॉफ्टवेयर डेवलपर के रूप में, मैंने कभी-कभी डीएजी के साथ काम किया है - जिनमें से अधिकांश में उन्हें विज़ुअलाइज़ करना शामिल है। कई मामलों में, मुझे त्वरित प्रतिपादन प्राप्त करने में कठिनाई हुई और मुझे टूलींग की तलाश करनी पड़ी।  सौभाग्य से, वहाँ भरोसेमंद है  उपकरण जो डीओटी भाषा में लिखे गए ग्राफ़ को प्रस्तुत कर सकता है - बिल्कुल सही!   ग्राफ़विज़  के अलावा…  यह वेब पर ठीक से काम नहीं करता*  मुझे इसे इंस्टॉल करना होगा  यह डीओटी/जीवी फाइलों को ऑनलाइन प्रबंधित नहीं करता है  विचार  *ठीक है,   ग्राफ़विज़ को वेबअसेंबली में संकलित किया जा सकता है, और कुछ प्रतिभाशाली लोग ड्रीमपफ जैसे कुछ साफ-सुथरे प्रोजेक्ट बनाने में कामयाब रहे  , नाइकी का  , और मैगजैक  - प्रत्येक का अपना मोड़ है। मैं अभी भी इन रेंडरिंग को एसवीजी (या अन्य माध्यम) में निर्यात किए बिना एम्बेड करने के लिए संघर्ष कर रहा हूं। तकनीकी रूप से   संपादक   edotor.net   संपादक  उदाहरण के लिए, मैं अपना ग्राफ़ संग्रहीत करना चाहता हूं  बस एक लिंक चिपकाकर जो ग्राफ़ को स्वचालित रूप से प्रस्तुत करता है।   धारणा.तो  मैं इस्तेमाल कर सकता हूँ  जो ग्राफ़ को बहुत साफ़ तरीके से प्रस्तुत करता है और आश्चर्यजनक रूप से अच्छी तरह से काम करता है - यह इसके कई कारणों में से एक है  . मैं मार्कडाउन, स्वीट का उपयोग करके नोशन/गिटहब में ग्राफ़ भी एम्बेड कर सकता हूं!   मरमेडजेएस   64k+ GitHub पर शुरू होता है  दुर्भाग्य से, मुझे डीओटी को मार्कडाउन के उस स्वाद में अनुवाद करना होगा जिसकी मरमेड को आवश्यकता है। छोटे पाठ्य प्रस्तुतियों के लिए, मैं उन्हें अपने लिए परिवर्तित करने के लिए ChatGPT का उपयोग कर सकता हूं, लेकिन यह अक्सर व्याकरण संबंधी गलतियाँ करता है, और ग्राफ़ प्रस्तुत करने से इनकार कर देगा - जिससे यह स्वचालन के स्रोत के रूप में अविश्वसनीय हो जाएगा।  फिर वहाँ है  जो   आरेखों को प्रबंधित करने के लिए अद्भुत है, लेकिन मेरी मरमेड समस्याओं की तरह, मैं डीओटी को विश्वसनीय रूप से डी2 में परिवर्तित नहीं कर सकता। मेरा मानना है कि यदि आप हाथ से चित्र बनाने जा रहे हैं तो यह एक स्वीकार्य, एक बार की लागत है। सामान्य तौर पर, यह एक शानदार उपकरण है. प्रशंसा!   टेरास्ट्रक्चर.कॉम हाथ से निर्मित  समस्या  मैं   जेनरेट किए गए डीओटी आउटपुट प्रस्तुत करना चाहता हूं - कोई भी टूलिंग मुझे उस लक्ष्य को प्राप्त करने में मदद नहीं करती है। प्रोग्रामेटिक रूप से  मैं ग्राफ़ प्रस्तुत करने वाले लिंक एम्बेड करना चाहता हूं।  मैं अपडेट के लिए रेंडरिंग को ऑनलाइन संग्रहीत करना चाहता हूं या अन्य ग्राफ़ के साथ इसकी तुलना करना चाहता हूं।  समाधान  हाँ - मैंने एक बनाया  उसके लिए 🎉   अनुप्रयोग  ...और यह पूरी तरह से रस्ट में बनाया गया है 🦀 बहुत-बहुत धन्यवाद   लेप्टोस     tl;dr - डीएजी को तेजी से ऑनलाइन प्रस्तुत करने के लिए एक सरल, उद्देश्य-निर्मित ऐप  ग्राफ़ निर्माण में एज क्रॉसिंग को कम करना, एक मान्यता प्राप्त एनपी-हार्ड चुनौती दृश्यमान आकर्षक ग्राफ़ बनाने की कुंजी है। टेरास्ट्रक्चर की टीम ने एक उत्कृष्ट प्रकाशित किया है  इस विषय पर गहराई से विचार करना। DagreJS लेआउट एल्गोरिदम और अंतर्दृष्टिपूर्ण पेपर "   " से काफी प्रेरित होकर, मैंने रस्ट में एक संस्करण विकसित किया।   ब्लॉग भेजा ड्राइंग डायरेक्टेड ग्राफ्स के लिए एक तकनीक  यह संस्करण इस समस्या की जटिल जटिलताओं का लाभ उठाते हुए, पदानुक्रमित ग्राफ़ प्रस्तुत करने के लिए विशेष रूप से प्रभावी है।  ग्राफ़विज़ के साथ बड़े डीएजी (500+ नोड्स/किनारों) का प्रतिपादन कुछ हद तक धीमा हो जाता है। डागरे + डी3 (  और डेरिवेटिव) काफी तेजी से समाप्त होते हैं और बेहतरीन एनिमेशन/स्टाइलिंग अनुकूलन प्रदान करते हैं। फिर भी, मुझे लगा कि वे डीओटी भाषा द्वारा प्रदान की जाने वाली सुविधाओं से चूक जाते हैं - अर्थात्, स्टाइलिंग विशेषताओं को अक्सर केवल तभी सम्मानित किया जाता है जब आप ग्राफ़विज़ के साथ काम कर रहे हों।   d3-ग्राफ़विज़  डाग्रे के समान ही परिणाम देगा लेकिन ग्राफ़विज़ के डीओटी विनिर्देश और शैली व्यवहार के अनुरूप होगा। हालाँकि, इसमें ग्राफ़विज़ के साथ फ़ीचर समानता नहीं है, और जो कथन/विशेषताएँ समर्थित नहीं हैं उन्हें आसानी से अनदेखा कर दिया जाता है।   विज़डोम  मेरा मानना है कि प्रोग्रामेटिक रूप से उत्पन्न डीओटी द्वारा उपभोग की जाने वाली विशेषताओं के प्रकार के लिए यह एक अच्छा समझौता है।  विज़डोम विशेषताएँ  🚀 बहुत तेज़ प्रतिपादन  💾 ग्राफ़ को लिंक में संग्रहीत करें  0️⃣ शून्य निर्भरता और किसी इंस्टॉलेशन की आवश्यकता नहीं  प्रतिपादन गति  खैर, यह सेब से संतरे की तुलना है। ग्राफ़विज़ अभी भी   विज़ुअलाइज़ेशन उत्पन्न करता है और अधिक का समर्थन करता है  , इसलिए मैं व्यक्तिपरक रूप से तुलना कर रहा हूं  ग्राफ़विज़ के डीओटी इंजन के विरुद्ध, इसे केवल डीएजी तक सीमित कर दिया गया है, और इससे भी   इसे डीओटी भाषा की संकीर्ण विशेषताओं की सूची तक सीमित कर दिया गया है। बेहतरीन   लेआउट इंजन   विज़डोम आगे  हां, मुझे पता है कि ग्राफ़विज़ के 30+ वर्ष की स्ट्रीक के आसपास वर्षों के अनुभव और टूलींग की तुलना करना भयानक है, लेकिन मेरे संकीर्ण उपयोग-मामले के लिए, यह तेजी से पागल हो रहा है। रेंडरिंग के लिए मेरे एम1 मैकबुक प्रो पर कुछ वॉल टाइम यहां दिए गए हैं  ~400 नोड्स के साथ:   काफी बड़ा ग्राफ  मूल ग्राफ़विज़: ~30 सेकंड  क्रोम (WASM) ग्राफ़विज़: क्रैश*  क्रोम (जावास्क्रिप्ट) डाग्रेजेएस: ~10 सेकंड     क्रोम (WASM)   विज़डोम :  ~1 सेकंड**       * यह क्रैश हो जाता है क्योंकि एम्सस्क्रिप्टेन ध्वज, ALLOW_MEMORY_GROWTH=1 सेट नहीं है, इसलिए कुल मेमोरी 16 एमबी तक सीमित है। इसे ठीक किया जा सकता है, लेकिन मुझे ऐसा कोई ऑनलाइन प्रोजेक्ट नहीं मिला है जो संबंधित ग्राफ़ को संभाल सके।  **       ।    संपादक दृश्य में Example 14 चयन करके उदाहरण ग्राफ़ प्रस्तुत किया गया है पेज को रिफ्रेश करने से आपको पेज रिफ्रेश हो जाएगा और 414 प्राप्त होगा क्योंकि ग्राफ़ में मौजूद यूआरआई बहुत बड़ा है। मैं बड़े ग्राफ़ संग्रहीत करने के लिए एक बेहतर समाधान पर काम कर रहा हूं।  ग्राफ़ को लिंक में संग्रहीत करें  आप देखेंगे कि जब आप डीओटी फ़ाइल में कोई बदलाव करते हैं, तो यूआरएल ग्राफ़ और लेआउट विकल्पों को संग्रहीत करने के लिए तुरंत कुछ क्वेरी पैरामीटर अपडेट करता है, जिससे आप हमेशा लिंक संग्रहीत करके अपने डेटा की एक प्रति का संदर्भ ले सकते हैं!  एक समस्या है - बड़े-ईश ग्राफ़ URI को AWS के लिए बहुत बड़ा बना देते हैं (जहाँ  वर्तमान में होस्ट किया गया है) और अन्य लोड बैलेंसर।   विज़डोम  मैं वर्तमान में बड़े ग्राफ़ को संभालने के लिए एक समाधान पर काम कर रहा हूं, लेकिन इस बीच, मैंने ग्राफ़ को बनाए रखने और संग्रहीत करने के कुछ तरीके शामिल किए हैं:  एक एम्बेड करने योग्य लिंक कॉपी करें जो स्वचालित रूप से एक दृश्य प्रस्तुत करता है जो ग्राफ़ को अधिकतम करता है।  किसी भी एप्लिकेशन में एम्बेड करने के लिए आईफ्रेम स्निपेट की प्रतिलिपि बनाएँ जो उन्हें रेंडर करने का समर्थन करता है।  या बस प्रस्तुत एसवीजी डाउनलोड करें।  संपादक का दृष्टिकोण कैसा दिखता है इसका एक उदाहरण यहां दिया गया है  :   डिफ्लेट के लिए पीप्रोफ़ ट्रेस  पर जाएँ, और   लोड करें संपादक दृश्य Example 42  अंतर दृश्य  कभी-कभी, मैंने पाया कि मैं अपने द्वारा तैयार किए गए दो ग्राफ़ों की तुलना करने की कोशिश कर रहा था, इसलिए जब मैं इस पर था, मैंने एक जोड़ा  दो अलग-अलग ग्राफ़ के बीच परिवर्तनों को दृश्य रूप से देखने के लिए।   भिन्न दर्शक  रंग किंवदंती:  लाल: हटाया गया  नारंगी: संशोधित  हरा: जोड़ा गया  यहाँ कुछ तस्वीरें हैं:   मुझे क्लिक करें: नोड आईडी को "ई" से "एफ" में बदलना मुझे क्लिक करें: "क्लस्टर = सत्य" जोड़ना  भविष्य के दिशानिर्देश  अभी भी कार्य प्रगति पर है, और जैसे-जैसे इसका विकास जारी है, मुझे पता है कि इस उपकरण को पूर्ण करने की यात्रा ग्राफ़ विज़ुअलाइज़ेशन के क्षेत्र की तरह ही गतिशील है। जबकि मुझे किस बात का गर्व है  अब तक हासिल किया है, मैं इसकी क्षमता को लेकर और भी उत्साहित हूं। यहीं पर आप, पाठक और संभावित उपयोगकर्ता, आते हैं।   विज़डोम   विज़डोम  यदि आपकी कोई प्रतिक्रिया है, तो कृपया बेझिझक मुझे संदेश भेजें  या  .   गटर   कलह  पढ़ने के लिए धन्यवाद - यदि आपको यह लेख अच्छा लगा हो, तो कृपया   ! अनुसरण करें  [1]: ईआर गैन्सनर, ई. कौट्सोफियोस, एससी नॉर्थ और के. -पी। वीओ, "निर्देशित ग्राफ़ बनाने की एक तकनीक," सॉफ्टवेयर इंजीनियरिंग पर आईईईई लेनदेन में, वॉल्यूम। 19, नहीं. 3, पृ. 214-230, मार्च 1993, डीओआई: 10.1109/32.221135।    भी प्रकाशित किया गया यहाँ

This post provides insights into new product. 

This story contains new, firsthand information uncovered by the writer.

Render DAGs with Vizdom

Read My Stories

यह ऑडियो कहानी की मूल भाषा में निर्मित है!

About Author

टिप्पणियाँ

लेबल

इस लेख में चित्रित किया गया था

Related Stories

अपने वर्कफ़्लो को 10 गुना बेहतर कैसे बनाएं: 17 ज़रूरी ऐप्स

He/Him/Master of Discovery

टेलीग्राम: क्रिप्टो द्वीप का मुख्य भूमि से पुल

उपयोगकर्ता-केंद्रित क्रिप्टो उत्पाद बनाना: ग्राहक प्रतिक्रिया का महत्व

अपने वर्कफ़्लो को 10 गुना बेहतर कैसे बनाएं: 17 ज़रूरी ऐप्स

He/Him/Master of Discovery

टेलीग्राम: क्रिप्टो द्वीप का मुख्य भूमि से पुल

उपयोगकर्ता-केंद्रित क्रिप्टो उत्पाद बनाना: ग्राहक प्रतिक्रिया का महत्व

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps