Three.js筆記(七)相機(jī)(1)

簡(jiǎn)述

在前面的章節(jié)中锌历,已經(jīng)使用PerspectiveCamera創(chuàng)建過(guò)相機(jī)希坚,但是文檔中還有其他類型的相機(jī)殴穴。

Camera相機(jī)

Camera類是抽象類柴钻,不能直接使用它淮韭,但可以繼承這個(gè)類,從而使用它的公共屬性和方法贴届。

ArrayCamera陣列相機(jī)

ArrayCamera陣列相機(jī)用于多個(gè)相機(jī)多次渲染場(chǎng)景靠粪。每個(gè)相機(jī)渲染畫布的特定區(qū)域蜡吧,就像是老式分屏游戲,多個(gè)人共享一個(gè)屏幕占键。

StereoCamera立體相機(jī)

StereoCamera立體相機(jī)用于演示VR效果昔善。

CubeCamera立方體相機(jī)

CubeCamera立方體相機(jī)用來(lái)獲取各個(gè)方向上的渲染結(jié)果,僅限于前后左右上下這六個(gè)方向畔乙【停可以使用這個(gè)相機(jī)來(lái)創(chuàng)建環(huán)境貼圖和陰影。

OrthographicCamera正交相機(jī)

OrthographicCamera正交相機(jī)用于進(jìn)行無(wú)透視的正交渲染牲距,常用于各種RTS游戲返咱。元素在屏幕上的大小與離相機(jī)的距離無(wú)關(guān)。

PerspectiveCamera透視相機(jī)

PerspectiveCamera透視相機(jī)就是常用的相機(jī)牍鞠。

PerspectiveCamera透視相機(jī)和OrthographicCamera正交相機(jī)是最常用的咖摹。

PerspectiveCamera透視相機(jī)

PerspectiveCamera透視相機(jī)實(shí)例化時(shí),需要傳入?yún)?shù)难述,但之前并沒有傳入所有的參數(shù)萤晴。

const camera = new THREE.PerspectiveCamera(75, sizes.width / sizes.height, 1, 100)

視場(chǎng)角

第一個(gè)參數(shù)是視場(chǎng)角,即相機(jī)視圖的豎直方向的角度胁后。如果這個(gè)角度小店读,會(huì)得到望遠(yuǎn)鏡的效果;這個(gè)角度大择同,會(huì)得到魚眼鏡的效果两入。因?yàn)橄鄼C(jī)視角內(nèi)的東西將會(huì)壓縮在畫布尺寸大小。

一般取值45~75度敲才。

長(zhǎng)寬比

第二個(gè)參數(shù)是長(zhǎng)寬比裹纳,為寬度比高度〗粑洌可以簡(jiǎn)單的理解為寬度和高度剃氧。

近點(diǎn)和遠(yuǎn)點(diǎn)

第三、第四個(gè)參數(shù)為近點(diǎn)和遠(yuǎn)點(diǎn)阻星,對(duì)應(yīng)相機(jī)能看到的最近和最遠(yuǎn)的距離朋鞍。任何比近點(diǎn)近和比遠(yuǎn)點(diǎn)遠(yuǎn)的對(duì)象都不會(huì)被渲染。

為了顯示的更加全面妥箕,可能會(huì)想用比如0.0001和9999999這樣的值作為近點(diǎn)和遠(yuǎn)點(diǎn)滥酥,這會(huì)導(dǎo)致一個(gè)BUG,這個(gè)BUG會(huì)導(dǎo)致兩個(gè)面重疊畦幢。

通常情況下坎吻,使用0.1和100

OrthographicCamera正交相機(jī)

這個(gè)相機(jī)常用于特殊類型的用途。

OrthographicCamera正交相機(jī)不存在透視關(guān)系宇葱,相同大小的物體無(wú)論遠(yuǎn)近瘦真,都會(huì)渲染出相同的大小刊头。

OrthographicCamera正交相機(jī)的參數(shù)與PerspectiveCamera透視相機(jī)參數(shù)有很大差別。

需要在攝像機(jī)的每個(gè)方向上設(shè)置看到的距離诸尽,即左原杂、右、上您机、下穿肄,而非視場(chǎng)角,然后际看,再設(shè)置近點(diǎn)被碗、遠(yuǎn)點(diǎn)。

注釋之前的PerspectiveCamera透視相機(jī)仿村,并添加OrthographicCamera正交相機(jī)。保留position位置更新部分兴喂,并調(diào)用lookAt()函數(shù)

const camera = new THREE.OrthographicCamera(- 1, 1, 1, - 1, 0.1, 100)

此時(shí)蔼囊,畫布中的渲染結(jié)果沒有透視,而且立方體各個(gè)面看上去是平行的衣迷。并且現(xiàn)在有個(gè)問(wèn)題畏鼓,立方體看起來(lái)不像立方體。

這是由于對(duì)左壶谒、右云矫、上、下提供的值是1或者-1汗菜,等同于是渲染一個(gè)正方形的區(qū)域让禀,但正方形區(qū)域會(huì)被畫布拉伸到匹配畫布尺寸,同時(shí)陨界,由于畫布不是正方形巡揍,畫面便扭曲了。

需要使用畫布的長(zhǎng)寬比菌瘪,因此創(chuàng)建一個(gè)變量aspectRatio存儲(chǔ)長(zhǎng)寬比

const aspectRatio = sizes.width / sizes.height

const camera = new THREE.OrthographicCamera(- 1 * aspectRatio, 1 * aspectRatio, 1, - 1, 0.1, 100)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
禁止轉(zhuǎn)載腮敌,如需轉(zhuǎn)載請(qǐng)通過(guò)簡(jiǎn)信或評(píng)論聯(lián)系作者。
  • 序言:七十年代末俏扩,一起剝皮案震驚了整個(gè)濱河市糜工,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌录淡,老刑警劉巖捌木,帶你破解...
    沈念sama閱讀 216,496評(píng)論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異赁咙,居然都是意外死亡钮莲,警方通過(guò)查閱死者的電腦和手機(jī)免钻,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,407評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)崔拥,“玉大人极舔,你說(shuō)我怎么就攤上這事×赐撸” “怎么了拆魏?”我有些...
    開封第一講書人閱讀 162,632評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)慈俯。 經(jīng)常有香客問(wèn)我渤刃,道長(zhǎng),這世上最難降的妖魔是什么贴膘? 我笑而不...
    開封第一講書人閱讀 58,180評(píng)論 1 292
  • 正文 為了忘掉前任卖子,我火速辦了婚禮,結(jié)果婚禮上刑峡,老公的妹妹穿的比我還像新娘洋闽。我一直安慰自己,他們只是感情好突梦,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,198評(píng)論 6 388
  • 文/花漫 我一把揭開白布诫舅。 她就那樣靜靜地躺著,像睡著了一般宫患。 火紅的嫁衣襯著肌膚如雪刊懈。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,165評(píng)論 1 299
  • 那天娃闲,我揣著相機(jī)與錄音虚汛,去河邊找鬼。 笑死畜吊,一個(gè)胖子當(dāng)著我的面吹牛泽疆,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播玲献,決...
    沈念sama閱讀 40,052評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼殉疼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了捌年?” 一聲冷哼從身側(cè)響起瓢娜,我...
    開封第一講書人閱讀 38,910評(píng)論 0 274
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎礼预,沒想到半個(gè)月后眠砾,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,324評(píng)論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡托酸,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,542評(píng)論 2 332
  • 正文 我和宋清朗相戀三年褒颈,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了柒巫。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,711評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡谷丸,死狀恐怖堡掏,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情刨疼,我是刑警寧澤泉唁,帶...
    沈念sama閱讀 35,424評(píng)論 5 343
  • 正文 年R本政府宣布,位于F島的核電站揩慕,受9級(jí)特大地震影響亭畜,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜迎卤,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,017評(píng)論 3 326
  • 文/蒙蒙 一拴鸵、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧蜗搔,春花似錦宝踪、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,668評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)秕重。三九已至不同,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間溶耘,已是汗流浹背二拐。 一陣腳步聲響...
    開封第一講書人閱讀 32,823評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留凳兵,地道東北人百新。 一個(gè)月前我還...
    沈念sama閱讀 47,722評(píng)論 2 368
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像庐扫,于是被迫代替她去往敵國(guó)和親饭望。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,611評(píng)論 2 353

推薦閱讀更多精彩內(nèi)容