Three.js · Difüz aydınlanma
MeshLambertMaterial: mat ve yumuşak aydınlanma
Specular yok — ışık her yöne yayılır
Bir nesne neden bazen “tebeşir” veya “kağıt” gibi görünür? Işık yüzeye çarpar ancak tek bir yöne
geri sekmez; yüzeyin her yerine eşitçe dağılarak yayılır. Bu davranış
MeshLambertMaterial'in özüdür. Keskin parlamalar değil, yumuşak ve mat bir
aydınlanma istiyorsanız Lambert en verimli seçeneklerden biridir.
Bu modelde parlak “sıçrama” yoktur; yüzeyin mat karakteri, ışığın yönüne göre
yumuşar veya koyulaşır — yani nesne nihayet sahne aydınlığına tepki vermeye
başlar.
Önkoşul: MeshBasicMaterial (ışıksız referans); bu sayfada dizideki ilk mat ışıklı adım. Keskin parlama gerekiyorsa MeshPhongMaterial. Kavramsal çerçeve: Materyal giriş. Üçlü özet tablo: Basic vs. Lambert vs. Phong. Sayfa sonunda özet ve komşu ders bağlantıları.
Nasıl düşünmelisin?
Basit denklem
- Diffuse (dağılan)
- Işık her yöne eşit dağılır; yumuşak gölgeler oluşturur.
- Specular (sıçrayan)
- Bu materyalde yoktur.
Lambert’i “fiziksel olarak eksik” diye okumak yerine tasarım sözleşmesi gibi düşünün: “Bu yüzey parlama üretmeyecek; ışık yalnızca difüz dağılım ve emissive ile okunacak.” Bu sözleşme, mobilde veya çok nesneli sahnelerde GPU bütçesini korur; izleyici ise hâlâ nesnenin hangi yüzünün ışığa döndüğünü anlar.
Çalışma mantığı: vertex ışığı ve interpolasyon
Lambert, maliyeti düşürmek için aydınlanmayı vertex (köşe) seviyesinde hesaplar.
Three.js’in güncel uygulamasında ayrıntılar sürüme göre değişebilir; önemli olan, Lambert’in Phong / Standard ailesine göre daha hafif bir ışık yoluna oturması ve özellikle düşük frekanslı (yumuşak) ton geçişlerinde “okunabilir matlık” vermesidir. Yüksek frekanslı parlama veya metalik–dielektrik ayrımı arıyorsanız bu sayfa doğru katman değildir.
Pratikte Lambert, “ışık var ama nesne plastik gibi parlamasın” dediğiniz her yerde devreye girer: arka plan geometrileri, oyun içi dünya blokları, eğitim sahneleri veya stilize illüstrasyon tarzı üç boyutlu dünyalar için.
- Gouraud shading sezgisi: Işık köşelerde hesaplanır; yüzey ortasına doğru renkler interpolasyonla taşınır.
- Pragmatik yaklaşım: Amaç kusursuz fiziksel gerçeklik değil; hızlı, mat, okunaklı görüntüdür.
Vertex başına hesaplanan ton, üçgen içinde interpolasyon ile taşındığından çok ince detay (ince çizgi, keskin oyuk) bazen “yıkanmış” görünebilir; bu bir hata değil, maliyet–kalite takasıdır. İhtiyaç duyduğunuzda geometriyi sıklaştırır veya piksel başına daha zengin model isteyen bir sonraki materyal sınıfına geçersiniz.
Ne kontrol edebilirsin?
Üç ana bileşen
- Color: Yüzeyin ışık altındaki ana rengi.
- Emissive: Materyalin içten yaydığı ışık; sahnede az ışık olsa bile formun görünmesine yardım eder.
- Map: 2D doku; ışıkla birleşince mat bir baskı hissi verir.
emissive ve map birlikte kullanıldığında, emissive çoğu zaman
“formu kaybetmeyelim” katmanı, map ise “yüzey desenini ışık altında okuyalım” katmanıdır.
Renk ve dokuların renk uzayında tutarlı olması (ör. doku ve
color aynı dilde) beklenmedik doygunluk veya solukluk farklarını azaltır.
Neden bazen “düz” (flat) görünür?
Düşük segment
Yeni başlayanlar bazen Lambert ile objenin “blok blok” göründüğünden şikâyet eder.
Neden: Işık vertex seviyesinde hesaplandığından, geometri düşük poligonlu veya düşük segmentliyse geçişler yumuşamak yerine köşeli görünür.
Çözüm: Segment sayısını artırmak veya piksel tabanlı (ör. MeshPhongMaterial) materyallere geçmek.
Bu bölümdeki “blokluluk” şikâyeti çoğu zaman materyal kalitesinden çok mesh çözünürlüğü ile ilgilidir: aynı Lambert materyali, yüksek segmentli bir kürede pürüzsüz, düşük segmentli bir silindirde ise yüz yüze geçişlerde kırıklı görünür. Tasarım kararını verirken “bir sonraki seviye Phong mu, yoksa geometriyi mi sıklaştırayım?” sorusunu yan yana tutmak işe yarar.
İnteraktif: “Mat Dünya”
Aşağıdaki sahnede Lambert küre ile aynı renk paletinde tutulan
Basic referansları yan yana durur; intensity
kaydırıldığında yalnızca Lambert ve gölge ilişkisi belirginleşir — Basic yüzeyler poster
gibi kalır. Açıklayıcı metin figür altındaki özetle birlikte okunmalı; ölçüler
demo sabitleri
tablosunda diagram-lambert-material.js ile eşlenir.
Sol büyük küre Lambert (eğri yüzey): tek DirectionalLight
yandan gelince gölge daha uzun okunur; yüzeyde mat ton geçişi; specular
yok.
Soldaki turuncu küp Basic: düz yüzeyler bile olsa her yüzey aynı “poster”
tonunda — ışık yönü yüzeyde gradyan oluşturmaz. Sağdaki küçük küre yine aynı renkte
Basic (hafif emissive ile referansı görsel olarak ayırır). Intensity’yi
düşürüp yükselt: Lambert tepki verir, Basic nesneler yüzey açısından “donuk” kalır.
Demo sabitleri tablosu (Mat Dünya)
initLambertDemo · Lambert ana küre, zemin düzlemi, Basic referans küre ve
Basic kutu; tek yönlü ışık ile gölge.
| Sahne / rol | Parametre | Değer | Tür |
|---|---|---|---|
| Renderer | WebGLRenderer |
antialias: true · alpha: false ·
powerPreference: high-performance ·
setPixelRatio(min(dpr, 2)) · SRGBColorSpace · arka
plan
0x05060c · gölge PCFSoftShadowMap
|
🔒 Sabit |
| Izgara | GridHelper |
boyut 14 · bölüm 28 · renkler
0x3a4a6a / 0x1a2030 · y = -0.52
|
🔒 Sabit |
| Zemin | MeshLambertMaterial / PlaneGeometry |
16×16 · renk 0x0f1422 · receiveShadow ·
rotation.x = -π/2 · y = -0.52
|
🔒 Sabit |
| Ana küre | MeshLambertMaterial |
color 0x5ec8ff · emissive 0x06111a ·
emissiveIntensity 0.06 · SphereGeometry(1, 18, 18) ·
konum (-0.35, 0.62, 0) · castShadow
|
🔒 Sabit |
| Basic referans küre | MeshBasicMaterial |
color 0x5ec8ff · emissive 0x06182a ·
emissiveIntensity 0.12 · yarıçap 0.38 · segment
18 · konum (1.78, 0.62, 0.48) · gölge yok
|
🔒 Sabit |
| Basic kutu | MeshBasicMaterial |
BoxGeometry(0.85, 0.85, 0.85) · renk 0xf0a868 · konum
(-1.82, 0.42, -0.62) · rotation.y 0.28 ·
castShadow / receiveShadow
|
🔒 Sabit |
| Ortam ışığı | AmbientLight |
0xffffff · 0.08 |
🔒 Sabit |
| Yönlü ışık | DirectionalLight |
başlangıç 1.05 · UI 0…3 · konum
(5.8, 2.35, 1.15) · castShadow · harita
1024² · bias -0.00025 · normalBias 0.02 ·
gölge kamera ±4.75 · near 0.6 · far 18
|
🔒 + ↔ UI |
| Kamera | PerspectiveCamera |
FOV 42 · yakın/uzak 0.06 / 80 · konum
(0.55, 1.35, 5.35) · lookAt(0.15, 0.55, 0)
|
🔒 Sabit |
| OrbitControls | damping / mesafe | enableDamping · 0.06 · hedef
(0.15, 0.55, 0) · mesafe 2.4…14
|
🔒 Sabit |
| HTML başlangıç | Light intensity |
aralık 0…3 · adım 0.01 · varsayılan 1.05
|
🔒 + ↔ UI |
Önemli kod kesiti
Kaydırıcı yalnızca yönlü ışığın intensity değerini sınırlar; Lambert küre ve
zemin buna tepki verir, Basic nesneler aynı renkte kalır.
function apply() {
const v = intensity ? Number(intensity.value) : 1.05;
dir.intensity = Math.max(0, Math.min(3, v));
if (readout) {
readout.textContent = `Intensity ${dir.intensity.toFixed(
2
)}: Lambert küre + zemin gölgesi değişir; Basic küre (aynı renk) sabit; Basic kutu yüzeylerde gradyan yok.`;
}
}Yaygın hata: “Lambert düşük kalitedir” yanılgısı
Basit ≠ kötü
Lambert bilinçli olarak sade bırakılmıştır. Binlerce ağaç veya uzak şehir binalarını PBR ile sürmek GPU'yu zorlar; Lambert ile sürmek performansı kurtarır. Lambert, bilinçli bir performans tercihidir.
Lambert’i “düşük kalite” sanmak, onu yanlış beklentiyle PBR veya Phong ile kıyaslamaktan kaynaklanır. Amaç farklıdır: gerçek zamanlı sahnede binlerce nesneyi aynı anda okutmak, uzaktaki varlıkları hafif tutmak veya estetik olarak yumuşak bir dünya kurmak. Bu hedeflerde Lambert bilinçli ve onurlu bir seçimdir.
Kullanım alanları: nerede tercih edilmeli?
Aşağıdaki liste “Lambert her yerde kullanılmalı” demez; öncelik sırası verir: önce sahne hedefi (FPS, stil, mesafe), sonra malzeme okuması. Lambert, özellikle gölge haritası açıkken bile maliyeti kontrol altında tutmak istediğiniz mid-range donanımlarda sık öne çıkar.
- Mobil web: GPU sınırlı cihazlarda yüksek FPS.
- LOD: Uzaktaki binalar, figürler, bitki örtüsü.
- Doğal mat yüzeyler: Tebeşir, kauçuk, ham tahta, kağıt.
- Stilize estetik: Parlaklığın dikkat dağıtmadığı yumuşak sahneler.
Tersine, cam yüzey, ıslak asfalt yansıması veya keskin rim light gibi efektler istiyorsanız Lambert yetersiz kalır — bu noktada Phong veya fizik tabanlı materyallere geçmek doğru “kalite” adımıdır.
Basic vs. Lambert vs. Phong
Tablo, üç sınıfı ışık tepkisi ve görsel karakter üzerinden kıyaslar; tek satırda “hangi soruya hangi cevap?” özetini tutmak içindir. HoloDepth akışında tipik sıra: önce Basic ile ışıksız referans, sonra bu sayfadaki Lambert ile mat aydınlanma, gerektiğinde Phong veya daha modern yüzeylerle detay katmanı.
Özet
Uygulama: verimli bir mat yüzey kurulumu
Aşağıdaki örnek, renk + hafif emissive ile “formun kaybolmamasını” sağlayan
minimal bir Lambert kurulumunu gösterir; ardından doku haritalı bir kutu örneği gelir.
Üretimde doku yollarını CDN veya paket içi statik varlıklarla yönetir, gerektiğinde
colorSpace ve sıkıştırma formatını (ör. Basis) ayrıca
ele alırsınız — bu sayfanın odağı kod şekli ve maliyet fikridir.
// Mat ve isiga duyarli materyal kurulumu
const lambertMaterial = new THREE.MeshLambertMaterial({
color: 0x156289,
emissive: 0x072534, // Hafif ic isik (ambient etkisi)
wireframe: false
});
// Doku (texture) kullanimi
const textureLoader = new THREE.TextureLoader();
const woodTexture = textureLoader.load('/textures/wood_diffuse.jpg');
const crate = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial({ map: woodTexture }));
scene.add(crate);Holodepth production içgörüsü
Orta katman, doğru seçim
Lambert, büyük sahnelerde güçlü orta katman çözümlerden biridir; çok nesnede performans ile okunabilirlik dengesini sağlar. Bir nesneyi parlatmanız gerekmiyorsa Lambert GPU için sık sık en mantıklı varsayılandır. Usta, her yerde en ağır materyali değil, en doğru materyali kullanmayı bilir.
Sahne büyüdükçe Lambert’i LOD veya mesafe ile eşleştirmek yaygın bir disiplindir: yakında PBR, uzakta Lambert + düşük çözünürlüklü gölge. Bu strateji, izleyicinin dikkatini odakta tutarken arka planda GPU’yu rahatlatır.