2012-01-26 8 views
33

मैं HTML5 का उपयोग कर एक नई परियोजना शुरू कर रहा हूं। सबसे लोकप्रिय ग्राफिकल टूलकिट्स में से दो KineticJS और RaphaelJS हैं। यदि आपके पास इनका उपयोग करने का अनुभव है, तो क्या आपके पास कोई सलाह है? वे कौन सी विशेषताओं की पेशकश करते हैं, और क्या एक दूसरे का उपयोग करने में कोई फायदा है?काइनेटिक बनाम राफेलज

उदा। केवल राफेलजेएस विरासत ब्राउज़रों पर काम करता है (लेकिन यह एक विशेषता में मुझे आवश्यकता नहीं है)।

+0

आप परियोजना किस तरह कर रहे हैं के बारे में अधिक विशिष्ट होना मिल गया है, विभिन्न तकनीकों सूट विभिन्न आवश्यकताओं। – bennedich

+1

@bennedich मैं सिर्फ पता है कि कि RaphaelJS के लेखक भी SnapSVG पैदा कर दी है की उन दोनों –

+1

नोट संभावनाओं में मतभेद हैं की जरूरत है: http://snapsvg.io/ जो बेहतर आधुनिक ब्राउज़रों के लिए अनुकूल है। –

उत्तर

52

RaphaelJS और KineticJS बीच सबसे बड़ा अंतर यह है कि RaphaelJS एसवीजी का उपयोग करता है और KineticJS दृश्य के लिए HTML5 कैनवास का उपयोग करता है।
तो यह वास्तव में इस बात पर निर्भर करता है कि आप किस प्रकार की परियोजना कर रहे हैं।

यहाँ कुछ उपयोगी लिंक है जो आप के बारे में एसवीजी की जांच करनी चाहिए बनाम कैनवास हैं:

  • Thoughts on when to use Canvas and SVG इस stackoverflow सूत्र में
  • साइमन Sarris उत्कृष्ट reply (यह भी एक संकर दृष्टिकोण का वर्णन करता है) (मैं भी कुछ benchmarks तैनात एसवीजी और एक ही धागे में कैनवास) के बीच

संक्षेप में:

  • आप कुछ सहयोगी चार्ट मैं क्योंकि यह आसान है कि ऐसा करने के लिए एसवीजी साथ RaphaelJS साथ जाना होगा बनाना चाहते हैं (KineticJS कुछ सार एपीआई जो यह काफी आसान है कि बहुत करना चाहिए प्रदान करता है)।
  • आप आकार/वस्तुओं की बड़ी संख्या मैं KineticJS उपयोग करने के लिए सिफारिश करेंगे कल्पना करने के लिए चाहते हैं, तो कैनवास आमतौर पर बेहतर पैमाने के रूप में आकार/वस्तुओं की बड़ी संख्या के साथ तैयार हो और KineticJS कई परतों का उपयोग करता रेंडरिंग प्रदर्शन में सुधार होगा।
+3

मैं एसवीजी के बारे में असहमत हूं, वास्तव में कैनवास की तुलना में चार्ट के लिए बेहतर काम कर रहा हूं। इस डेमो पर एक नज़र डालें: http://meteorcharts.com/ कैनवास हजारों डेटा पॉइंट्स को संभाल सकता है, और मोबाइल उपकरणों पर भी उत्तरदायी रहेगा। एसवीजी बस बस ऐसा नहीं कर सकता है। –

+1

निश्चित रूप से, यदि आपको एसवीजी से बेहतर कैनवास स्केल की तुलना में आकारों/अंकों की एक बड़ी मात्रा से निपटना है (धागे में बेंचमार्क देखें)। लेकिन सरल इंटरैक्टिव चार्ट (barcharts, पाइचार्ट, आदि) के लिए एसवीजी काफी तेजी से है और आप का उपयोग करता है, तो [D3.js] (http://d3js.org/) आप अपेक्षाकृत कम प्रयास के साथ कुछ सच में प्रभावशाली सहयोगी चार्ट बना सकते हैं। –

+0

एसवीजी या कैनवास? दोनों के बीच छेड़छाड़। http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/ – Cherven

संबंधित मुद्दे