वर्म्स गेम से 2D साइड-ऑन वेव इफेक्ट बनाएं


11

मैं Worms से तरंगों / पानी के प्रभाव को फिर से बनाने की कोशिश कर रहा हूँ (यहाँ देखें http://youtu.be/S6lrRqst9Z4?t=31s ) जो मैं वास्तव में इसे स्प्राइट नहीं समझ रहा हूँ, उससे इसकी प्रक्रिया एक पाप लहर की तरह उत्पन्न होती है।

क्या किसी ने पहले ऐसा कुछ बनाया है? या किसी भी विचार कैसे मैं इसके बारे में जाना होगा?

जवाबों:


14

हां, आप सही हैं, गणित साइन फ़ंक्शन का उपयोग करके इस 2D पानी के प्रभाव को सिम्युलेटेड किया जा सकता है:

wave = sin(phase + t * frequency) * amplitude

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

  • phase एक स्थिरांक है, जो भी आप चाहते हैं उसे डालें।
  • tआपके द्वारा संसाधित किए जा रहे पिक्सेल / शीर्ष की क्षैतिज स्थिति पर सेट :t = x;
  • amplitudeसमय के साथ बदलाव (जिससे लहरें ऊपर-नीचे होती रहेंगी):

    amplitude = sin(t * wave_speed) * wave_height

  • एक अधिक लचीला प्रभाव प्राप्त करने के लिए कई तरंगों को मिलाएं:

    wave_final = wave0 + wave1 + ...

    प्रत्येक लहर के लिए, कुछ मापदंडों को थोड़ा बदल दें (जैसे: चरण, आवृत्ति, ...)।

यहाँ एक त्वरित उदाहरण दिया गया है, केवल दो तरंगों का उपयोग करके:

http://glslsandbox.com/e#4988.0 (हाल के ब्राउज़र और WebGL सक्षम होना चाहिए)

ध्यान दें: यह एक shader है, लेकिन 2D प्राइमेटिव का उपयोग करके ऐसा करना एक ही दृष्टिकोण है।

संपादित करें: आप किसी भी ढांचे या 2d रेंडरिंग सिस्टम को निर्दिष्ट नहीं करते हैं, लेकिन यहां बताया गया है कि इसे पॉलीगॉन / त्रिकोण स्ट्रिप्स का उपयोग करके कैसे प्रस्तुत किया जा सकता है:

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


वाह, यह एक बहुत बढ़िया जवाब है, बहुत व्यापक उत्तर के लिए धन्यवाद। हाँ, मैं प्रतिपादन के लिए HTML5 कैनवास एपीआई का उपयोग कर रहा हूँ। उस के लिए फिर से धन्यवाद, अत्यंत उपयोगी !!
सिआर्वान

हालाँकि, वर्म में लहरें स्पष्ट रूप से केवल साइन बल्कि अधिक जटिल हैं; बहुत संभवत: सिर्फ साइन के सुपरपोजिशन।
20

1
@leftaroundabout - Techincally , हर लहर समारोह वास्तव में सिर्फ जीवाओं की एक अनंत संख्या के एक superposition है। व्यावहारिक रूप से, यह अभी भी सच है, लेकिन अधिक क्रूड सन्निकटन आपके जीवन को आसान बना सकते हैं।
फेक नेम
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.