three.js
no see me
交个朋友
展开
-
threejs动画时间与帧率的关系
每一帧动画与animationclip.time时间相对应,当使用animation.mixer.updata()更新位置时,mixer.time和cilp.time的时间也随之更新;同样地,当改变时间时,位置也同样相应更新。不过update会立马更新位置,而改变时间只有在update的时候才会立马更新到该时间位置。...原创 2019-11-13 20:23:50 · 2330 阅读 · 0 评论 -
threejs学习之透视相机与正交相机
three.js学习之透视相机与正交相机透视相机和正交相机的原理都是将可视范围内的物体投影到一个平面,我们在浏览器上所看到的就是这个投影平面,这个平面也就是我们设置相机时,far属性所在的那一个横截面。透视相机和正交相机的区别就是可视体的设置方法不同,透视相机的可视体是一个四锥体,而正交相机是一个长方体;透视相机由四锥体投影到一个平面时,相同大小的网格离上顶面越近投影到far横截面自然...原创 2019-11-11 21:50:04 · 3270 阅读 · 0 评论 -
three.js动画(Animation)
导航一、three.js的动画解析基本流程二、各部分功能介绍三、threejs的动画类型四、threejs对动画的处理过程一、three.js的动画解析基本流程var mesh; //导出外部文件获得// 新建一个AnimationMixer, 并取得AnimationClip实例列表var mixer = new THREE.AnimationMixer( mesh );v...原创 2019-10-17 22:11:36 · 7348 阅读 · 4 评论 -
three.js材质大全
three.js材质大全目录材质(Material)MeshBasicMaterialMeshDepthMaterialMeshDistanceMaterialMeshMatcapMateriaMeshNormalMaterialMeshFaceMaterialMeshLambertMaterialMeshPhongMaterialMeshToonMaterialMesh...原创 2019-10-11 22:06:29 · 1521 阅读 · 0 评论 -
three.js鼠标事件
实现功能:1.左键点击方块并移动鼠标,方块跟随鼠标移动。2.右键点击方块并移动鼠标,方块旋转。3.鼠标滚动可以放大或缩小方块。代码实现如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Test01</title&...原创 2019-09-29 23:55:31 · 5434 阅读 · 1 评论 -
three.js为正方体6个面加载不同纹理(and天空图的制作)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>TextureTest</title> <script src="../libs/three.js"></script> <s...原创 2019-10-02 19:57:45 · 2290 阅读 · 2 评论 -
three.js中的object3D对象
下面是object3D对象的构造方法,在该方法下我们可以清楚的看到一个object3D对象的构造过程。接下来按源码顺序具体解释一下每个属性和对象方法:Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。uuid是Universally Unique Identifier的缩写,它是在一定的范围内(从特定的名字空间...原创 2019-10-07 09:44:41 · 6373 阅读 · 0 评论 -
three.js网格加载原理
如下代码所示,每当我们运用three.js创建一个网格时,网格的构造方法中都会自动生成一个object3D对象,可以看出,所有的网格底层其实都是一个object3D对象。创建完object3D对象之后再把对象类型改为type,将我们之前定义好的集合体(geometry)和材质(material)赋值给这个object3D对象,也就是现在的Mech对象。至此,网格加载完成,进行更新。THREE...原创 2019-10-07 09:46:11 · 266 阅读 · 1 评论