03-Three.js 場景對瀏覽器的自適應(yīng)

透視投影相機(jī)PerspectiveCamera自適應(yīng)渲染

window.addEventListener('resize', onResize, false);
function onResize() {
    // 重置渲染器輸出畫布canvas尺寸
    renderer.setSize(window.innerWidth, window.innerHeight);
    // 通常是使用畫布的寬/畫布的高。默認(rèn)值是1
    camera.aspect = window.innerWidth / window.innerHeight;
    // 更新攝像機(jī)投影
    camera.updateProjectionMatrix();
}

正投影相機(jī)OrthographicCamera自適應(yīng)渲染

window.addEventListener('resize', onResize, false);
function onResize() {
   // 三維場景顯示范圍控制系數(shù),系數(shù)越大,顯示的范圍越大
   var s = 200; 
   // 重置渲染器輸出畫布canvas尺寸
   renderer.setSize(window.innerWidth,window.innerHeight);
   // 重置相機(jī)投影的相關(guān)參數(shù)
   k = window.innerWidth/window.innerHeight;//窗口寬高比
  camera.left = -s*k;
  camera.right = s*k;
  camera.top = s;
  camera.bottom = -s;
  // 更新攝像機(jī)投影
  camera.updateProjectionMatrix ();
};
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容