BabylonJS একটি শক্তিশালী 3D ইঞ্জিন যা বিভিন্ন ধরনের ফিজিক্স সিমুলেশন সমর্থন করে। গ্র্যাভিটি, ভেলোসিটি (গতি), এবং কোলিশন ডিটেকশন (Collision Detection) হল এমন কিছু মূল ফিচার যা আপনার 3D প্রজেক্টে অবজেক্টের গতিশীলতা এবং বাস্তবতার অনুভূতি সৃষ্টি করতে সাহায্য করে। এই ফিচারগুলো ব্যবহার করে আপনি অবজেক্টের চলাচল এবং একে অপরের সাথে সংঘর্ষের (collision) প্রভাব খুব সহজে নিয়ন্ত্রণ করতে পারেন।
গ্র্যাভিটি (Gravity) এবং ভেলোসিটি (Velocity)
গ্র্যাভিটি এবং ভেলোসিটি 3D সিমুলেশনে অবজেক্টের গতি এবং মুভমেন্ট নিয়ন্ত্রণ করে। গ্র্যাভিটি সাধারণত পৃথিবীর মতো একটি শক্তি যা সব সময় নিচে দিকে কাজ করে। ভেলোসিটি অবজেক্টের গতির মাপ, যা দিক এবং গতির হার নির্দেশ করে।
গ্র্যাভিটি সেট করা
BabylonJS এ গ্র্যাভিটি সেট করতে, আপনি Scene অবজেক্টের gravity প্রপার্টি ব্যবহার করতে পারেন। এটি দৃশ্যের মধ্যে একটি সাধারণ গ্র্যাভিটি শক্তি সংজ্ঞায়িত করে।
scene.gravity = new BABYLON.Vector3(0, -0.9, 0); // নিচে দিকে গ্র্যাভিটি
scene.collisionsEnabled = true; // কোলিশন সক্ষম করা
কোড ব্যাখ্যা:
new BABYLON.Vector3(0, -0.9, 0): এই কোডটি গ্র্যাভিটির শক্তি এবং দিক নির্ধারণ করে। এখানে গ্র্যাভিটি নিচের দিকে (Y-অক্ষের নেগেটিভ দিক) কাজ করবে।scene.collisionsEnabled = true: কোলিশন ডিটেকশন সক্ষম করা হয়েছে, যা অবজেক্টের মধ্যে সংঘর্ষ শনাক্ত করবে।
ভেলোসিটি সেট করা
অবজেক্টের ভেলোসিটি (গতি) সেট করতে, আপনি physicsImpostor ব্যবহার করবেন। এখানে একটি সিম্পল উদাহরণ দেওয়া হল:
var box = BABYLON.MeshBuilder.CreateBox("box", {size: 2}, scene);
var boxPhysics = box.physicsImpostor = new BABYLON.PhysicsImpostor(box, BABYLON.PhysicsImpostor.BoxImpostor, {mass: 1, friction: 0.5, restitution: 0.7}, scene);
// ভেলোসিটি সেট করা
boxPhysics.setLinearVelocity(new BABYLON.Vector3(0, 10, 0)); // X, Y, Z অক্ষের গতি
কোড ব্যাখ্যা:
new BABYLON.PhysicsImpostor: অবজেক্টকে ফিজিক্স সিমুলেশনের জন্য প্রস্তুত করতে ব্যবহার হয়।boxPhysics.setLinearVelocity(new BABYLON.Vector3(0, 10, 0)): এখানে Y-অক্ষের জন্য গতি দেওয়া হয়েছে (10 ইউনিট উপরের দিকে)।
কোলিশন ডিটেকশন (Collision Detection)
কোলিশন ডিটেকশন এমন একটি প্রক্রিয়া যেখানে একাধিক 3D অবজেক্টের মধ্যে সংঘর্ষের ঘটনা শনাক্ত করা হয়। BabylonJS এ, আপনি কোলিশন ডিটেকশন সহজেই চালু করতে পারেন। কোলিশন ঘটানোর জন্য দুইটি অবজেক্টের মধ্যে কমপ্লেক্স ফিজিক্স ইন্টারঅ্যাকশন থাকতে হয়।
কোলিশন ডিটেকশন সক্ষম করা
কোলিশন ডিটেকশন চালু করতে, আপনাকে collisionsEnabled এবং checkCollisions ব্যবহার করতে হবে।
// গ্র্যাভিটি এবং কোলিশন সক্রিয় করা
scene.gravity = new BABYLON.Vector3(0, -9.81, 0);
scene.collisionsEnabled = true;
// বক্স তৈরি করা
var box = BABYLON.MeshBuilder.CreateBox("box", {size: 2}, scene);
box.checkCollisions = true; // কোলিশন চেকিং চালু করা
// গ্রাউন্ড তৈরি করা
var ground = BABYLON.MeshBuilder.CreateGround("ground", {width: 10, height: 10}, scene);
ground.checkCollisions = true; // কোলিশন চেকিং চালু করা
কোড ব্যাখ্যা:
box.checkCollisions = true;: এই প্রপার্টি সেট করা হলে, বক্সটি কোলিশন ডিটেকশন করবে।ground.checkCollisions = true;: একইভাবে, গ্রাউন্ডেও কোলিশন ডিটেকশন চালু করা হয়েছে।
কোলিশন ইভেন্টের জন্য হ্যান্ডলার সেট করা
কোলিশন ডিটেকশন করার পর, আপনি onCollide ইভেন্ট ব্যবহার করে কোলিশন শনাক্ত করতে পারেন এবং কোলিশন ঘটানোর পর কী ঘটবে তা নির্ধারণ করতে পারেন।
box.onCollide = function (mesh) {
console.log("বক্সটি " + mesh.name + " এর সাথে কোলিশন করেছে!");
// কোলিশন পরবর্তী কোনো কাজ করুন
};
কোড ব্যাখ্যা:
box.onCollide: এই হ্যান্ডলারটি বক্সের কোলিশন ঘটলে ট্রিগার হবে এবং আপনি ইভেন্টটি শনাক্ত করতে পারবেন।
গ্র্যাভিটি, ভেলোসিটি এবং কোলিশন ডিটেকশন সহ একটি সিম্পল 3D দৃশ্য
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BabylonJS Gravity, Velocity and Collision</title>
<script src="https://cdn.babylonjs.com/babylon.js"></script>
</head>
<body>
<canvas id="renderCanvas" style="width: 100%; height: 100%"></canvas>
<script>
var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas, true);
var scene = new BABYLON.Scene(engine);
// ক্যামেরা তৈরি
var camera = new BABYLON.ArcRotateCamera("camera1", Math.PI / 2, Math.PI / 2, 10, BABYLON.Vector3.Zero(), scene);
camera.attachControl(canvas, true);
// আলোর উৎস তৈরি
var light = new BABYLON.HemisphericLight("light1", BABYLON.Vector3.Up(), scene);
light.intensity = 0.7;
// গ্র্যাভিটি এবং কোলিশন সক্রিয় করা
scene.gravity = new BABYLON.Vector3(0, -9.81, 0);
scene.collisionsEnabled = true;
// বক্স তৈরি করা
var box = BABYLON.MeshBuilder.CreateBox("box", {size: 2}, scene);
box.position.y = 5; // বক্সকে উপরে রাখুন
box.checkCollisions = true;
// গ্রাউন্ড তৈরি করা
var ground = BABYLON.MeshBuilder.CreateGround("ground", {width: 10, height: 10}, scene);
ground.checkCollisions = true;
// Physics Impostor যুক্ত করা
var boxPhysics = box.physicsImpostor = new BABYLON.PhysicsImpostor(box, BABYLON.PhysicsImpostor.BoxImpostor, {mass: 1, friction: 0.5, restitution: 0.7}, scene);
boxPhysics.setLinearVelocity(new BABYLON.Vector3(0, -5, 0)); // নিচে গতি দেওয়া
// কোলিশন ইভেন্ট
box.onCollide = function (mesh) {
console.log("বক্সটি " + mesh.name + " এর সাথে কোলিশন করেছে!");
};
// দৃশ্য রেন্ডার করা
engine.runRenderLoop(function () {
scene.render();
});
window.addEventListener("resize", function () {
engine.resize();
});
</script>
</body>
</html>
সারাংশ
BabylonJS এ গ্র্যাভিটি, ভেলোসিটি এবং কোলিশন ডিটেকশন ব্যবহারের মাধ্যমে আপনি 3D অবজেক্টের চলাচল এবং তাদের মধ্যে সংঘর্ষের ইন্টারঅ্যাকশন সিমুলেট করতে পারেন। গ্র্যাভিটি অবজেক্টকে পৃথিবীর মতো প্রভাবিত করে, ভেলোসিটি তাদের গতি নিয়ন্ত্রণ করে এবং কোলিশন ডিটেকশন অবজেক্টগুলোর মধ্যে সংঘর্ষ শনাক্ত করে। এই সবগুলো একসাথে ব্যবহার করলে 3D সিমুলেশন আরো বাস্তবসম্মত এবং ইন্টারেকটিভ হয়।
Read more
