इंटरफ़ेस

Question

जैसे दिमाग बनाने के लिए जेएस लाइब्रेरी मुझे http://www.madeiracloud.com के समान इंटरफ़ेस बनाना है जो नेटवर्क आर्किटेक्चर (विभिन्न उद्देश्यों के लिए वे क्या कर रहे हैं) के लिए प्रदान करता है।

मूल रूप से उपयोगकर्ता & तत्वों को कैनवास में खींचने और दिशात्मक तीर का उपयोग करके कनेक्ट करने में सक्षम होना चाहिए।

इसके लिए मुझे किस लाइब्रेरी का उपयोग करना चाहिए? मैं डी 3, राफेल और ओकनवास देख रहा हूं।

Answer 1

रैफेल (http://raphaeljs.com/) ड्रैकुला ग्राफ लाइब्रेरी (http://dracula.ameisenbar.de/) के संयोजन में आपको प्रारंभ हो जाएगा।

और भी thejit एकदम सही है:

मल्टी पेड़ जावास्क्रिप्ट InfoVis टूलकिट वेब के लिए सहभागी डेटा विजुअलाइज़ेशन बनाने के लिए उपकरण प्रदान करता है।

http://thejit.org/

संपादित करें:

आप भी Processing.js

http://processingjs.org/

Processing.js पर एक नज़र ले जा सकते हैं लोकप्रिय प्रसंस्करण दृश्य प्रोग्रामिंग भाषा की बहन परियोजना है , वेब के लिए डिज़ाइन किया गया। प्रसंस्करण.जेएस आपके डेटा विज़ुअलाइजेशन, डिजिटल आर्ट, इंटरैक्टिव एनीमेशन, शैक्षिक ग्राफ, वीडियो गेम इत्यादि वेब मानकों का उपयोग करके और किसी भी प्लग-इन के बिना काम करता है। आप प्रोसेसिंग भाषा का उपयोग करके कोड लिखते हैं, इसे अपने वेब पेज में शामिल करते हैं, और प्रोसेसिंग.जेएस बाकी करता है।

Answer 2

आपको MindMap प्रोजेक्ट पर एक नज़र डालना चाहिए जो आंतरिक रूप से Raphael.js का उपयोग करें।

आप http://kenneth.kufluk.com/google/js-mindmap/

Answer 3

पर डेमो पा सकते हैं एक व्यावसायिक संदर्भ में आप भी क्या yFiles for HTML लिए प्रस्ताव दिया है पर एक नज़र रखना चाहिए।

यह एक सामान्य ग्राफ ड्राइंग और जावास्क्रिप्ट लाइब्रेरी संपादित करना है जो आपके "ड्रैग और ड्रॉप और कनेक्ट" आसानी से केस हल करता है।

लेकिन इस आवेदन नोड्स में और खींचें के माध्यम से नहीं बनाई गई हैं ड्रॉप: वहाँ भी एक विशिष्ट mind map example ऑनलाइन उपलब्ध है। यह निश्चित रूप से भी संभव है, जैसा कि this online demo में देखा जा सकता है।

उस लाइब्रेरी की विशिष्ट ताकतें स्वचालित लेआउट/नोड्स और कनेक्शन की व्यवस्था हैं, इसलिए यदि आप बड़े डेटा बना रहे हैं या बाहरी डेटा स्रोत से ग्राफ़ को स्वचालित रूप से पॉप्युलेट कर रहे हैं तो ये बहुत आसान हो जाते हैं। हालांकि अगर आपको इस फीचर सेट की आवश्यकता नहीं है, तो सरल समाधान भी काम कर सकते हैं। ध्यान दें कि d3 पर पर डेटा देखने पर ध्यान केंद्रित किया गया है, और उपयोगकर्ता इंटरैक्शन और ग्राफ़ को अंतःक्रियात्मक रूप से बनाने के बारे में बहुत कुछ नहीं है।

^{अस्वीकरण: मैं उस पुस्तकालय को बनाने वाली कंपनी के लिए काम करता हूं, हालांकि मैं अपने नियोक्ता का प्रतिनिधित्व SO पर नहीं करता हूं। मेरी टिप्पणियां मेरी हैं।}