three.js場景中看不到模型/看不到陰影

參考文章： 火辣辣前端博客

1、three.js渲染的場景中看不到模型的幾種可能：

 一、未渲染 

你可能並未加載渲染函數，或者未將場景渲染出來，雖然這個可能性很小很小，但初期我真的犯過…… 

 

function animate() {
	requestAnimationFrame(animate);
        renderer.render(scene, camera);
} 複製代碼

二、場景中未加燈光 未加燈光還有可能形成看不到模型的貼圖，即你看到的是一個漆黑的物體

 三、模型和相機的位置不對 相機類型分爲好幾種，具體類型能夠看three.js的官網。當你的模型加載位置不在相機的可視區域內，你是看不到模型的。

 四、模型的大小不合適，可能過大或者太小 模型過大，可能會致使相機在模型體內，太小會致使看不到。建議在初期創建場景的時候，都調用control的插件，方便縮放和移動，能夠多方面觀察 

 2、場景中物體沒有陰影

 1 燈光類型不對 產生陰影的： 

THREE.DirectionLight() 平型光 
THREE.PointLight() 點光源 
THREE.SpotLight() 聚光燈複製代碼

 不產生陰影的： 

THREE.AmbientLight() 環境光 
THREE.HemiphereLight() 半球光
 THREE.RectAreaLight() 平面光源 複製代碼

2 方向不對 添加光輔助helper 

3 場景或者模型沒有開啓接收陰影參數 

首先，咱們須要在初始化時，告訴渲染器渲染陰影：renderer.shadowMap.enabled = true;

 而後，對於光源以及全部要產生陰影的物體調用：mesh.castShadow = true; 

最後，對於接收陰影的物體調用：ground.receiveShadow = true;