• 

• 书名： Three.js开发指南：基于WebGL和HTML5在网页上渲染3D图形和动画(原书第3版)
• 作者： （美）乔斯·德克森（Jos Dirksen）
• 简介：
• 出版时间
• ISBN：
• 分类：
• 出版社： 机械工业出版社

高亮划线

前言

• 📌 使用Three.js的基本步骤。阅读完本章就能立刻创建你的第一个Three.js场景，也能直接在浏 ^CB-4qe6mO6j3G3e6bK6cM-4-908-957
  • ⏱ 2022-09-15 07:39:06

第1章 使用Three.js创建你的第一个三维场景

• 📌 不同的材质对光源的反应是不一样的 ^CB-4qe6mO6j3G3e6bK6cM-5-18613-18629

  • ⏱ 2023-03-17 18:55:59

• 📌 基本材质（THREE.MeshBasicMaterial）不会对光源有任何反应，基本材质只会使用指定的颜色来渲染物体 ^CB-4qe6mO6j3G3e6bK6cM-5-18635-18693

  • ⏱ 2023-03-17 18:56:23

第2章 构建Three.js应用的基本组件

• 📌 在Three.js中几何体基本上是三维空间中的点集（也被称作顶点）和将这些点连接起来的面 ^CB-4qe6mO6j3G3e6bK6cM-6-11380-11424

  • ⏱ 2023-03-20 08:44:36

• 📌 顶点顺序决定了某个面是面向摄像机还是背向摄像机的 ^CB-4qe6mO6j3G3e6bK6cM-6-12220-12244

  • ⏱ 2023-03-20 08:45:51

• 📌 如果你想创建面向摄像机的面，那么顶点的顺序是顺时针的，反之顶点的顺序是逆时针的。 ^CB-4qe6mO6j3G3e6bK6cM-6-12245-12285

  • ⏱ 2023-03-20 08:47:35

• 📌 computeFaceNormals()方法，当该方法执行时，Three.js会决定每个面的法向量，法向量用于决定不同光源下的颜色 ^CB-4qe6mO6j3G3e6bK6cM-6-12785-12850

  • ⏱ 2023-03-20 08:54:09

• 📌 verticesNeedUpdate ^CB-4qe6mO6j3G3e6bK6cM-6-13847-13865

  • ⏱ 2023-03-23 08:33:39

• 📌 computeFaceNormals ^CB-4qe6mO6j3G3e6bK6cM-6-13888-13906

  • ⏱ 2023-03-23 08:34:09

• 📌 SceneUtils.createMulti-MaterialObject() ^CB-4qe6mO6j3G3e6bK6cM-6-14954-14993

  • ⏱ 2023-03-23 08:36:01

• 📌 这里我们复制立方体的第一个子对象。请记住，mesh变量包含两个THREE.Mesh子对象：基于两个不同材质创建的。通过这个复制的几何体我们创建了一个新的网格，并命名为mesh2。使用translate()方法移动这个新创建的网格，删除之前的副本（如果存在）并把这个副本添加到场景中。[插图]在前面的章节中，我们使用THREE.SceneUtils对象的createMultiMaterialObject()方法为几何体添加了线框。在Three.js中还可以使用THREE.WireframeGeometry来添加线框。假设有一个几何体对象名为geom，可以通过下面代码基于geom创建一个线框对象：[插图]然后，基于新建的线框对象创建一个Three.LineSegments对象并将它添加到场景中： ^CB-4qe6mO6j3G3e6bK6cM-6-16019

  • ⏱ 2023-03-23 08:41:44

• 📌 对象的位置是相对于它的父对象来说的 ^CB-4qe6mO6j3G3e6bK6cM-6-18372-18389

  • ⏱ 2023-03-23 08:43:03

• 📌 摄像机的fov属性决定了横向视场。基于aspect属性，纵向视场也就相应地确定了。near属性决定了近面距离，far属性决定了远面距离。近面距离和远面距离之间的区域将会被渲染。 ^CB-4qe6mO6j3G3e6bK6cM-6-25338-25426

  • ⏱ 2023-03-27 08:08:41

第3章 学习使用Three.js中的光源

• 📌 WebGL本身并不支持光源 ^CB-4qe6mO6j3G3e6bK6cM-7-802-815

  • ⏱ 2023-03-27 08:13:13

• 📌 3.1　Three.js中不同种类的光源Three.js中有许多不同种类的光源，每种光源都有特别的行为和用法。在本章中，将讨论表3.1中所列光源。表　3.1[插图]本章主要分为两部分内容。首先，我们先看一下基础光源：THREE.AmbientLight、THREE.PointLight、THREE.SpotLight和THREE.DirectionalLight。所有这些光源都是基于THREE.Light对象扩展的，这个对象提供公用的功能。以上提到的光源都是简单光源，只需一些简单的配置即可，而且可用于创建大多数场景的光源。 ^CB-4qe6mO6j3G3e6bK6cM-7-1350

  • ⏱ 2023-03-27 08:13:34

• 📌 THREE.AmbientLight不会生成阴影 ^CB-4qe6mO6j3G3e6bK6cM-7-2261-2285

  • ⏱ 2023-03-27 08:17:27

第4章 使用Three.js的材质

• 📌 本章将深入探讨Three.js库提供的所有材质，你也将会从中学到如何运用这些材质创建漂亮的三维对象。本章将要探讨的材质如表4.1所示。表　4.1[插图][插图]如果浏览Three.js库的源代码，你可能看到过THREE.RawShaderMaterial。这是一种特殊的材质，只能和THREE.BufferedGeometry一起使用。 ^CB-4qe6mO6j3G3e6bK6cM-8-595

  • ⏱ 2023-03-29 08:32:58

• 📌 THREE.MeshDepthMaterial ^CB-4qe6mO6j3G3e6bK6cM-8-7507-7530

  • ⏱ 2023-03-30 08:29:19

• 📌 由物体到摄像机的距离决定的 ^CB-4qe6mO6j3G3e6bK6cM-8-7562-7575

  • ⏱ 2023-03-30 08:29:31

• 📌 gl_Position变量是一个特殊变量，用来返回最终的位置 ^CB-4qe6mO6j3G3e6bK6cM-8-25196-25226

  • ⏱ 2023-03-31 08:40:32

第5章 学习使用几何体

• 📌 fromBufferGeometry方法，可以接收基于THREE.BufferGeometry的对象，并将其数据导入到THREE.Geometry对象中 ^CB-4qe6mO6j3G3e6bK6cM-9-3099-3175

  • ⏱ 2023-04-03 08:10:53

• 📌 fromGeometry ^CB-4qe6mO6j3G3e6bK6cM-9-3204-3216

  • ⏱ 2023-04-03 08:11:02

第6章 高级几何体和二元操作

• 📌 通过THREE.ConvexGeometry，我们可以围绕一组点创建一个凸包。所谓凸包就是包围这组点的最小图形 ^CB-4qe6mO6j3G3e6bK6cM-10-1138-1193

  • ⏱ 2023-04-25 14:19:13

• 📌 通过THREE.ExtrudeGeometry，你可以从一个二维图形创建出一个三维图形。 ^CB-4qe6mO6j3G3e6bK6cM-10-5169-5213

  • ⏱ 2023-05-04 08:31:01

读书笔记

本书评论