合集-three.js基础
摘要：记录下three.js的学习历程。 Three.js是基于 WebGL 技术，用于浏览器中开发 3D 交互场景的 JS 引擎。 Three.js擅长 WebGL 场景渲染，Three.js不擅长物理碰撞，因此不适合开发 3D 游戏 three.js基本概念包括画布Canvas、渲染器Renderer
阅读全文
摘要：为了便于后面的学习封装了几个初始化的函数 import { WebGLRenderer, PerspectiveCamera, AmbientLight, SpotLight, PointLight, DirectionalLight, PlaneGeometry, BoxGeometry, Sph
阅读全文
摘要：本系列中案例参考自 https://github.com/josdirksen/learning-threejs-third 动画 <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three":
阅读全文
摘要：初始化共用方法 <canvas id="model"></canvas> <canvas id="texture"></canvas> <canvas id="shadow"></canvas> <canvas id="color"></canvas> <script type="importmap
阅读全文
摘要：静态场景 <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addons/": "./js/jsm/" }
阅读全文
摘要：mesh之位置、缩放、平移、旋转属性 <canvas id="mesh-properties"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addon
阅读全文
摘要：Group <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addons/": "./js/jsm/" }
阅读全文
摘要：init.js增加共用方法 function addMaterialSettings(gui, controls, material, folderName = "Material") { controls.material = material; const folder = gui.addFol
阅读全文
摘要：加载各种模型 <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addons/": "./js/jsm/"
阅读全文
摘要：动画 <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addons/": "./js/jsm/" } }
阅读全文
摘要：BufferGeometry缓冲几何体 <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addons/":
阅读全文
摘要：clipping <canvas id="mainCanvas"></canvas> <script type="importmap"> { "imports": { "three": "./js/build/three.module.js", "three/addons/": "./js/jsm/
阅读全文
