If you're seeing this message, it means we're having trouble loading external resources on our website.

তোমার যদি কোন ওয়েব ফিল্টার দেওয়া থাকে, তাহলে দয়া করে নিশ্চিত কর যে *.kastatic.org এবং *.kasandbox.org ডোমেইনগুলো উন্মুক্ত।

মূল বিষয়বস্তু

তরঙ্গ

এখন বলা যেতে পারে, “এগুলো সব ঠিক আছে, কিন্তু আমরা পর্দায় তরঙ্গ তৈরি করতে চাই,” সত্যি, তরঙ্গ তৈরি করার সময় চলে এসেছে। আসলে, আমাদের প্রায় 90% কাজ শেষ। সাইন ফাংশন অনুযায়ী একটি বৃত্ত উপরে-নিচে স্পন্দিত হওয়ার সময় আসলে, আমরা তরঙ্গের x-অক্ষের বরাবর একটি বিন্দুর স্পন্দন লক্ষ্য করি। নিপুণভাবে একটি for লুপ ব্যবহার করে, আমরা এরূপ একাধিক বৃত্তকে পাশাপাশি স্পন্দিত অবস্থায় দেখতে পারি।
এই স্পন্দনশীল তরঙ্গ দিয়ে কোন প্রাণীর দেহ অথবা উপাঙ্গ মডেল করা যায়, এছাড়াও নমনীয় তল তৈরির ক্ষেত্রেও এটি ব্যবহার করা যায় (যেমন পানি)।
এখানেও, আমরা বিস্তার (তরঙ্গের উচ্চতা) এবং পর্যায়কাল সম্পর্কিত একই প্রশ্নের সম্মুখীন হবো। আমরা একটি পূর্ণ তরঙ্গ দেখছি, এজন্য পর্যায়কালকে সময় হিসেবে বিবেচনা না করে, পর্যায়কালকে আমরা একটি পূর্ণ স্পন্দনের প্রস্থ (পিক্সেলে) হিসেবে বিবেচনা করতে পারি। স্পন্দনের মতই, পর্যায়কালের উপর ভিত্তি করে অথবা কৌণিক বেগ থেকে তরঙ্গের প্যাটার্ন হিসাব করা যায়।
কৌণিক বেগ দিয়ে সহজ উপায়েই করা যাক। আমাদের একটি কোণ (angle), কৌণিক বেগ (angleVel) এবং বিস্তার (amplitude) নিয়ে শুরু করতে হবে:
var angle = 0;
var angleVel = 0.2;
var amplitude = 100;
তারপর যেখানে আমরা একটি তরঙ্গের বিন্দু আঁকতে চাই, সে স্থানে সকল x এর মান লুপ করব । ধরি, প্রতি 24 পিক্সেল পর পর। এই লুপে, আমরা তিনটি কাজ করবো:
  1. কোণের সাইন এবং বিস্তারের সাপেক্ষে y অবস্থান বের করবো।
  2. (x,y) অবস্থানে একটি বৃত্ত আঁকবো।
  3. কৌণিক বেগের উপর ভিত্তি করে কোণ বৃদ্ধি করতে থাকবো।
for (var x = 0; x <= width; x += 24) {
    // কোণের সাইন এবং বিস্তারের সাপেক্ষে y অবস্থান বের করা যাক
    var y = amplitude * sin(angle);
    // x, y অবস্থানে একটি বৃত্ত আঁকা যাক
    ellipse(x, y+height/2, 48, 48);
    // কৌণিক বেগের উপর ভিত্তি করে এখানে কোণ বৃদ্ধি করতে হবে
    angle += angleVel;
}
নিচে ভিন্ন মানের angleVel এর ক্ষেত্রে ফলাফলগুলো দেওয়া হল:
লক্ষ্য করি, যদিও আমরা তরঙ্গের পর্যায়কাল হিসাব করছি না, তবুও যতই কৌণিক বেগ বৃদ্ধি পায়, ততই পর্যায়কাল কমে আসে। আরেকটি বিষয় লক্ষ্য করা উচিত, যতই পর্যায়কাল কমে আসছে, তরঙ্গ তৈরি করা আরও কঠিন হয়ে পরছে কারণ প্রত্যেকটি বিন্দুর মধ্যবর্তী দূরত্ব বৃদ্ধি পাচ্ছে। একটি উপায় হল beginShape() এবং endShape() ব্যবহার করে বিন্দুগুলোকে এক রেখায় যুক্ত করা।
উপরের উদাহরণটি স্থবির। তরঙ্গের কোন পরিবর্তন ঘটে না, স্পন্দন ঘটে না এবং এটিই আমরা এতক্ষণ তৈরি করছিলাম। এখন এই স্থবির তরঙ্গটিকে অ্যানিমেশন করানো কিছুটা জটিল। চিন্তা করা যেতে পারে: “এটি কোন ব্যাপারই নয়, আমরা কোণ (angle) কে সার্বজনীন চলক হিসেবে প্রকাশ করে এটিকে শুধু প্রতিটি স্পন্দন পর পর draw() এ বৃদ্ধি করলেই কাজটি হয়ে যাবে।”
যদিও চিন্তাটা যুক্তিপূর্ণ, কিন্তু এটা কাজ করবে না। স্থির তরঙ্গের দিকে খেয়াল করলে দেখা যাবে, ডানদিকের প্রান্ত বামদিকের প্রান্তের সাথে মেলে না; একটি পূর্ণ স্পন্দন সম্পন্ন হলে তরঙ্গ draw() এ যেখানে শেষ হয়, পরবর্তীতে সেখান থেকে শুরু হতে পারে না। একারণে, তরঙ্গ কোন কোণে শুরু হবে সেটার হিসাব রাখার জন্য একটি চলক প্রয়োজন। এই কোণ (যার নাম হল startAngle) কৌণিক বেগের সাথে স্বয়ংক্রিয়ভাবে বৃদ্ধি পায়।
এখানে, এই কোণটি ব্যবহার করা হয়েছে। সংখ্যা বদল করলে স্পন্দনশীল তরঙ্গের বিভিন্ন পরিবর্তন পরিলক্ষিত হয়।

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