Three.js記事[一]

1，導入Three.js、Jquery.js等JS文件

2，添加Html5渲染區域，例：<div id="WebGL-output"></div>

3，寫場景Script:

? ?3.1，新建腳本全局變量；例:var scene,camera,renderer;

? ?3.2，填充$(function(){……});

? ? ? ? 3.2.1，新建場景 ? scene = new THREE.Scene();

? ? ? ? 3.2.2，新建相機 ? camera = new THREE.PerspectiveCamera(

? ? ? ? ? ? ? ? ? ?[可視角度:50],[寬高比:1],[深度剪切面近的距離:0.1],[深度剪切面遠的距離:2000]);

? ? ? ? 3.2.3，新建渲染 ? renderer = new THREE.WebGLRenderer();

? ? ? ? ? ? ? ? ? ?通常會有setClearColor(),setSize()等函數調用，準備前置內容


ShadowMapEnabled 陰影映射開關 ?receiveShadow 接受陰影開關 ? castShadow 投射陰影開關 ?

最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 之前用qunee做了一個2.5d的機房監控，丑的閃瞎我的卡姿蘭大眼，后來含淚用three.js做個3d的換...
    我得有妖氣閱讀 1,615評論 1贊 2
  • 1、三大組建 在Three.js中，要渲染物體到網頁中，我們需要3個組建：場景（scene）、相機（camera）...
    依依玖玥閱讀 647評論 0贊 0
  • Three.js是一個3DJavaScript庫，基于右手坐標系，可以創建簡單或是比較復雜的三維圖形并應用豐富多彩...
    呆呆的木木閱讀 24,759評論 42贊 59
  • 本文主要是講解 Three.js 的相關概念，幫助大家對 Three.js 以及相關知識形成比較完整的理解。今年來...
    Simon王小白閱讀 8,511評論 2贊 9
  • 今天天氣很好，就像和你初次見面的那天一樣。算上今天我們已經認識了55天了。這是我給你的第33封信了。不知道你...
    包利平閱讀 356評論 0贊 0