राफेल

Question

में "मैट्रिक्स" क्या है, मैं आम तौर पर raphael.js की बेहतर समझ प्राप्त करने की कोशिश कर रहा हूं, लेकिन मुझे पता चला है कि raphael.js दस्तावेज़ समय पर और दूसरी बार भ्रमित हो सकता है अस्पष्ट।

क्या कोई मुझे बता सकता है कि मैट्रिक्स क्या है और इसका उपयोग कैसे किया जाता है?

Answer 1

वहाँ लगभग कोई अच्छा, स्पष्ट मैट्रिक्स पर राफेल में कहीं भी जानकारी दी गई है। हालांकि, अच्छी खबर यह है कि यह लगभग एसवीजी में मैट्रिक्स परिवर्तन और CSS3 के समान ही है।

एसवीजी में मैट्रिक्स ट्रांसफॉर्म के लिए कुछ मार्गदर्शिकाएं हैं, लेकिन वे आमतौर पर मानते हैं कि आप पहले से ही मैट्रिक्स गणित को समझते हैं। यदि आप नहीं करते तो ज्यादा उपयोग नहीं करते हैं।

हालांकि, one good guide on matrix maths in CSS3 है। यह Matrix Construction Set के साथ आता है (फरवरी 2013 तक, यह क्रोम में काम नहीं करता है लेकिन फ़ायरफ़ॉक्स में काम करता है)। चूंकि CSS3 और राफेल मैट्रिक्स ट्रांसफॉर्म के पीछे गणितीय सिद्धांत अनिवार्य रूप से वही हैं, इसलिए आप इस टूल का उपयोग मैट्रिक्स ट्रांसफॉर्म नंबरों का एक सेट जेनरेट करने के लिए कर सकते हैं, फिर उन्हें राफेल में लागू करें और यह एक ही परिणाम कम या कम होना चाहिए।

• यह 6 नंबर के बाद परिवर्तन है की गणना करने के लिए जहां एक राफेल आकार के सीमांकन बॉक्स के प्रत्येक कोने हो जाएगा उपयोग किया जाता है का एक सेट है: क्या मैट्रिक्स रूपांतरण के बारे में सब कर रहे हैं की

  सुपर त्वरित अवलोकन पूरा कर लिया है।उनके बीच, ये 6 संख्याएं किसी भी पैमाने, परिवर्तन, घूर्णन और कतरनी प्रभावों को बहुत अधिक बना सकती हैं।

• राफेल के लिए यह पीछे के दृश्य इंजन है: राफेल अनुवाद मैट्रिक्स समन्वय में बदल जाता है। मैट्रिक्स समन्वय गंभीरता से दिमाग-दबाने लग सकते हैं: जब तक कि आप कुछ जटिल नहीं कर लेते हैं, तो आमतौर पर यह हूड के नीचे की बात करने के लिए सबसे अच्छा होता है।
• यहां एक XKCD joke है जो मैट्रिक्स परिवर्तनों के पीछे 6 संख्याओं के बीच गणितीय संबंध को चित्रित करता है। आपको या तो यह मजाकिया लगेगा, या, यह आपको विश्वास दिलाएगा कि राफेल को अपने आप को हुड के नीचे गणित करने देना सबसे अच्छा है .. ।
  • तत्व की मैट्रिक्स सीधे वस्तु को देखने के लिए::

  

  • एक तत्व की वर्तमान मैट्रिक्स राज्य पर देखने के लिए someElement.matrix पत्र द्वारा दिए गए प्रत्येक संख्या के साथ एक वस्तु है (उदाहरण के लिए {a:1,b:0,c:0,d:1,e:0,f:0}। इन्हें सीधे सेट करना ऑब्जेक्ट को नहीं बदलता है (इसलिए आप someElement.matrix.b = 3; नहीं कर सकते)
  • आप रिवर्स-ट्रा एक और अधिक मानव पठनीय परिवर्तन युक्त वस्तु someElement.matrix.split()
  • का उपयोग कर विशेषताओं तुम भी मैट्रिक्स एक स्ट्रिंग को बदलने में someElement.matrix.toTransformString();
• साथ रिवर्स अनुवाद कर सकते हैं आप एक मैट्रिक्स मैन्युअल रूप से सेट करने की जरूरत है में वर्तमान मैट्रिक्स nslate, आप इसे इन तरीकों में से एक कर सकते हैं। इन सभी की जगह या पिछले से चेतन परिणत:
  • एनिमेटेड (सरणी का उपयोग करके): someElement.animate({transform: ['m',0.5, -0.5, 0.5, 0.5, -0.5, 0.5]}, 1000);
  • त्वरित (सरणी का उपयोग करके): someElement.transform(['m',0.5, -0.5, 0.5, 0.5, -0.5, 0.5]);
  • एनिमेटेड (स्ट्रिंग का उपयोग): someElement.animate({transform: 'm0.5 -0.5 0.5 0.5 -0.5 0.5'}, 1000);
  • तत्काल (स्ट्रिंग का उपयोग करके): someElement.transform('m0.5 -0.5 0.5 0.5 -0.5 0.5');
• यह डिफ़ॉल्ट मैट्रिक्स स्ट्रिंग है: 1 0 0 1 0 0। इसे लागू करने से इसे एक डिफ़ॉल्ट रूप में बदल दिया जाता है।
• प्रत्येक मैट्रिक्स संख्या का अर्थ क्या है, इसे चित्रित करना बहुत मुश्किल है। अलगाव में, a एक्स पैमाने की तरह काम करता है, b y-कतरनी की तरह, c एक्स-कतरनी की तरह, d y पैमाने पर की तरह, और e और f x और y चाल की तरह। लेकिन वे गणितीय जटिल तरीकों से बातचीत करते हैं। यह आसान नहीं है।

Answer 2

राफेल को नहीं पता लेकिन दस्तावेज़ों को देखकर और अन्य ड्राइंग एपीआई जानना, मैं अर्ध-शिक्षित अनुमान लगाऊंगा।

ग्राफिक्स (राफेल और कहीं और) मैट्रिक्स में कलाकृति को बदलने (स्थानांतरित करने, घुमाने, आदि) के लिए उपयोग किया जाता है। आपको एचटीएमएल 5 canvas तत्व के लिए एक समान एपीआई मिल जाएगी।

जब आप ड्राइंग सतह को स्थानांतरित करने और घुमाने के लिए Element.transform विधि का उपयोग करते हैं। इससे पहले कि आप फिर से ड्राइंग शुरू करें, अपनी कलम के नीचे कागज के टुकड़े को ले जाना। आंतरिक रूप से, इस तरह के परिवर्तन एक रूपांतरण मैट्रिक्स का उपयोग कर किया जाता है। यह बहुत उपयोगी है, अगर पहले थोड़ा सा गूढ़, फीचर। वास्तव में, यह भी 3 डी ग्राफिक्स काम करता है।

इसके अलावा, मैट्रिस को एक-दूसरे पर जोड़ा जा सकता है, इसलिए आपके पास एक मैट्रिक्स हो सकता है जो क्षैतिज रूप से अनुवाद करता है, जो लंबवत अनुवाद करता है, और जो घुमाता है (और इतने पर और इतने पर), और संयुक्त होने के लिए उन्हें एक साथ जोड़ता है प्रभाव।

फिर से, मैं यहां extrapolating हूँ; मुझे राफेल नहीं पता। लेकिन यह ग्राफिक्स में matrices का मूल उपयोग है।

Answer 3

ऊपर के अलावा

इसके अलावा, राफेल एक बार तक ही सीमित था केवल बारी बारी से पैमाने http://www.irunmywebsite.com/raphael/additionalhelp.php इंटरैक्टिव उदाहरण के लिए करने के लिए अनुवाद करते हैं लेकिन

जाओ वाक्य विन्यास में मैट्रिक्स के लेखकों जोखिम के साथ किसी भी बदलना 2 डी ग्राफिक्स

के लिए संभव है आप कर सकते हैं ड्रॉप डाउन में 'मैट्रिक्स' चुनकर और उन उदाहरणों के माध्यम से काम करके फ़िल्टर करें। उदाहरणों का एक अलग सबसेट प्राप्त करने के लिए आप मैट्रिक्स द्वारा भी खोज सकते हैं।

उदाहरण के लिए 'skew' नामक एक प्रकार का परिवर्तन होता है यदि आप पृष्ठ पर इसकी खोज करते हैं तो आपको यह दिखाने वाला एक और उदाहरण दिखाई देगा।

मैट्रिक्स की शर्माएं नहीं, यह एक दिलचस्प विषय

आइपॉड पर है, तो हाइपरलिंक नहीं कर सका