3D Model Import এবং Export গাইড ও নোট

BabylonJS-এ 3D মডেল ইম্পোর্ট এবং এক্সপোর্ট একটি অত্যন্ত গুরুত্বপূর্ণ বৈশিষ্ট্য, যেটি আপনাকে বিভিন্ন 3D সফটওয়্যার থেকে মডেল গ্রহণ বা রপ্তানি করতে সহায়তা করে। এতে, আপনি Blender, 3ds Max, Maya, এবং অন্যান্য 3D মডেলিং সফটওয়্যার থেকে মডেল ইম্পোর্ট করতে পারেন এবং পরবর্তীতে সেগুলি BabylonJS দৃশ্যে ব্যবহার করতে পারেন।

১. 3D Model Import (ইম্পোর্ট)

BabylonJS বিভিন্ন ফর্ম্যাটের 3D মডেল ইম্পোর্ট সমর্থন করে, যেমন .glb, .gltf, .obj, .babylon ইত্যাদি। এর মধ্যে .glb এবং .gltf সবচেয়ে জনপ্রিয় এবং আধুনিক ফর্ম্যাট, কারণ এই ফরম্যাটগুলি খুবই হালকা এবং ওয়েবের জন্য উপযোগী।

১.১. GLTF/GLB ফাইল ইম্পোর্ট

GLTF (GL Transmission Format) হল একটি ওপেন স্ট্যান্ডার্ড ফাইল ফরম্যাট যা 3D মডেল, অ্যানিমেশন, টেক্সচার এবং অন্যান্য বৈশিষ্ট্য সংরক্ষণ করতে ব্যবহৃত হয়। এটি দ্রুত লোডিং এবং সাপোর্টেড প্ল্যাটফর্মের জন্য আদর্শ।

GLTF বা GLB ফাইল ইম্পোর্ট করার উদাহরণ:

BABYLON.SceneLoader.Append("models/", "model.glb", scene, function (scene) {
    console.log("3D Model Loaded Successfully!");
});

এখানে:

• "models/": আপনার মডেলটি যেখানে সংরক্ষিত আছে।
• "model.glb": ইম্পোর্ট করা ফাইলের নাম।
• scene: যে দৃশ্যটিতে মডেলটি লোড হবে।
• Append: ফাংশনটি মডেলটি দৃশ্যে যুক্ত করবে।

এছাড়া, আপনি SceneLoader.ImportMesh ফাংশন ব্যবহার করে একাধিক অবজেক্ট লোডও করতে পারেন:

BABYLON.SceneLoader.ImportMesh("", "models/", "model.glb", scene, function (meshes) {
    // meshes[0] প্রথম মডেল অবজেক্ট
});

১.২. .obj ফাইল ইম্পোর্ট

BabylonJS-এ .obj ফাইলও ইম্পোর্ট করা সম্ভব, তবে এটি সাধারণত .glb বা .gltf এর তুলনায় কম ব্যবহৃত হয়।

BABYLON.SceneLoader.Append("models/", "model.obj", scene, function () {
    console.log("OBJ Model Loaded!");
});

এখানে, .obj ফাইলের মধ্যে শুধুমাত্র জ্যামিতিক তথ্য থাকে, এবং আপনি আলাদা টেক্সচার ফাইল (যেমন .mtl) ব্যবহার করতে হতে পারে।

২. 3D Model Export (এক্সপোর্ট)

BabylonJS ব্যবহারকারীদের জন্য 3D মডেল এক্সপোর্ট করারও সুবিধা প্রদান করে। এর মাধ্যমে, আপনি তৈরি করা মডেল বা দৃশ্যকে একটি ফাইল ফরম্যাটে রপ্তানি করতে পারেন যা পরবর্তী সময়ে অন্য প্ল্যাটফর্মে বা সফটওয়্যারে ব্যবহার করা যাবে।

২.১. Babylon ফাইল এক্সপোর্ট

BabylonJS-এ একটি BABYLON.Scene বা BABYLON.Mesh-কে .babylon ফরম্যাটে এক্সপোর্ট করা যায়। .babylon ফাইলটি একটি JSON ভিত্তিক ফরম্যাট, যা এই লাইব্রেরির দ্বারা সাপোর্ট করা হয় এবং এটি অন্যান্য BabylonJS প্রজেক্টে সহজে লোড করা যায়।

Babylon ফাইল এক্সপোর্টের উদাহরণ:

BABYLON.SceneLoader.ExportScene(scene, "exportedScene.babylon");

এখানে, scene হচ্ছে যে দৃশ্যটি আপনি এক্সপোর্ট করতে চান এবং "exportedScene.babylon" ফাইলের নাম যা রপ্তানি করা হবে।

২.২. GLTF/GLB ফাইল এক্সপোর্ট

BabylonJS-এ আপনি GLTF এবং GLB ফরম্যাটেও মডেল এক্সপোর্ট করতে পারেন, যা খুবই জনপ্রিয় ওয়েব ভিত্তিক 3D ফরম্যাট। GLTF ফাইল এক্সপোর্টের জন্য GLTFExport প্লাগইন ব্যবহার করতে হবে।

GLTF/GLB ফাইল এক্সপোর্টের উদাহরণ:

BABYLON.GLTF2Export.GLB(scene, "modelExport.glb", (glb) => {
    console.log("GLB model exported successfully!");
});

এখানে:

• scene: যে দৃশ্যটি আপনি এক্সপোর্ট করতে চান।
• "modelExport.glb": এক্সপোর্ট হওয়া GLB ফাইলের নাম।

GLTF এক্সপোর্টের জন্য আপনি GLTF2Export.Gltf ফাংশন ব্যবহার করতে পারেন:

BABYLON.GLTF2Export.Gltf(scene, "modelExport.gltf", (gltf) => {
    console.log("GLTF model exported successfully!");
});

৩. মডেল ইম্পোর্ট এবং এক্সপোর্টের টিপস

৩.১. টেক্সচার সহ ইম্পোর্ট

যখন আপনি কোনো 3D মডেল ইম্পোর্ট করেন, তখন মডেলের সাথে যদি টেক্সচারও থাকে, তবে নিশ্চিত হয়ে নিন যে টেক্সচার ফাইলগুলোর পথ সঠিকভাবে নির্দিষ্ট করা আছে। একাধিক টেক্সচার এক্সপোর্ট বা ইম্পোর্ট করার সময়, মডেলটি যাতে সঠিকভাবে রেন্ডার হয়, তা পরীক্ষা করুন।

৩.২. আলোর উৎস এবং কেমেরা

গ্লTF বা GLB ফাইলের সাথে আলোর উৎস এবং কেমেরা ইম্পোর্ট হতে পারে, তবে BabylonJS-এর SceneLoader যখন মডেল ইম্পোর্ট করে, তখন আপনি প্রয়োজন অনুসারে নতুন আলোর উৎস এবং কেমেরা সেট করতে পারেন।

var camera = new BABYLON.ArcRotateCamera("camera1", Math.PI / 2, Math.PI / 2, 10, BABYLON.Vector3.Zero(), scene);
camera.attachControl(canvas, true);

৩.৩. Animation Import

BabylonJS GLTF/GLB ফাইল ফরম্যাটের মাধ্যমে অ্যানিমেশনও ইম্পোর্ট করা সম্ভব। যদি আপনি Blender বা অন্য 3D সফটওয়্যারে অ্যানিমেশন তৈরি করে থাকেন, তবে তা .gltf বা .glb ফাইলের মধ্যে সেভ হয়ে যাবে এবং BabylonJS স্বয়ংক্রিয়ভাবে সেই অ্যানিমেশনগুলো লোড করবে।

সারাংশ

• 3D Model Import: BabylonJS-এ .glb, .gltf, .obj, এবং .babylon ফরম্যাটে মডেল ইম্পোর্ট করা যায়।
• 3D Model Export: আপনি BabylonJS-এ তৈরি করা মডেল এবং দৃশ্য .babylon, .glb, এবং .gltf ফরম্যাটে এক্সপোর্ট করতে পারেন।
• GLTF/GLB: এই ফরম্যাটটি দ্রুত লোডিং এবং ওয়েব সাপোর্টের জন্য উপযুক্ত, এবং BabylonJS একে সহজভাবে ইম্পোর্ট এবং এক্সপোর্ট করতে সক্ষম।
• Animation: GLTF/GLB ফাইলের মাধ্যমে অ্যানিমেশনও ইম্পোর্ট করা যায়, যা গেম বা সিমুলেশন ডেভেলপমেন্টে অত্যন্ত গুরুত্বপূর্ণ।

এই বৈশিষ্ট্যগুলি ব্যবহার করে আপনি একাধিক সফটওয়্যার থেকে মডেল নিয়ে এসে BabylonJS-এ তাদের রেন্ডার করতে পারেন এবং আপনার প্রজেক্টে অন্তর্ভুক্ত করতে পারেন।

BabylonJS একটি শক্তিশালী 3D গ্রাফিক্স ইঞ্জিন, যা বিভিন্ন 3D ফাইল ফরম্যাট যেমন OBJ, STL, এবং GLTF/GLB সমর্থন করে। এই ফাইল ফরম্যাটগুলি 3D মডেল তৈরি এবং আমদানির জন্য খুবই জনপ্রিয় এবং সহজেই ব্যবহৃত হয়। BabylonJS এ এই ফরম্যাটগুলো আমদানি করা সহজ, যা আপনাকে আপনার 3D প্রজেক্টে কাস্টম মডেল ব্যবহার করতে সাহায্য করে।

৩D মডেল ফরম্যাট

১. OBJ ফরম্যাট

OBJ একটি সাধারণ 3D মডেল ফরম্যাট যা মূলত 3D জ্যামিতি (vertices, edges, faces) ধারণ করে। এটি বেশিরভাগ 3D মডেলিং সফটওয়্যার দ্বারা এক্সপোর্ট করা হয়। তবে, এটি কেবল মডেলিং তথ্য প্রদান করে, টেক্সচার এবং ম্যাটেরিয়াল ফাইল আলাদা রাখে (সাধারণত .mtl ফরম্যাটে)।

২. STL ফরম্যাট

STL (STereoLithography) একটি জনপ্রিয় 3D প্রিন্টিং ফরম্যাট যা 3D মডেলের জ্যামিতি সংরক্ষণ করে। এটি সাধারণত 3D প্রিন্টিং উদ্দেশ্যে ব্যবহৃত হয় এবং এটি টেক্সচার বা ম্যাটেরিয়াল ধারণ করে না, শুধুমাত্র মডেলের পৃষ্ঠের তথ্য রাখে।

৩. GLTF/GLB ফরম্যাট

GLTF (GL Transmission Format) একটি অত্যন্ত জনপ্রিয় এবং আধুনিক 3D ফাইল ফরম্যাট। এটি 3D মডেল, টেক্সচার, অ্যানিমেশন, ম্যাটেরিয়াল এবং অন্যান্য উপাদান একটি মাত্র ফাইলে সংরক্ষণ করে। GLB হলো GLTF-এর বাইনারি ভার্সন। GLTF/GLB ফরম্যাটের সুবিধা হলো এটি দ্রুত লোড হয় এবং ওয়েব অ্যাপ্লিকেশনগুলিতে খুবই কার্যকরী।

BabylonJS এ 3D মডেল আমদানি

BabylonJS তে এই ফরম্যাটগুলির মধ্যে 3D মডেল আমদানির জন্য বিভিন্ন API এবং প্লাগইন ব্যবহার করা যেতে পারে।

১. OBJ ফরম্যাটে মডেল আমদানি

OBJ ফরম্যাটে মডেল আমদানির জন্য আপনি BABYLON.SceneLoader.ImportMesh() ফাংশন ব্যবহার করতে পারেন।

উদাহরণ:

BABYLON.SceneLoader.ImportMesh("", "path/to/obj/", "model.obj", scene, function(meshes) {
    // মডেল লোড হওয়ার পর এখানে কোড লিখুন
    var objMesh = meshes[0]; // প্রথম মডেলটি ধরে নেয়া
    objMesh.position = new BABYLON.Vector3(0, 0, 0);  // পজিশন সেট করা
});

এখানে "path/to/obj/" হল আপনার OBJ ফাইলের অবস্থান, এবং "model.obj" হচ্ছে আপনার OBJ ফাইলের নাম।

২. STL ফরম্যাটে মডেল আমদানি

STL ফরম্যাটে মডেল আমদানি করতে, BabylonJS সরাসরি SceneLoader এর মাধ্যমে STL ফাইল লোড করতে পারে না। তবে, আপনি STLLoader প্লাগইন ব্যবহার করতে পারেন। STL ফাইল লোড করার জন্য প্রথমে এই প্লাগইনটি যোগ করতে হবে।

উদাহরণ:

<script src="https://cdn.babylonjs.com/stlLoader.js"></script>

এরপর আপনি এই কোড ব্যবহার করে STL ফাইল লোড করতে পারবেন:

BABYLON.SceneLoader.ImportMesh("", "path/to/stl/", "model.stl", scene, function(meshes) {
    var stlMesh = meshes[0];  // মডেলটিকে meshes থেকে নেয়া
    stlMesh.position = new BABYLON.Vector3(0, 0, 0);  // পজিশন সেট করা
});

এখানে "path/to/stl/" হল STL ফাইলের অবস্থান এবং "model.stl" হচ্ছে STL ফাইলের নাম।

৩. GLTF/GLB ফরম্যাটে মডেল আমদানি

GLTF এবং GLB ফরম্যাটে মডেল আমদানি করা সবচেয়ে সহজ এবং দ্রুত। BabylonJS এ GLTF/GLB ফাইল লোড করতে SceneLoader.ImportMesh() ব্যবহার করা হয়, তবে GLTF এর জন্য এটি আরো সহজ।

উদাহরণ:

BABYLON.SceneLoader.ImportMesh("", "path/to/gltf/", "model.gltf", scene, function(meshes) {
    var gltfMesh = meshes[0];  // GLTF মডেলটি meshes থেকে নেয়া
    gltfMesh.position = new BABYLON.Vector3(0, 0, 0);  // পজিশন সেট করা
});

এখানে "path/to/gltf/" হল GLTF ফাইলের অবস্থান এবং "model.gltf" হচ্ছে GLTF ফাইলের নাম।

GLB ফরম্যাট জন্য একইভাবে কোড ব্যবহার করা যায়, শুধু ফাইল এক্সটেনশনটি .glb হবে।

BABYLON.SceneLoader.ImportMesh("", "path/to/glb/", "model.glb", scene, function(meshes) {
    var glbMesh = meshes[0];  // GLB মডেলটি meshes থেকে নেয়া
    glbMesh.position = new BABYLON.Vector3(0, 0, 0);  // পজিশন সেট করা
});

৪. 3D মডেল লোডিং এর পর কাজ করা

একবার আপনি মডেল লোড করে নিলেই, তার উপর বিভিন্ন কাজ করতে পারেন, যেমন:

• পজিশন এবং রোটেশন: মডেলের অবস্থান এবং ঘূর্ণন পরিবর্তন করা।

model.position = new BABYLON.Vector3(0, 2, 0); // Y অক্ষে 2 ইউনিট উপরে স্থানান্তরিত করা
model.rotation = new BABYLON.Vector3(0, Math.PI / 2, 0); // Y অক্ষে 90° ঘুরানো

• টেক্সচারিং এবং ম্যাটেরিয়াল: মডেলটির জন্য নতুন টেক্সচার বা ম্যাটেরিয়াল অ্যাপ্লাই করা।

var material = new BABYLON.StandardMaterial("mat", scene);
material.diffuseTexture = new BABYLON.Texture("path/to/texture.jpg", scene);
model.material = material; // মডেলের উপর টেক্সচার প্রয়োগ করা

সারাংশ

BabylonJS এ OBJ, STL, এবং GLTF/GLB ফরম্যাটে 3D মডেল আমদানি করা সম্ভব এবং এই প্রক্রিয়াটি খুবই সহজ। আপনি SceneLoader.ImportMesh() ব্যবহার করে এই ফরম্যাটগুলির মডেল লোড করতে পারেন এবং তারপর সেগুলি পজিশন, রোটেশন, টেক্সচারিং ইত্যাদি কাস্টমাইজ করতে পারেন। GLTF/GLB ফরম্যাটটি আধুনিক 3D মডেলিং ফরম্যাট হিসেবে বিশেষভাবে জনপ্রিয় এবং এটি দ্রুত লোড হয়, যা ওয়েব অ্যাপ্লিকেশনে ব্যবহার করার জন্য আদর্শ।

BabylonJS এ 3D মডেল ইমপোর্ট করা একটি গুরুত্বপূর্ণ এবং সাধারণ প্রক্রিয়া, যা গেম ডেভেলপমেন্ট এবং 3D সিমুলেশন প্রকল্পে ব্যবহৃত হয়। BabylonJS আপনাকে বিভিন্ন ফর্ম্যাটে তৈরি মডেল ইমপোর্ট করার সুবিধা প্রদান করে, যেমন .obj, .gltf, .glb, .fbx ইত্যাদি। এই মডেলগুলো ইমপোর্ট করার মাধ্যমে আপনি আপনার দৃশ্যে অত্যন্ত বাস্তবসম্মত অবজেক্ট এবং চরিত্রগুলো অন্তর্ভুক্ত করতে পারেন।

BabylonJS একটি শক্তিশালী মডেল ইমপোর্ট সিস্টেমের মাধ্যমে আপনাকে মডেলগুলো সহজেই ইমপোর্ট করতে দেয়, এবং বেশ কিছু কাস্টমাইজেশন অপশনও প্রদান করে।

১. গ্লিটিএফ (GLTF) এবং গ্লিব (GLB) ফাইল ইমপোর্ট

GLTF (GL Transmission Format) এবং GLB হল আধুনিক এবং ইফিশিয়েন্ট 3D মডেল ফরম্যাট যা BabylonJS সাপোর্ট করে। GLTF হলো JSON ভিত্তিক ফাইল ফরম্যাট, এবং GLB হলো এর বাইনারি ভার্সন। এই ফরম্যাটটি এক্সপোর্ট ও ইমপোর্টের জন্য দ্রুত এবং কমপ্যাক্ট, যা ইন্টারঅ্যাক্টিভ 3D অ্যাপ্লিকেশন তৈরিতে ব্যবহৃত হয়।

উদাহরণ: GLTF ফাইল ইমপোর্ট করা

// Scene তৈরি করা
var scene = new BABYLON.Scene(engine);

// GLTF মডেল ইমপোর্ট করা
BABYLON.SceneLoader.Append("assets/models/", "myModel.gltf", scene, function (scene) {
    console.log("Model loaded successfully!");
}, null, function (scene, message) {
    console.error("Failed to load model: " + message);
});

GLTF ইমপোর্টের বেসিক প্যারামিটার:

• "assets/models/": মডেলটির অবস্থান।
• "myModel.gltf": মডেল ফাইলের নাম।
• scene: দৃশ্যের জন্য ব্যবহার করা সীনে মডেলটি লোড হবে।

GLTF মডেল সাধারণত পণ্য, চরিত্র, পরিবেশ ইত্যাদি উপস্থাপন করতে ব্যবহৃত হয়। GLTF ফাইলগুলো টেক্সচার, অ্যানিমেশন এবং ম্যাটেরিয়ালসহ কনফিগার করা যায়।

২. .OBJ ফাইল ইমপোর্ট

.OBJ ফাইল ফরম্যাট একটি পুরানো কিন্তু জনপ্রিয় ফাইল ফরম্যাট যা 3D মডেল তৈরি এবং এক্সপোর্ট করার জন্য ব্যবহৃত হয়। BabylonJS এ .OBJ ফাইল ইমপোর্টের জন্য আপনি OBJ file loader ব্যবহার করতে পারেন।

উদাহরণ: .OBJ ফাইল ইমপোর্ট করা

// Scene তৈরি করা
var scene = new BABYLON.Scene(engine);

// .OBJ ফাইল ইমপোর্ট করা
BABYLON.SceneLoader.Append("assets/models/", "model.obj", scene, function (scene) {
    console.log("OBJ Model loaded successfully!");
}, null, function (scene, message) {
    console.error("Failed to load OBJ model: " + message);
});

.OBJ ইমপোর্টের বেসিক প্যারামিটার:

• "assets/models/": মডেলটির অবস্থান।
• "model.obj": মডেল ফাইলের নাম।

৩. .FBX ফাইল ইমপোর্ট

.FBX (Filmbox) একটি ব্যাপকভাবে ব্যবহৃত 3D মডেল ফরম্যাট যা মায়া (Maya), ব্লেন্ডার (Blender) এবং অন্যান্য 3D সফটওয়্যার থেকে এক্সপোর্ট করা যায়। এটি সাধারণত অ্যানিমেশন, ক্যারেক্টার রিগিং এবং অন্যান্য অ্যানিমেটেড 3D মডেলগুলো সিমুলেট করতে ব্যবহৃত হয়। BabylonJS-এ FBXLoader ব্যবহার করে .FBX ফাইল ইমপোর্ট করা যায়।

উদাহরণ: .FBX ফাইল ইমপোর্ট করা

// Scene তৈরি করা
var scene = new BABYLON.Scene(engine);

// .FBX ফাইল ইমপোর্ট করা
BABYLON.SceneLoader.ImportMesh("", "assets/models/", "model.fbx", scene, function (meshes) {
    console.log("FBX Model loaded successfully!");
}, null, function (scene, message) {
    console.error("Failed to load FBX model: " + message);
});

.FBX ইমপোর্টের বেসিক প্যারামিটার:

• "assets/models/": মডেলটির অবস্থান।
• "model.fbx": মডেল ফাইলের নাম।

৪. মডেল ইমপোর্ট কনফিগারেশন

এখন, যদি আপনি ইমপোর্টকৃত মডেলের আচরণ কাস্টমাইজ করতে চান, আপনি বিভিন্ন কনফিগারেশন অপশন ব্যবহার করতে পারেন। কিছু সাধারণ কনফিগারেশন অপশন হল:

• ফাইল লোডিং স্ট্যাটাস: মডেল ইমপোর্ট করার সময় লোডিং স্ট্যাটাস দেখানোর জন্য callback ফাংশন ব্যবহার করা।
• অ্যানিমেশন: মডেলটির সঙ্গে যদি অ্যানিমেশন থাকে, তবে সেটা আলাদা করে ইমপোর্ট করা এবং চালানো।
• ম্যাটেরিয়াল এবং টেক্সচার: মডেলের টেক্সচার এবং ম্যাটেরিয়াল সেট করা।

উদাহরণ: অ্যানিমেশন এবং টেক্সচারসহ মডেল ইমপোর্ট

// Scene তৈরি করা
var scene = new BABYLON.Scene(engine);

// GLTF মডেল সহ অ্যানিমেশন ও টেক্সচার ইমপোর্ট
BABYLON.SceneLoader.Append("assets/models/", "animatedModel.gltf", scene, function (scene) {
    console.log("Model and animations loaded successfully!");
    var model = scene.getMeshByName("modelName");
    var animation = scene.getAnimationByName("walkAnimation");
    
    // অ্যানিমেশন চালানো
    scene.beginAnimation(model, 0, 100, true, 1.0);
}, null, function (scene, message) {
    console.error("Failed to load model: " + message);
});

৫. মডেল লোডিং অপটিমাইজেশন

মডেল লোডিং সময় যদি খুব ভারী হয়, তবে আপনার অ্যাপ্লিকেশন স্লো হতে পারে। এর জন্য কিছু অপটিমাইজেশন কৌশল ব্যবহার করতে পারেন:

• ড্রিপ লোডিং (Drip Loading): বড় মডেল বা স্কেনারিওয়ালা দৃশ্যের জন্য শুধুমাত্র প্রয়োজনীয় অংশগুলো একসঙ্গে লোড করতে পারেন।
• বয়স-সীমিত টেক্সচার এবং শেডার: কম্পিউটেশনাল লোড কমাতে পারফরম্যান্স-অপটিমাইজড টেক্সচার ব্যবহার করা যেতে পারে।
• Level of Detail (LOD): মডেলের ডিটেইল লেভেল স্বয়ংক্রিয়ভাবে নির্ধারণ করা।

সারাংশ

BabylonJS-এর মাধ্যমে 3D মডেল ইমপোর্ট করার প্রক্রিয়া সহজ এবং শক্তিশালী। আপনি বিভিন্ন ফরম্যাটের মডেল যেমন GLTF, OBJ, FBX ইত্যাদি ইমপোর্ট করতে পারেন এবং সেগুলোর টেক্সচার, অ্যানিমেশন ও অন্যান্য বৈশিষ্ট্য কাস্টমাইজ করতে পারেন। এছাড়া, লোডিং অপটিমাইজেশন কৌশল ব্যবহার করে আপনার মডেল ইমপোর্টের সময় পারফরম্যান্স উন্নত করা সম্ভব।

BabylonJS আপনাকে বিভিন্ন ফরম্যাটে 3D মডেল এক্সপোর্ট করার সুবিধা প্রদান করে, যা পরে অন্য কোনো প্রজেক্টে ব্যবহার করা যেতে পারে। সাধারণত, GLTF (GL Transmission Format) এবং OBJ ফরম্যাটে এক্সপোর্ট করা হয়। এই ফরম্যাটগুলো সহজে বিভিন্ন 3D ইঞ্জিন ও সফটওয়্যার দ্বারা সাপোর্ট করা হয়, যেমন Blender, Unity, Unreal Engine, ইত্যাদি।

এখানে আমরা GLTF ফরম্যাটে 3D মডেল এক্সপোর্ট করার পদ্ধতি আলোচনা করব, কারণ এটি আধুনিক ওয়েব প্রযুক্তির সাথে ভালোভাবে কাজ করে এবং কম্প্যাক্ট, ফাস্ট এবং ওয়েব-ফ্রেন্ডলি।

GLTF ফরম্যাটে এক্সপোর্ট করা

BabylonJS এ GLTF ফরম্যাটে মডেল এক্সপোর্ট করার জন্য BABYLON.GLTF2Export ইউটিলিটি ব্যবহার করা হয়। এটি আপনাকে কোনো 3D মডেল (যেমন, বক্স, sphere বা আরও কাস্টম মডেল) GLTF ফরম্যাটে এক্সপোর্ট করতে সাহায্য করবে।

১. GLTF এক্সপোর্টার স্ক্রিপ্ট যুক্ত করা

প্রথমেই, আপনাকে GLTF এক্সপোর্টার স্ক্রিপ্টটি আপনার HTML ফাইলে যুক্ত করতে হবে। এটি BabylonJS এর আলাদা একটি লাইব্রেরি, যা আপনাকে GLTF ফাইল এক্সপোর্ট করতে সাহায্য করে।

<script src="https://cdn.babylonjs.com/babylon.js"></script>
<script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>

babylonjs.loaders.min.js স্ক্রিপ্টটি GLTF ফরম্যাট এক্সপোর্ট করার জন্য প্রয়োজন।

২. 3D মডেল তৈরি করা এবং এক্সপোর্ট করা

এখন একটি সিম্পল 3D মডেল (যেমন একটি বক্স) তৈরি করে GLTF ফরম্যাটে এক্সপোর্ট করতে হবে।

উদাহরণ:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BabylonJS 3D Model Export</title>
    <script src="https://cdn.babylonjs.com/babylon.js"></script>
    <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.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;

        // একটি বক্স তৈরি করা
        var box = BABYLON.MeshBuilder.CreateBox("box", {size: 2}, scene);

        // GLTF এক্সপোর্ট ফাংশন
        function exportGLTF() {
            BABYLON.GLTF2Export.GLBAsync(scene, "model.glb").then(function (glb) {
                glb.downloadFiles(); // GLB ফাইলটি ডাউনলোড করবে
            });
        }

        // এক্সপোর্ট বাটন যুক্ত করা
        var button = document.createElement("button");
        button.innerHTML = "Export GLTF Model";
        button.onclick = exportGLTF;
        document.body.appendChild(button);

        // দৃশ্য রেন্ডার করা
        engine.runRenderLoop(function () {
            scene.render();
        });

        window.addEventListener("resize", function () {
            engine.resize();
        });
    </script>
</body>
</html>

কোড ব্যাখ্যা:

1. GLTF এক্সপোর্ট ফাংশন: BABYLON.GLTF2Export.GLBAsync(scene, "model.glb") ফাংশনটি পুরো দৃশ্যটিকে GLTF (বা GLB) ফরম্যাটে এক্সপোর্ট করে। এখানে "model.glb" ফাইলের নাম।
2. ডাউনলোড ফাংশন: glb.downloadFiles() ব্যবহার করা হয়েছে যাতে এক্সপোর্ট করা GLB ফাইলটি স্বয়ংক্রিয়ভাবে ডাউনলোড হতে পারে।
3. এক্সপোর্ট বাটন: HTML এ একটি বাটন তৈরি করা হয়েছে, যাতে ব্যবহারকারী ক্লিক করলে মডেলটি এক্সপোর্ট করা হবে।
4. ডাউনলোড: এক্সপোর্ট সম্পন্ন হওয়ার পর, ব্যবহারকারী স্বয়ংক্রিয়ভাবে মডেলটি ডাউনলোড করতে পারবেন।

৩. GLTF ফরম্যাট এবং GLB ফরম্যাট

GLTF:

• GLTF (GL Transmission Format) একটি JSON ভিত্তিক ফরম্যাট যা 3D মডেল এবং অ্যাসেটগুলো সংরক্ষণ করতে ব্যবহৃত হয়।
• এটি একটি ওপেন স্ট্যান্ডার্ড এবং দ্রুত ওয়েব লোডিংয়ের জন্য ডিজাইন করা হয়েছে।
• GLTF ফাইলগুলো বেশিরভাগ সময় আলাদা আলাদা টেক্সচার, শেডার, এবং জিওমেট্রি ফাইল হিসেবে থাকে।

GLB:

• GLB হল GLTF ফরম্যাটের বাইনারি সংস্করণ।
• এটি সব কিছু এক ফাইলে সংরক্ষণ করে, যেমন টেক্সচার, মেটাডেটা, 3D মডেল ইত্যাদি, যা কমপ্যাক্ট এবং দ্রুত লোড হয়।

৪. GLTF ফাইলের বিশেষত্ব

GLTF ফরম্যাটে 3D মডেল এক্সপোর্ট করার কিছু গুরুত্বপূর্ণ সুবিধা:

• ফাস্ট লোডিং: GLTF ফাইলগুলি ওয়েবের জন্য অপ্টিমাইজড এবং দ্রুত লোড হয়।
• ক্রস-প্ল্যাটফর্ম: GLTF ফাইলটি বিভিন্ন 3D ইঞ্জিন (যেমন, BabylonJS, Three.js, Unity, Unreal) এবং সফটওয়্যারে সমর্থিত।
• টেক্সচার এবং শেডার সমর্থন: এটি টেক্সচার, শেডার, এবং অ্যানিমেশন সমর্থন করে।
• ইন্টারঅ্যাকটিভ: GLTF মডেলগুলো ইন্টারঅ্যাকটিভ ওয়েব অ্যাপ্লিকেশনে সহজেই ব্যবহৃত হতে পারে।

৫. Blender থেকে GLTF এক্সপোর্ট

আপনি যদি Blender থেকে মডেল তৈরি করে BabylonJS-এ ব্যবহার করতে চান, তবে GLTF ফরম্যাটে এক্সপোর্ট করা সবচেয়ে সহজ পদ্ধতি।

Blender থেকে GLTF এক্সপোর্ট করতে:

1. Blender এর Export মেনু থেকে GLTF 2.0 নির্বাচন করুন।
2. এক্সপোর্টের সময় Animation, Textures, এবং Materials চেক করে নিন, যাতে আপনার মডেল ঠিকভাবে এক্সপোর্ট হয়।
3. এক্সপোর্ট করা ফাইলটি BabylonJS এ ইম্পোর্ট করতে পারেন।

সারাংশ

BabylonJS আপনাকে সহজেই 3D মডেল GLTF বা GLB ফরম্যাটে এক্সপোর্ট করার সুযোগ দেয়, যা ওয়েব ভিত্তিক অ্যাপ্লিকেশন এবং অন্যান্য 3D সফটওয়্যারগুলির সাথে সামঞ্জস্যপূর্ণ। আপনি BABYLON.GLTF2Export.GLBAsync ফাংশনের মাধ্যমে আপনার 3D দৃশ্য GLTF/GLB ফরম্যাটে এক্সপোর্ট করতে পারেন এবং স্বয়ংক্রিয়ভাবে ডাউনলোড করতে পারেন। এই প্রক্রিয়া অনেক সুবিধা প্রদান করে, যেমন দ্রুত ওয়েব লোডিং, টেক্সচার এবং শেডার সমর্থন, এবং ক্রস-প্ল্যাটফর্ম ক্ষমতা।

BabylonJS দিয়ে 3D মডেল ইমপোর্ট এবং এক্সপোর্ট করা একটি অত্যন্ত গুরুত্বপূর্ণ কাজ, কারণ এটি গেম এবং সিমুলেশনগুলির বাস্তবসম্মততা বৃদ্ধি করতে সাহায্য করে। বিভিন্ন 3D মডেলিং টুল (যেমন, Blender) থেকে 3D মডেল এক্সপোর্ট করা সহজভাবে BabylonJS-এ ব্যবহারযোগ্য করা যায়। Blender-কে একটি জনপ্রিয় 3D মডেলিং সফটওয়্যার হিসেবে ব্যবহার করে এই প্রক্রিয়াটি সহজ করা হয়।

এই টিউটোরিয়ালে, আমরা Blender থেকে একটি 3D মডেল এক্সপোর্ট করে সেটি BabylonJS-এ ইমপোর্ট করার পদ্ধতি দেখবো।

১. Blender থেকে 3D মডেল এক্সপোর্ট করা

Blender ব্যবহার করে 3D মডেল তৈরি করা হলে, সেই মডেলটি BabylonJS-এ সহজে ব্যবহারের জন্য এক্সপোর্ট করতে হবে। Blender থেকে BabylonJS-এ সরাসরি এক্সপোর্ট করার জন্য BabylonJS এর নিজস্ব এক্সপোর্ট প্লাগিন ব্যবহার করা হয়।

Blender থেকে BabylonJS এক্সপোর্ট প্লাগিন ইনস্টল করা

1. Blender খুলুন এবং Edit > Preferences > Add-ons এ যান।
2. Install বাটনে ক্লিক করুন এবং নিচের লিঙ্ক থেকে BabylonJS এক্সপোর্টার প্লাগিন ডাউনলোড করুন:
   • BabylonJS Exporter for Blender
3. প্লাগিনটি ইনস্টল করার পর File > Export > Export to Babylon অপশনটি দেখা যাবে।

৩ডি মডেল এক্সপোর্ট করার প্রক্রিয়া

1. Blender-এ আপনার মডেল তৈরি করুন এবং সঠিকভাবে সেটআপ করুন।
2. এক্সপোর্ট করার আগে নিশ্চিত হয়ে নিন যে সমস্ত প্রয়োজনীয় টেক্সচার, ম্যাটেরিয়াল এবং লাইটিং ঠিকভাবে কাজ করছে।
3. File > Export > Export to Babylon (.babylon) নির্বাচন করুন।
4. Export Settings মেনুতে, আপনি মডেলটির বিভিন্ন বৈশিষ্ট্য যেমন scale, animation, texture সহ অন্যান্য ফিচার কনফিগার করতে পারেন।
5. তারপর, এক্সপোর্ট বাটনে ক্লিক করুন। এটি আপনার 3D মডেলটিকে .babylon ফাইল ফরম্যাটে এক্সপোর্ট করবে, যা BabylonJS-এ ব্যবহৃত হবে।

২. BabylonJS-এ 3D মডেল ইমপোর্ট করা

Blender থেকে .babylon ফাইল এক্সপোর্ট করার পর, আপনি BabylonJS-এ এটি ইমপোর্ট করতে পারবেন।

১. .babylon ফাইল লোড করা

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BabylonJS - Import Blender Model</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);

        // Blender থেকে এক্সপোর্ট করা 3D মডেল লোড করা
        BABYLON.SceneLoader.Append("path/to/your/model/", "your_model.babylon", scene, function () {
            scene.createDefaultCameraOrLight(true, true, true);
            scene.createDefaultEnvironment();
        });

        engine.runRenderLoop(function () {
            scene.render();
        });

        window.addEventListener("resize", function () {
            engine.resize();
        });
    </script>
</body>
</html>

কোড ব্যাখ্যা:

• BABYLON.SceneLoader.Append: এই ফাংশনটি .babylon ফাইল লোড করে এবং সেই মডেলটি দৃশ্যে অ্যাড করে।
• path/to/your/model/: এখানে আপনার মডেলের ফাইলের সঠিক পাথ উল্লেখ করতে হবে। your_model.babylon হচ্ছে সেই ফাইলের নাম।

৩. অন্য 3D টুল থেকে এক্সপোর্ট করা

Blender ছাড়াও, আপনি অন্যান্য 3D মডেলিং টুল যেমন 3ds Max, Maya, Cinema 4D ইত্যাদির মাধ্যমে 3D মডেল তৈরি করে BabylonJS-এ এক্সপোর্ট করতে পারেন। তবে, এই সফটওয়্যারগুলির জন্যও কিছু এক্সপোর্ট প্লাগিন এবং ফাইল ফরম্যাটে কনভার্সন প্রক্রিয়া অনুসরণ করতে হবে।

১. 3ds Max থেকে এক্সপোর্ট

1. 3ds Max এ BabylonJS এক্সপোর্টার প্লাগিন ইনস্টল করুন।
2. আপনার মডেল তৈরি করুন এবং Export > Export Selected নির্বাচন করুন।
3. BabylonJS ফাইল ফরম্যাটে এক্সপোর্ট করুন।

২. Maya থেকে এক্সপোর্ট

1. Maya থেকে BabylonJS মডেল এক্সপোর্টের জন্য Maya2Babylon নামক এক্সটেনশন ব্যবহার করুন।
2. মডেলটি .babylon ফরম্যাটে এক্সপোর্ট করুন এবং তা BabylonJS-এ ইমপোর্ট করুন।

৪. ফাইল ফরম্যাট সমর্থন

BabylonJS-এ 3D মডেল ইমপোর্ট করার জন্য বিভিন্ন ফাইল ফরম্যাট সমর্থিত। সবচেয়ে বেশি ব্যবহৃত ফরম্যাটগুলো হল:

• .babylon: BabylonJS-এর নিজস্ব ফরম্যাট। এটি মডেল, টেক্সচার, অ্যানিমেশন, এবং অন্যান্য বৈশিষ্ট্য ধরে রাখে।
• .obj: সাধারণত 3D মডেল ফরম্যাট হিসেবে ব্যবহৃত হয়, কিন্তু এটি morph targets বা animations ধারণ করতে পারে না।
• .gltf/.glb: JSON-ভিত্তিক ফাইল ফরম্যাট যা আধুনিক 3D ফাইল ব্যবস্থাপনার জন্য ব্যবহৃত হয়।

সারাংশ

• Blender থেকে এক্সপোর্ট: Blender থেকে .babylon ফরম্যাটে এক্সপোর্ট করা সহজ এবং BabylonJS এ ইমপোর্ট করা যায়। এর জন্য আপনাকে Blender-এ BabylonJS Exporter ইনস্টল করতে হবে।
• ইমপোর্ট: .babylon ফাইলগুলি BABYLON.SceneLoader.Append ব্যবহার করে ইমপোর্ট করা যায়।
• অন্যান্য টুল থেকে এক্সপোর্ট: 3ds Max এবং Maya থেকেও আপনি BabylonJS-এ 3D মডেল এক্সপোর্ট করতে পারেন, তবে সেগুলোর জন্য আলাদা এক্সপোর্ট প্লাগিন এবং ফরম্যাট থাকতে পারে।

এই প্রক্রিয়া অনুসরণ করে, আপনি সহজেই Blender বা অন্যান্য 3D টুল থেকে আপনার মডেল এক্সপোর্ট করে BabylonJS-এ ব্যবহার করতে পারবেন।