javascript - How to implement this tunnel like animation in WebGL? -

-

WebGL में एनीमेशन की तरह इस सुरंग को कैसे कार्यान्वित करें?

यहां छवि विवरण दर्ज करें

स्रोत:

यह भी देखें:

अच्छा, यह मजेदार था। :)

एक वेबजीएल डेमो यहां उपलब्ध है:

मुख्य एल्गोरिद्म टुकड़ा शेडर में है मूल विचार एक ब्लैक रिंग्स / सर्किलों पर लोट के लिए है, जो बड़े से छोटा है, यहां तक ​​कि एक सुरंग जैसा प्रभाव पैदा करने के लिए केंद्र को ऑफसेट कर रहा है।

किसी भी पिक्सेल को देखते हुए, हम जांच कर सकते हैं कि क्या पिक्सेल एक ब्लैक पिक्सेल के लिए उम्मीदवार बनने के लिए अंगूठी के पास पर्याप्त है या नहीं यदि यह अंगूठी के बाहर है, तो बड़े रिंगों को देखने से बचने के लिए लूप को तोड़ दें।

पिछला (बाह्य) सर्कल से दूरी का इस्तेमाल अंगूठियों के करीब होने पर एक साथ "निचोड़" करने के लिए किया जाता है, यह एक 3D सतह का भ्रम पैदा करने में मदद करता है।

प्रत्येक अंगूठी का लहराती पैटर्न निश्चित रूप से एक साइन वक्र है। पिक्सेल का कोण (सर्कल सेंटर की तुलना में) प्रत्येक अंगूठी के लहराती पैटर्न को एनिमेट करने के लिए एक समान समय पैरामीटर के साथ मिलाया जाता है।

और अंत में, विभिन्न मापदंडों और रूपांतरण कार्यों जैसे बहुत सारे प्रयोग होते थे पॉव () लक्ष्य एनीमेशन के नतीजे नतीजे पाने के लिए यह सही नहीं है, लेकिन बहुत करीबी है।

टुकड़ा शाader कोड: 

  #ifdef GL_ES सटीक हाईप फ्लोट; #endif const फ्लोट पीआई = 3.14159265358979323846264; Const फ्लोट TWOPI = PI * 2.0; Const vec4 व्हाईट = वीसी 4 (1.0, 1.0, 1.0, 1.0); Const vec4 काला = vec4 (0.0, 0.0, 0.0, 1.0); Const vec2 केंद्र = वीसी 2 (0.0, 0.0); Const int MAX_RINGS = 30; Const फ्लोट RING_DISTANCE = 0.05; Const फ्लोट WAVE_COUNT = 60.0; Const फ्लोट WAVE_DEPTH = 0.04; वर्दी फ्लोट यूटाइम; वीसी 2 vPosition बदलती; शून्य मुख्य (शून्य) {फ्लोट सड़ांध = आधुनिक (यूटाईम * 0.0006, TWOPI); फ्लोट एक्स = vPosition.x; फ्लोट y = vPosition.y; बूल काला = गलत; फ्लोट प्रारंल्डिंग = RING_DISTANCE; के लिए (इंट आई = 0; आई & lt; MAX_RINGS; i ++) {vec2 केंद्र = वीसी 2 (0.0, 0.7 - RING_DISTANCE * फ्लोट (i) * 1.2); फ्लोट त्रिज्या = 0.5 + RING_DISTANCE / (पाउ (फ्लोट (आई + 5), 1.1) * 0.006); फ्लोट डिस्ट = दूरी (केंद्र, vPosition); Dist = पाउ (dist, 0.3); फ्लोट रिंगडस्ट = एब्स (डिस्ट-रेडियस); अगर (ringDist & lt; RING_DISTANCE * prevRingDist * 7.0) {फ्लोट कोण = आना (y - center.y, x - center.x); फ्लोट मोटाई = 1.1 * एब्स (डिस्ट-रेडियस) / प्रीआरिंगडीस्ट; गहराई फ्लोट करें = WAVE_DEPTH * पाप ((कोण + सड़ांध * त्रिज्या) * WAVE_COUNT); यदि (dist & gt; त्रिज्या) {काला = (मोटाई & lt; RING_DISTANCE * 5.0 - गहराई वाला * 2.0); } और {काला = (मोटाई & लेफ्टिनेंट; RING_DISTANCE * 5.0 + गहराई वाला); } टूटना; } यदि (dist & gt; त्रिज्या) तोड़; PrevRingDist = ringDist; } Gl_FragColor = काला? काला सफ़ेद; }

Comments

Post a Comment

Popular posts from this blog

qt - switch/case statement in C++ with a QString type -

-
I want to use switch-case in my program but the compiler generates an error. How can I use the switch statement with QString ? The compiler gives me this error: The expression of the switch type 'QString' is invalid My code is as follows : boolStopWord (the word QString) {bool flag = false; Switch (word) {case "the": flag = true; break ; "On" case: flag = true; break ; Case "in": flag = true; break ; Case "your": flag = true; break ; Case "near": flag = true; break ; Case "all": flag = true; break ; Case "this": flag = true; break ; } Return flag; } How do I use the switch statement with a Caststring ? You can not use the switch statement in C ++ language with integral or enum types. You can formally enter the square type of object in the switch statement, but this means that the compiler will look for a user-defined conversion to convert it to an integral or enum type.
Read more

python - sqlite3.OperationalError: near "REFERENCES": syntax error - foreign key creating -

-
I'm trying to create a predefined key after checking the manual and I wrote it: Db.execute ("create table" Table 2 (id, integer primary key, somedata integer) "db.execute" (table creation table 2 does not exist (name text, maintain reference (id) ") and found this: sqlite 3. Operation error: near" references ": syntax error Your second ligne is wrong db.execute ("create table if table does not exist 2 (name text, my_id integer, foreign key (my_id) reference Maintenance (ID)) ") as explained
Read more

Python's equivalent for Ruby's define_method? -

-
What is a Python equivalent for Ruby's define_method , which is the dynamic generation of class methods will allow? (As can be seen in Wikipedia) Functions are first-class objects in Python and assign them The properties of a class or an example can be a way of doing the same thing as a Wikipedia example: colors = {"black": "000", "red": "F00", "green": "0f0", "yellow": "ff0", "blue": "00f", "magenta": "fff", "cyan": "0ff", "white": " FFF "} Class MyStream (ARR): Pass for Name, Code in colors.iteritems (): def _in_colour ( W code = code): return '& lt; Span style = "color:% s" & gt;% s & lt; / Span & gt; ' % (Code, self) setter (histrive, "in_" + name, _in_ color)
Read more