স্পন্দনের বিস্তার এবং সময়কাল

বিস্ময়কর, তাই না? কৌণিক আন্দোলনের অংশে, ট্যানজেন্টের (একটি ভেক্টরের কোণ নির্ণয় করা) এবং সাইন ও কোসাইনের (পোলার স্থানাঙ্ক থেকে কার্তেসীয় স্থানাঙ্কে পরিবর্তন করা) ব্যবহার দেখেছি। আমরা এগুলো শিখেই সন্তুষ্ট থাকতে পারি। কিন্তু আমরা থেমে থাকবো না। এটা কেবল শুরু। সাইন এবং কোসাইনের ব্যবহার গাণিতিক সূত্র ও সমকোণী ত্রিভুজের ঊর্ধ্বে।

নিচে সাইন ফাংশনের লেখচিত্র দেওয়া হল, যেখানে y = sine(x)

দেখা যাচ্ছে, সাইন ফাংশন –1 থেকে 1 এর মধ্যে উপর-নিচ পর্যায়ক্রমিক তরঙ্গের সৃষ্টি করে। তরঙ্গের এরূপ আচরণকে স্পন্দন (oscillation) বলা হয়, এটা হল দুইটি বিন্দুর মধ্যে একটি পর্যাবৃত্ত (periodic) গতি। গিটার বাজানো, সরল দোলকের দোলন, স্প্রিং এর সংকোচন-প্রসারণ—সবগুলো স্পন্দনের উদাহরণ।

স্পন্দন সিমুলেশন করার জন্য ProcessingJS প্রোগ্রামে সাইন ফাংশনের আউটপুট একটি অবজেক্টের অবস্থানের সাথে নিযুক্ত করতে হয়। লক্ষ্য করি, এটা নয়েজের অনুশীলনে পারলিন নয়েজ (Perlin noise) এ ব্যবহৃত পদ্ধতির মতই।

একটি সাধারণ পরিস্থিতি নিয়ে শুরু করা যাক। আমরা চাই, একটি বৃত্ত যেন ক্যানভাসের বাম থেকে ডানদিকে স্পন্দন করে।

একেই সরল ছন্দিত স্পন্দন (simple harmonic motion) (অথবা, বলা যায়, “একটি অবজেক্টের সাইন তরঙ্গের পর্যাবৃত্ত স্পন্দন”) বলা হয়। এই প্রোগ্রামটি কোড করা সহজ হবে, কিন্তু কোড করার আগে, স্পন্দন (এবং তরঙ্গের) পরিভাষা সম্পর্কে আরও জানি।

নিচের দুইটি অংশ সহ, সরল ছন্দিত স্পন্দনকে যে কোন অবস্থানে (এক্ষেত্রে, x অবস্থান) সময়ের একটি ফাংশনরূপে প্রকাশ করা যায়:

উপরে উল্লেখিত সাইনের লেখচিত্র থেকে দেখা যায় যে, এটার বিস্তার হল 1 এবং পর্যায়কাল হল TWO_PI; সাইনের আউটপুট 1 থেকে বেশি বা -1 থেকে কম হয় না; এবং প্রত্যেক TWO_PI রেডিয়ান (বা 360 ডিগ্রী) পর তরঙ্গের পুনরাবৃত্তি ঘটে।

এখন, ProcessingJS ক্ষেত্রে, বিস্তার এবং পর্যায়কাল কি? বিস্তারকে সহজেই পিক্সেলে পরিমাপ করা যাবে। 200 পিক্সেল প্রশস্ত উইন্ডোর ক্ষেত্রে, আমরা কেন্দ্র থেকে ডানদিকে 100 পিক্সেল এবং বামদিকে 100 পিক্সেলে স্পন্দন ঘটাবো। সুতরাং:

একটি পূর্ণ স্পন্দনের সময় হল পর্যায়কাল, কিন্তু ProcessingJS এ সময় কি? অর্থাৎ, আমরা বলতে পারি যে বৃত্তটি যেন প্রতি তিন সেকেন্ডে স্পন্দিত হয়। আমরা প্রোগ্রামে মিলি সেকেন্ডের (millis() ব্যবহার করে) হিসাব রাখতে পারি এবং আসল সময়ের সাথে অবজেক্টের স্পন্দনের জন্য একটি বিশাল অ্যালগোরিদম তৈরি করতে পারি।

কিন্তু, এটা করার আরেকটি উপায় আছে: আমরা ProcessingJS প্রোগ্রামের "ফ্রেম", ব্যবহার করতে পারি, সাধারণত একটি প্রোগ্রাম প্রতি সেকেন্ডে 30 টি "ফ্রেম" চালায়। ProcessingJS এর frameCount চলক ব্যবহার করে বর্তমান ফ্রেম সংখ্যা বের করা যায় এবং frameRate() ফাংশন ব্যবহার করে প্রতি সেকেন্ডে ফ্রেমের সংখ্যাও পরিবর্তন করা যায়। 30 FPS (প্রতি সেকেন্ডে ফ্রেম) হল ডিফল্ট ফ্রেমের হার, এটা চমৎকার অ্যানিমেশন তৈরির জন্য উপযুক্ত ফ্রেমের হার, কিন্তু কিছু সময় ফ্রেমের হার কমিয়ে আনা উপকারি, যেমন ডিবাগিং অর্থাৎ কোডের ত্রুটি সংশোধন করার সময়।

তাহলে পর্যায়কালকে ফ্রেম সংখ্যার উপর ভিত্তি করে প্রকাশ করা যায়, যেহেতু এটা আসল সময়ের সাথে ঘনিষ্ঠভাবে জড়িত- বলা যায় যে প্রতি 30 ফ্রেম, 50 ফ্রেম বা 1000 ফ্রেম পর পর স্পন্দনের পুনরাবৃত্তি ঘটবে।

বিস্তার এবং পর্যায়কাল বের করার পর, এখন সময়ের ফাংশন হিসেবে x কে হিসাব করার জন্য একটি সূত্র লিখতে হবে, যা বর্তমানের ফ্রেম সংখ্যাকে বদলে দেবে।

সূত্রটিকে ভেঙে এটাকে আরও ভালোভাবে বোঝার চেষ্টা করি। প্রথম অংশটি খুবই সহজ। সাইন ফাংশনের আউটপুটকে বিস্তার দিয়ে গুণ করা হয়। আমরা জানি, সাইন -1 থেকে 1 এর মধ্যে স্পন্দনশীল। যদি এই মানকে নিয়ে বিস্তার দিয়ে গুণ করা হয়, তাহলেই আমরা প্রত্যাশিত ফলাফল পাবো: বিস্তার এবং বিস্তারের মধ্যে স্পন্দনশীল একটি মান। (লক্ষ্য করি: এখানে ProcessingJS এর map() ফাংশনও ব্যবহার করা যায় যা পছন্দনীয় সীমার মধ্যে সাইনের আউটপুট দেয়।)

এখন, সাইন ফাংশনটিকে দেখা যাক:

এখানে কি হচ্ছে? আমরা যা জানি তা নিয়ে শুরু করি। আমরা জানি যে, প্রতি 2PI রেডিয়ান পর সাইনের পুনরাবৃত্তি ঘটে—যেমন এটা 0 থেকে শুরু হয়ে 2PI, 4PI, 6PI, ইত্যাদিতে পুনরাবৃত্তি ঘটে। যদি পর্যায়কাল 120 ফ্রেম হয়, তাহলে আমরা চাই frameCount 120 ফ্রেম, 240 ফ্রেম, 360 ফ্রেম, ইত্যাদি হলে যেন স্পন্দনের পুনরাবৃত্তি ঘটে। frameCount শুধুই একটি মাত্র চলক; এটা 0 থেকে শুরু করে ক্রমান্বয়ে বৃদ্ধি পায়। এখন সূত্রগুলো থেকে পাওয়া ফলাফলগুলো দেখা যাক।

frameCount কে পর্যায়কাল দিয়ে ভাগ করলে পূর্ণ স্পন্দনের সংখ্যা পাওয়া যায়—অর্ধেক স্পন্দন কি সম্পন্ন হয়েছে? নাকি দুইটি স্পন্দন পূর্ণ হয়েছে? ঐ সংখ্যাটিকে TWO_PI দিয়ে গুণ করলে, আমরা ফলাফল পেয়ে যাব, কারণ একটি সাইনের একটি পূর্ণ স্পন্দন সম্পন্ন করতে যে সংখ্যক রেডিয়ান দরকার তা হল TWO_PI ।

সবকিছুকে একসাথে করে দেখা যাক, এখানের প্রোগ্রামটি বৃত্তের x অবস্থানকে স্পন্দনশীল করে যার বিস্তার 100 পিক্সেল এবং পর্যায়কালকে 120 ফ্রেম।

আরেকটি বিষয় সম্পর্কে জানা খুবই গুরুত্বপূর্ণ এবং সেটা হল কম্পাঙ্ক (frequency): প্রতি সেকেন্ডে যতগুলো পূর্ণ তরঙ্গ সৃষ্টি হয় তাকে তরঙ্গের কম্পাঙ্ক বলা হয়। কম্পাঙ্ক সমান হল 1 ভাগ পর্যায়কাল। যদি পর্যায়কাল 120 ফ্রেম হয়, তাহলে একটি ফ্রেমে তরঙ্গের 1/120 তম স্পন্দন পূর্ণ হয় এবং কম্পাঙ্ক হল = 1/120 স্পন্দন/ফ্রেম। উপরের উদাহরণে, আমরা স্পন্দনের হারকে পর্যায়কাল দিয়ে সংজ্ঞায়িত করেছি এবং একারণে কম্পাঙ্কের জন্য কোন চলকের প্রয়োজন হয়নি।

লক্ষ্য করি, আমরা এসব কিছুই সাইন ফাংশন ব্যবহার করে করেছি (ProcessingJS এ sin()) এবং মজার বিষয় হল, কোসাইন প্রয়োগ করার উপায়ও একই। উভয়ের জন্য পর্যায়কাল একই এবং মূল পার্থক্য হল, বিস্তার 1 অথবা 0 থেকে শুরু হওয়া।

এই "প্রাকৃতিক সিমুলেশন" কোর্সটি নেওয়া হয়েছে Daniel Shiffman (ড্যানিয়েল শিফম্যান) এর লেখা "The Nature of Code" (কোডের প্রকৃতি) থেকে এবং এটি ক্রিয়েটিভ কমন্সের এট্রিবিউশন-নন কমার্শিয়াল 3.0 আনপোরটেড লাইসেন্সের অধিনস্ত।