Three.js開發指南(2):使用構建Three.js場景的基本元件
講解一些構成Three.js場景的基礎元件
2.1 建立場景
場景的基本功能:新增、刪除物體
在場景中新增霧化效果:物體離得遠,就越模糊
使用材質覆蓋屬性:場景的overrideMaterial屬性用來設定所有物體的材質
2.2 使用幾何和網格物件
Three.js庫附帶了很多現成的幾何體,你可以在三維場景中使用它們。
可以通過定義頂點和麵,手工建立幾何體。
網格物件的函式和屬性:建立一個網格需要一個幾何體,以及一個或多個材質。
注:一個物件的位置是相對於其父物件的
2.3 選擇合適的相機
Three.js庫裡有兩種不同的相機:正投影相機和透視相機
正投影相機(OrthographicCamera):物件和相機之間的距離不會影響渲染結果,通常用在二維遊戲中,如《模擬城市4》
透視檢視(PerspectiveCamera):是最自然的檢視,距離越遠,被渲染得越小。
屬性圖
讓相機在指定點上聚焦:camera.lookAt(new THREE.Vector3(x, y, z)
相關文章
- Three.js開發指南(4):使用Three.js的材質JS
- Three.js開發指南(3):使用Three.js裡的各種光源JS
- Three.js開發指南(5 6):使用Three.js的幾何體JS
- Three.js開發指南(12):用Physijs在場景中新增物理效果JS
- Three.js開發指南(1):介紹JS
- Three.js開發指南(10):載入和使用紋理JS
- 從 0 開始學習 Three.js : 場景搭建JS
- Three.js開發指南(7):粒子和粒子系統JS
- Three.js開發指南隨書原始碼下載地址JS原始碼
- Three.js開發指南(9):建立動畫和移動相機JS動畫
- three.js學習(2):SceneJS
- Three.js 裡的基礎構成JS
- Three.js開發指南(11):定製著色器和渲染後期處理JS
- 【Three.js】Three.js學習記錄JS
- 小遊戲使用three.js遊戲JS
- three.jsJS
- Three.js開發指南(8):建立、載入高階網格和幾何體JS
- three.js 著色器材質內建變數JS變數
- 淺析低程式碼開發的典型應用構建場景
- THREE.JS中 CubeTextureLoader 使用避坑JS
- three.js WebGLRenderTargetJSWeb
- three.js之GroupJS
- three.js 曲線JS
- docker 部署three.jsDockerJS
- Three.js中的矩陣JS矩陣
- three.js 著色器材質之glsl內建函式JS函式
- three.js 裡的點,線,面JS
- Three.js 動效方案JS
- three.js 製作魔方JS
- Three.js基礎(二)JS
- Three.js基礎(一)JS
- Three.js基礎(三)JS
- THREE.js渲染順序JS
- Three.js 入門示例JS
- HTML5與WebGL程式設計(2):Three.jsHTMLWeb程式設計JS
- HDFS應用場景、原理、基本架構及使用方法概述架構
- 【計算機圖形學】入門Three.js,並搭建你的第一個3D場景計算機JS3D
- three.js獲取物件的材質JS物件