ThreeJs 建立第乙個案例

2021-10-07 11:33:10 字數 2108 閱讀 6021

1、場景sence

2、網格模型mesh

幾何體 geometry

幾何體材質 material

3、光源

點光源 point(需調位置)

環境光源 ambient

4、相機camera(需調相機的位置以及攝像頭的朝向位置)

5、渲染器render

6、掛載

將渲染器生成的canvas物件掛載到dom上

建立場景scene

*/var m_scene =

newthree.scene()

;/*建立網格模型 mesh

*///mesh的幾何體

var geometry =

newthree.boxgeometry

(100

,100

,100);

//mesh的材質

var material =

newthree.meshlambertmaterial()

;//合成mesh物件

var m_mesh =

newthree.mesh

(geometry,material)

;m_scene.

add(m_mesh);/*

環境設定--光 point and ambient

*///點光源

var point =

newthree.pointlight

(0xffffff);

//點光源位置

point.position.

set(

400,

200,

300)

;//點光源新增到場景中

m_scene.

add(point)

;//環境光源

var ambient =

newthree.ambientlight

(0x444444);

m_scene.

add(ambient);/*

建立相機

*/var width = window.innerwidth;

//視窗寬度

var height = window.innerheight;

//視窗高度

var k = width / height;

//視窗寬高比

var s =

200;

//三維場景顯示範圍控制係數,係數越大,顯示的範圍越大

//建立相機物件

var m_camera =

newthree.orthographiccamera

(-s * k, s * k, s,

-s,1

,1000);

m_camera.position.

set(

200,

300,

200)

;//設定相機位置

m_camera.

lookat

(m_scene.position)

;//設定相機方向(指向的場景物件)

/** * 建立渲染器物件

*/var renderer =

newthree.webglrenderer()

;renderer.

setsize

(width, height)

;//設定渲染區域尺寸

renderer.

setclearcolor

(0xb9d3ff,1

);//設定背景顏色

document.body.

(renderer.domelement)

;//body元素中插入canvas物件

//執行渲染操作 指定場景、相機作為引數

重構,開始第乙個案例

你會發現所謂設計不再是一切動作的前提,而是在整個開發過程中逐漸浮現出來的。martin flower 沒有銀彈,沒有放之四海而皆準的真理。重構和自動化測試時緊密聯絡的,沒有自動化測試,重構會步履維艱。重構 在不蓋被 外在行為的前提下,對 做出修改,以改進程式的內部結構。也就是在 寫好之後改進它的設計...

Robot Framework (三)第乙個案例

2018 08 29 10 41 17 ride的三種啟動方式 1.雙擊桌面的機械人圖示 2.進入cmd命令列視窗,輸入ride.py 3.進入python目錄的scripts目錄下,雙擊ride.py檔案 一 建立專案 測試套件 測試用例 new project new suite new tes...

Refactoring 筆記 第乙個案例總結

重構保障 1 建立測試環境 比如單元測試 確保重構後的 不會帶來新的 bugs。重構前提 1 當乙個函式或類履行了太多的職責。2 當乙個變更存在多個相同的修改點。3 當需要為程式新增乙個特性,而 結構使你無法很方便地那麼做。重構原則 1 盡量以最小的步伐修改程式。如果你犯下錯誤,很容易發現它。2 使...