（译）stackoverflow上关于柱形全景与立方体全景转换的讨论 - 一行代码一行泪 - 开源中国

提问：===@ WestLangley：我正在给某网站开发一个简单的3D全景浏览功能。考虑到移动端的性能，我使用了three.js的。它需要一个由六张图组成功立方体贴图。我用iPhone上的“Google Photosphere”（或其他类似的app）创建了一个2:1的柱形全景图，然后用把柱形全景图转换成了立方体全景图。但是我想自己完成这种转换，比如用three.js或者Phot...
阅读全文

three.js (四)离散层次细节level of details - 李勇2的个人空间 - 开源中国

LOD 处理比较大的外部地面场景中比较有用， 一般用于绘制地形。 首先通过可视体的切割删除不用的地形块，接着通过LOD 对照相机不同距离的地形块进行层次细节调整。这里采用最简单的LOD 方法。首先地形有nn 的块构成， 这些块共同构成一个大平面；首先根据每个块到照相机的距离 计算细节层次， 例如假设由5\5 个块构成地形， 每个块1\1大小， 有4个细节层次， 当块距离照相机 ...
阅读全文

three.js(八) bump map的生成 - 李勇2的个人空间 - 开源中国

bump Map 主要用于增加表面的法向量细节。例如一个平面其法向量处处相同，即使使用了纹理，光照下的表现仍然不够真实。这时可以扰动表面面片的方向量，从而形成比较真实的光照效果。类似于地形生成，可以通过分形的方法生成平面表面的随机高度， 接着根据高度生成每个位置的法向量。这里使用512\512的纹理， 但是由于分形需要513\513个点，所以最后纹理取计算结果的左上角即可。过程分成三步：...
阅读全文

three.js 地形纹理混合 - 李勇2的个人空间 - 开源中国

地形生成通常使用高度图， 而高度图的生成可以使用绘图工具，或者通过分形算法生成，例如squarediamond,  fbm方法。 这里采用简单求平均值+随机波动的方法。 对于一个2^n+1    2^n+1 的网格， 中心点的高度是四角点的平均值加随机偏移， 边上中点的高度值是边两端点的平均值加随机偏移。 接着将偏移的幅度缩小， 计算四个较小方块的顶点的高度值。...
阅读全文

VR进化论|教你搭建通用的WebVR工程 - YoneChen的个人空间 - 开源中国

_本文旨在介绍如何搭建WebVR工程以支持多场景开发。_首先，作为一个基本的前端工程来说，我们需要让代码“工程化”，不仅要提供编译构建、压缩打包功能，还要让每个页面模块化； 延伸到WebVR工程，我们也需要考虑“多页面”模块化，即提供多个场景模块化开发，因为一个完整的WebVR App不仅仅只有一个场景。这里可以参考google的WebVR多场景示例：_webvr多场景应用_多...
阅读全文

three.js 显示三维模型（贴图） - mellen的个人空间 - 开源中国

<!DOCTYPE html <html lang="en"    <head         <title id="h2"</title         <meta charset="utf8"         <meta name="viewport" content="width=devicewidth, userscalable=no, minimumscale=1.0...
阅读全文

Three.js WebGL 绘制流程(一) - 李勇2的个人空间 - 开源中国

Three.js 中3D 物体 都继承于 Object3D;而构造一个3D 物体 需要 提供两个对象 即Gemotry 几何体 和 Material 材质。Gemotry 中 vertices 决定定点的 列表， face 决定面的构成， faceVertexUv 决定 纹理坐标而Material 不同类型将会采用不同类型的shader 来绘制， 通过 设定Material 的某些材质...
阅读全文

Three.js活地图 - 乐搏学院的个人空间 - 开源中国

的著名3D开源引擎之一的three.js中的主要对象及其间关系展示。图1:基本渲染顺序示意图图2:引擎核心对象示意图登录乐搏学院官网或关注我们的官方微博，还有更多惊喜哦本文出自 “原网址: 创建于: 20181013 16:37:16目录: default标签: 无
阅读全文

three.js三维空间中物体的位置信息变换 - 莫西摩西的个人空间 - 开源中国

第一点 object的矩阵是指：该物体从父级坐标系的原点变换到当前位置，其中包括位移、放缩、旋转第二点 物体的position：对象是相对其父级而言的例如： 场景中物体包含关系： scenegroupcube cube的position为（15，0，0）这是相对于group group的position为（80，0，0）这是相对于scene group的矩阵为 \_例子1、_ 现在要求...
阅读全文

Three.js 起步 - itviewer的个人空间 - 开源中国

three.js 四要素：渲染器、场景、相机、物体其中相机和物体需要添加进场景，渲染器通过场景和相机产生画面。物体又是由几何体和材质组成 其中渲染器为网页中的canvas元素，其可以在网页中显示指定，也可以通过指定div容器，然后再将渲染器生成的canvas元素添加进去。两种方式分别如下：1、指定cavas```<canvas id="mainCanvas" width="...
阅读全文