摘要:而針對投影方式的不同,照相機又分為正交投影照相機與透視投影照相機。我們需要為自己的程序選擇合適的照相機。相機視椎體右面。
相機API
照相機就是這樣一個抽象,它定義了三維空間到二維屏幕的投影方式,用“照相機”這樣一個類比,可以使我們直觀地理解這一投影方式。
而針對投影方式的不同,照相機又分為正交投影照相機與透視投影照相機。我們需要為自己的程序選擇合適的照相機。
THREE.OrthographicCamera(left, right, top, bottom, near, far)
left: 相機視椎體(Camera frustum)左面。
right: 相機視椎體(Camera frustum)右面。
top: 相機視椎體(Camera frustum)上面。
bottom:相機視椎體(Camera frustum)下面。
near: 相機視椎體(Camera frustum)前面(靠近相機的這一面)。
far: 相機視椎體(Camera frustum)后面(遠離相機的這一面)。
設置照相機var camera = new THREE.OrthographicCamera(-2, 2, 1.5, -1.5, 1, 10); camera.position.set(0, 0, 5); scene.add(camera);相機位置
camera.position.set(2, -2, 5);相機朝向
鏡頭默認的方向是朝著z軸的負方向
camera.lookAt(new THREE.Vector3(0,0,0));
lookAt函數接受的是一個THREE.Vector3的實例,因此千萬別寫成camera.lookAt(0, 0, 0),否則非但不能得到理想的效果,而且不會報錯,使你很難找到問題所在。
相機快門方向相機快門默認向上,以相機自身為中心畫坐標軸(本地坐標軸)默認為(0,0,0);
camera.up.z= 1; camera.up.x =1; camera.up.y =-1;更新相機投影矩陣
camera.fov = fov; camera.updateProjectionMatrix();
更新相機投影矩陣,必須在參數發生變化后調用。
透視投影照相機THREE.PerspectiveCamera(fov, aspect, near, far)
視角fov:這個最難理解,我的理解是,眼睛睜開的角度,即,視角的大小,如果設置為0,相當你閉上眼睛了,所以什么也看不到,如果為180,那么可以認為你的視界很廣闊,但是在180度的時候,往往物體很小,因為他在你的整個可視區域中的比例變小了。
近平面near:這個呢,表示你近處的裁面的距離。補充一下,也可以認為是眼睛距離近處的距離,假設為10米遠,請不要設置為負值,Three.js就傻了,不知道怎么算了,
遠平面far:這個呢,表示你遠處的裁面,
4、縱橫比aspect:實際窗口的縱橫比,即寬度除以高度。這個值越大,說明你寬度越大,那么你可能看的是寬銀幕電影了,如果這個值小于1,則為豎屏。
設置照相機var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 1, 1000);
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/94017.html
摘要:和使用的坐標系是右手坐標系。與都是指到照相機位置在深度平面的位置,而照相機不應該拍攝到其后方的物體,因此這兩個值應該均為正值。 Three.js是一個3D JavaScript庫。Three.js封裝了底層的圖形接口,使得程序員能夠在無需掌握繁冗的圖形學知識的情況下,也能用簡單的代碼實現三維場景的渲染。 一個典型的Three.js程序至少要包括渲染器(Renderer)、場景(Sc...
摘要:學習筆記使用粒子系統模擬時空隧道本例的運行結果如圖時空隧道演示地址的粒子系統的粒子系統主要是依靠精靈體來創建的,要實現中的粒子系統創建,一般有兩種方式。 WebGL three.js學習筆記 使用粒子系統模擬時空隧道 本例的運行結果如圖:showImg(https://img-blog.csdnimg.cn/20190426222855492.png?x-oss-process=ima...
摘要:對象是所有不同對象的容器,也就是說該對象保存所有物體光源攝像機以及渲染所需的其他對象。對象又是被稱為場景圖,它不僅僅是一個對象數組,還包含了整個場景圖樹形結構中的所有節點每個添加到場景的對象,甚至包括本身都是繼承自一個名為的對象。 THREE.Scene THREE.Scene 對象是所有不同對象的容器,也就是說該對象保存所有物體、光源、攝像機以及渲染所需的其他對象。 THREE.S...
閱讀 2241·2021-11-24 11:15
閱讀 3091·2021-11-24 10:46
閱讀 1389·2021-11-24 09:39
閱讀 3927·2021-08-18 10:21
閱讀 1484·2019-08-30 15:53
閱讀 1400·2019-08-30 11:19
閱讀 3327·2019-08-29 18:42
閱讀 2326·2019-08-29 16:58