Three.js مجموعه‌ای از اشکال هندسی آماده داره که بهشون می‌گیم Primitives.
این اشکال رو می‌تونی به راحتی بسازی و به صحنه اضافه کنی.

۱️⃣ BoxGeometry (جعبه)

🔹 تعریف

• مکعب یا مستطیل سه‌بعدی

• رایج‌ترین شکل هندسی

🔹 ایجاد Box

const geometry = new THREE.BoxGeometry(2, 2, 2); // width, height, depth
const material = new THREE.MeshStandardMaterial({ color: 0x00ff00 });
const cube = new THREE.Mesh(geometry, material);
scene.add(cube);

۲️⃣ SphereGeometry (کره)

🔹 تعریف

• اشکال کروی

• مناسب توپ، سیاره، کره‌های نور

🔹 ایجاد Sphere

const geometry = new THREE.SphereGeometry(1, 32, 32); // radius, widthSegments, heightSegments
const material = new THREE.MeshStandardMaterial({ color: 0xff0000 });
const sphere = new THREE.Mesh(geometry, material);
scene.add(sphere);

📌 هرچه تعداد segments بیشتر باشه، کره صاف‌تر دیده می‌شود

۳️⃣ PlaneGeometry (صفحه)

🔹 تعریف

• یک سطح دوبعدی، شبیه زمین یا صفحه نمایش

• می‌تواند برای Floor یا دیوار استفاده شود

🔹 ایجاد Plane

const geometry = new THREE.PlaneGeometry(10, 10); // width, height
const material = new THREE.MeshStandardMaterial({ color: 0xaaaaaa, side: THREE.DoubleSide });
const plane = new THREE.Mesh(geometry, material);
scene.add(plane);

📌 DoubleSide باعث می‌شود هر دو طرف صفحه دیده شود

۴️⃣ CylinderGeometry (سیلندر)

🔹 تعریف

• سیلندر، مخروط یا استوانه توخالی

• مناسب ستون، شمع یا لوله

🔹 ایجاد Cylinder

const geometry = new THREE.CylinderGeometry(1, 1, 3, 32); // radiusTop, radiusBottom, height, radialSegments
const material = new THREE.MeshStandardMaterial({ color: 0x0000ff });
const cylinder = new THREE.Mesh(geometry, material);
scene.add(cylinder);

۵️⃣ ConeGeometry (مخروط)

🔹 تعریف

• مخروط یا کاج

• مشابه Cylinder با نوک تیز

🔹 ایجاد Cone

const geometry = new THREE.ConeGeometry(1, 3, 32); // radius, height, radialSegments
const material = new THREE.MeshStandardMaterial({ color: 0xffff00 });
const cone = new THREE.Mesh(geometry, material);
scene.add(cone);

۶️⃣ TorusGeometry (حلقه / دونات)

🔹 تعریف

• شکل حلقه‌ای یا دونات

• مناسب رینگ، تایر یا اشکال دکوراتیو

🔹 ایجاد Torus

const geometry = new THREE.TorusGeometry(2, 0.5, 16, 100); // radius, tube, radialSegments, tubularSegments
const material = new THREE.MeshStandardMaterial({ color: 0xff00ff });
const torus = new THREE.Mesh(geometry, material);
scene.add(torus);

۷️⃣ TetrahedronGeometry / OctahedronGeometry / DodecahedronGeometry / IcosahedronGeometry

🔹 تعریف

• اشکال چندوجهی آماده

• مناسب هندسه‌های پیچیده یا بازی‌های فانتزی

🔹 مثال

const geometry = new THREE.TetrahedronGeometry(1); // radius
const material = new THREE.MeshStandardMaterial({ color: 0x00ffff });
const tetra = new THREE.Mesh(geometry, material);
scene.add(tetra);

۸️⃣ نکات مهم

• همه Primitives با Mesh ساخته می‌شوند:

const mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);

• می‌توان با position, rotation, scale آنها را تغییر داد:

cube.position.set(0, 1, 0);
sphere.scale.set(1.5, 1.5, 1.5);

• بیشتر متریال‌ها مثل MeshStandardMaterial، MeshPhongMaterial و MeshLambertMaterial با نور کار می‌کنند

۹️⃣ مثال کامل

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
camera.position.z = 10;

const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// جعبه
const cube = new THREE.Mesh(
  new THREE.BoxGeometry(2,2,2),
  new THREE.MeshStandardMaterial({ color: 0x00ff00 })
);
cube.position.x = -4;
scene.add(cube);

// کره
const sphere = new THREE.Mesh(
  new THREE.SphereGeometry(1,32,32),
  new THREE.MeshStandardMaterial({ color: 0xff0000 })
);
sphere.position.x = 0;
scene.add(sphere);

// صفحه
const plane = new THREE.Mesh(
  new THREE.PlaneGeometry(20,20),
  new THREE.MeshStandardMaterial({ color: 0xaaaaaa, side: THREE.DoubleSide })
);
plane.rotation.x = -Math.PI/2;
plane.position.y = -2;
scene.add(plane);

// نور
const light = new THREE.DirectionalLight(0xffffff, 1);
light.position.set(5,10,5);
scene.add(light);

// حلقه
const torus = new THREE.Mesh(
  new THREE.TorusGeometry(2,0.5,16,100),
  new THREE.MeshStandardMaterial({ color: 0xff00ff })
);
torus.position.x = 4;
scene.add(torus);

function animate() {
  requestAnimationFrame(animate);
  cube.rotation.x += 0.01;
  cube.rotation.y += 0.01;
  sphere.rotation.y += 0.01;
  torus.rotation.x += 0.01;
  torus.rotation.y += 0.01;
  renderer.render(scene, camera);
}
animate();

📌 در این مثال، چند شکل هندسی ساده در یک صحنه با نور و چرخش نمایش داده شدند.