摘要：
在使用Three.js中 使用for循环加载 出现的 BUG 直接上代码： js var objArray = ["1","2","3","4"]; for(var i = 0; i 阅读全文
posted @ 2018-09-13 15:09
可爱的黑精灵
阅读(2479)
评论(0)
推荐(0)
摘要：
本篇简单介绍 中矩阵变换及两种旋转表达方式。 矩阵变换 使用矩阵来保存 的变换信息。 矩阵变换的基础 平移变换 比例变换 旋转变换 绕 轴旋转 绕 轴旋转 绕 轴旋转 中的矩阵 我们可以看到正如上面的公式 的平移 所以elements[12]、elements[13]、elements[14]依次为 阅读全文
posted @ 2018-09-13 15:04
可爱的黑精灵
阅读(6151)
评论(0)
推荐(0)
摘要：
本篇介绍 类中的 方法。 中类似的 方法可以类推。 问题提出 我想实时的更新材质(material)的贴图(map)，所以我在 中为 赋值并将 设为 。 后来跑着跑着页面挂了，我发现这个赋值操作很占 ，我在找解决方案的时候发现这玩意不需要赋值操作！！！ 设为 它会实时的检测贴图是否更新，并更新贴图。 阅读全文
posted @ 2018-09-13 15:03
可爱的黑精灵
阅读(3305)
评论(2)
推荐(1)
摘要：
本篇介绍 性能优化的若干方法。(个人拙见) three.js性能优化 尽量重用Material和Geometry 这里以Material和Geometry为例（使用比较频繁） js for (var i = 0; i 0 && (+new Date() start 0){ setTimeout(ar 阅读全文
posted @ 2018-09-13 15:01
可爱的黑精灵
阅读(14851)
评论(0)
推荐(2)
摘要：
Three.js学习笔记 本篇介绍物理引擎库Physijs，通过物理引擎我们可以向场景添加重力、摩擦、约束条件或是碰撞检测等令人激动的效果。 Physijs是基于著名的物理引擎ammo.js。 learn more from physijs step1 导入库文件 step2 创建带有物理效果的场景 阅读全文
posted @ 2018-09-13 14:59
可爱的黑精灵
阅读(1653)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇介绍粒子、粒子系统和精灵。 粒子 （粒子）和大多数的 对象一样都属于 对象的扩展。 创建一个粒子只需要传入一个材质参数。材质可为 或是 但是这是相对于 渲染器，使用 创建粒子并没有效果。 粒子系统 如果使用 则需要 。 创建一个粒子系统需要传入几何体和材质两个参数。 精 阅读全文
posted @ 2018-09-13 14:58
可爱的黑精灵
阅读(1167)
评论(0)
推荐(2)
摘要：
Three.js学习笔记 本篇介绍纹理的使用。 纹理 我们可以在材质中加载纹理，在 的`map`属性中。 前面用到的 已经被摒弃。 纹理的加载时异步的，所以需要注意。支持 、`GIF JPEG`输入格式。 最好使用正方形图片，保证长宽都是2的次方大小。 凹凸贴图 凹凸贴图是一张灰度图，上面有像素的相 阅读全文
posted @ 2018-09-13 14:58
可爱的黑精灵
阅读(3737)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇使用three.js的扩展库THREEBSP来操作标准的几何体来创造出新的几何体。 learn more from ThreeBSP 由于three.js提供的标准几何体有限，自定义几何体的构造比较麻烦。所以我们也许可以使用three.js的扩展库ThreeBSP来构造 阅读全文
posted @ 2018-09-13 14:57
可爱的黑精灵
阅读(747)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇介绍 （模型）及相关问题。 格式的模型较为通用，较为适合用于3D软件互导。所以我们以 模型以及其材质文件 为例。 、`CTM VTK js`文件。 添加OBJ模型 js //这里的 是我从3Dmax新鲜导出的一个简陋的 模型 //比较基本，没有材质 function l 阅读全文
posted @ 2018-09-13 14:56
可爱的黑精灵
阅读(802)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇介绍 的创建和绑定。完成简单的骨骼动画。 初始化数据、创建骨骼 这里我们使用 来创建一段几何图形模拟具有骨骼的物体。 你可以比作人的身体而我们创建的 骨骼以及 骨架就相当于人的脊椎。 js //每段高度，这里指骨骼长度 var segmentHeight = 6; // 阅读全文
posted @ 2018-09-13 14:55
可爱的黑精灵
阅读(1080)
评论(0)
推荐(1)
摘要：
Three.js学习笔记 本篇上一篇介绍的 和`curves`(曲线)实现在canvas画画。 目前只支持画线。 添加画板 我们可以添加一个 当做画板，要足够的大。 添加画笔 然后添加一个 当做画笔。利用 的`intersectObjects() point`属性获取当前相交的交点坐标。 js va 阅读全文
posted @ 2018-09-13 14:55
可爱的黑精灵
阅读(1789)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇介绍一下高级光源，镜头眩光。镜头眩光在生活中比较常见，比如说当你直接朝着太阳拍照的时候就会出现镜头眩光。 大多数情况下要避免这种情况的发生，但是在三维场景和游戏中却是一种很好的效果。让场景更加的真实。 同时也会简单介绍一下相机控件。 渲染器设置 要生成阴影需要将渲染器的 阅读全文
posted @ 2018-09-13 14:53
可爱的黑精灵
阅读(783)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇为Raycaster(射线)的使用。 Raycaster Constructor Main Properties ：射线放射的位置 ：方向向量，应该是标准化的 ：能投射的最近距离 ： 能投射的最远距离 拾取物体 我们可以定义一个由mouse(鼠标)发出的射线，从而来拾取 阅读全文
posted @ 2018-09-13 14:52
可爱的黑精灵
阅读(3809)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇介绍一下阴影的生成。 渲染器设置 要生成阴影需要将渲染器的 开启。 设置 的样式 添加光源 这里的光源需要是能生成阴影的光源。比如说是 、`DirectinalLight castShadow` 属性的高级光源。 和`PointLight SpotLight`为例。 添 阅读全文
posted @ 2018-09-13 14:48
可爱的黑精灵
阅读(1425)
评论(1)
推荐(0)
摘要：
Three.js学习笔记 本篇简单列举一下three.js的核心对象。 scenes scene 三维场景。 Constructor Main Properties ：定义雾影响场景渲染 fog 受雾影响的三维场景。 Constructor Main Properties ：定义雾的颜色 ：定义雾效 阅读全文
posted @ 2018-09-13 14:47
可爱的黑精灵
阅读(389)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇为基础扩展部分(学习使用插件扩展你的三维场景) WebGL支持 目前绝大部分主流浏览器是支持WebGL的，但是IE的大部分版本并不支持WebGL。 所以如果你想使用旧版本的IE浏览器，可以通过下载 的`Google Chrome Frame`插件 也可以使用 同时对于浏 阅读全文
posted @ 2018-09-13 14:46
可爱的黑精灵
阅读(480)
评论(0)
推荐(0)
摘要：
Three.js学习笔记 本篇为基础部分(学习如何快速的创建一个三维场景) three.js是什么 Three.js是一个 `JavaScript`库。 three.js能干什么 创建简单或是比较复杂的三维图形并应用丰富多彩的纹理和材质。 添加五光十色的光源。 在3D场景中移动物体或是添加脚本动画。 阅读全文
posted @ 2018-09-13 11:56
可爱的黑精灵
阅读(334)
评论(0)
推荐(0)
浙公网安备 33010602011771号