سایهها و نورهای دقیقتر
Three.js به صورت پیشفرض نور و سایه را ساده ارائه میدهد، اما با برخی تنظیمات میتوان سایههای دقیقتر و نورپردازی واقعیتر داشت.
۱️⃣ انواع نورها و تاثیر آنها بر سایهها
نور | توضیح | سایه |
---|---|---|
AmbientLight | نور عمومی صحنه، بدون جهت | ❌ |
DirectionalLight | شبیه نور خورشید | ✅ |
PointLight | نور نقطهای در همه جهات | ✅ |
SpotLight | نور مخروطی | ✅ |
HemisphereLight | شبیه آسمان و زمین | ❌ |
📌 نورهایی که سایه ایجاد میکنند باید castShadow = true داشته باشند.
۲️⃣ فعالسازی سایهها در Renderer
🔹 انواع ShadowMap
نوع | توضیح |
---|---|
THREE.BasicShadowMap | سریع، بدون نرمسازی |
THREE.PCFShadowMap | متوسط، کمی نرم |
THREE.PCFSoftShadowMap | نرم و واقعگرایانه |
۳️⃣ تنظیم سایه برای نور و اشیاء
🔹 تنظیمات دقیق نور Directional
📌 با افزایش mapSize
و تنظیم دقیق camera سایهها دقیقتر و با جزئیات بیشتر میشوند
۴️⃣ مثال کامل سایهها و نور دقیق
📌 این مثال شامل:
-
نور DirectionalLight با سایه
-
تنظیم دقیق ShadowMap
-
اشیاء سایهافکن و دریافتکننده سایه
۵️⃣ نکات مهم
-
AmbientLight سایه تولید نمیکند، باید با Directional یا SpotLight ترکیب شود
-
ShadowMap با رزولوشن بالاتر جزئیات دقیقتر میدهد، اما مصرف GPU بیشتر میشود
-
برای واقعگرایی، ترکیب چند نور، رنگ نور طبیعی و Shadow Bias ضروری است
-
Three.js قابلیت Soft Shadow و PCF برای جلوگیری از سایههای تیز و مصنوعی دارد