标签:threejs

threejs

threejs 实现发光描边闪烁效果

threejs 实现发光描边闪烁效果
threejs实现发光描边后,我们可以继续深入学习,进行更多的设置。 OutlinePass有很多控制高亮外边框样式的属性,下面介绍几个比较常用的属性。 OutlinePass描边颜色 OutlinePass描边颜色,通过visibleEdgeColor来实现,默认是白色 out...

yekong 2天前 15℃ 0喜欢

threejs

threejs 3d环绕旋转动画效果实例

threejs 3d环绕旋转动画效果实例
之前的一个数据可视化大屏 项目开发中,有一个要求是需要进行3d环绕旋转的效果,这个效果之前有个案例demo中看到过,是通过css的matrix3d方式实现的,css实现方式,但是这个demo的css太长了,如果按照这个来写的话,实在是困难,首先每一个的css都特别长,写10几个的...

yekong 2周前 (03-09) 86℃ 0喜欢

threejs

threejs 射线Ray api的使用

threejs 射线Ray api的使用
学习Threejs中的射线Ray概念,你可以类比数学几何中提到的射线,在三维空间中,一条线把一个点作为起点,然后沿着某个方向无限延伸。 创建射线对象 // 创建射线对象 const ray = new THREE.Ray() 射线起点 .origin 射线Ray的起点.orig...

yekong 2周前 (03-09) 60℃ 0喜欢

threejs

threejs 几何体一个颜色变化另外一个也跟着变

threejs 几何体一个颜色变化另外一个也跟着变
问题 在threejs项目中,可能会出现一种情况,明明修改的只是模型1的材质颜色,其他模型的材质颜色也跟着变了。 原因: 两个模型共享的同一个材质,对材质的任何修改都会同时反应在两个模型上。 两个mesh共享一个材质,改变一个mesh的颜色,另一个mesh2的颜色也会跟着改变 n...

yekong 4周前 (02-28) 83℃ 0喜欢

threejs

threejs 隐藏模型和显示模型

threejs 隐藏模型和显示模型
threejs项目开发中我们会遇到隐藏模型的需要,我们可以通过属性.visible来控制模型的隐藏和显示。 .visible是true是显示,false为隐藏,默认为true group.visible = false 材质属性 .visible 材质对象的父类 Materia...

yekong 4周前 (02-28) 84℃ 0喜欢

threejs

threejs 添加对象移出对象

threejs 添加对象移出对象
threejs 通过add()添加对象,比如添加模型光源到场景中。 通过remove移出对象,将已添加的对象从父对象.children属性中删除。 const group = new THREE.Group(); const mesh1 = new THREE.Mesh(geom...

yekong 4周前 (02-28) 51℃ 0喜欢

threejs

threejs 控制透视投影相机的缩放范围

threejs 控制透视投影相机的缩放范围
在实际应用中,透视投影相机的规则是远小近大,相机距离目标观察点距离越远,目标模型显示越小,距离越近显示越大. 对于透视投影相机而言,OrbitControls缩放,本质上就是改变相机的位置属性.position. 这就是说如果你想控制缩放范围,就是约束相机位置.position的...

yekong 4周前 (02-28) 74℃ 0喜欢

js

threejs 添加可视化光源

threejs 添加可视化光源
threejs在进行调试的时候,为了方便我们知道光源的位置,我们可以使用PointLightHelper来实现添加可视化点光源,从而更直观的了解到光源在3d项目中的作用。 // 添加光源 const pointLight = new THREE.PointLight(0xffff...

yekong 4周前 (02-28) 147℃ 0喜欢

threejs

threejs 相机控件OrbitControls旋转缩放拖拽限制

threejs 相机控件OrbitControls旋转缩放拖拽限制
比如一个展示一个三维场景,你不希望鼠标右键拖动会产生一个平移效果。 相机控件OrbitControls有很多属性,我们可以通过属性设置来进行相关操作。 禁止右键拖拽 可以通过设置相机空间对象OrbitControls的.enablePan 属性, 查看OrbitControls源...

yekong 4周前 (02-28) 75℃ 0喜欢

js

threejs相机控件轨道控制器OrbitControls

threejs相机控件轨道控制器OrbitControls
平时开发调试代码,或者展示模型的时候,可以通过相机控件OrbitControls实现旋转缩放预览效果。 OrbitControls使用 通过OrbitControls我们使用鼠标可以实现以下操作: 旋转:拖动鼠标左键 缩放:滚动鼠标中键 平移:拖动鼠标右键 如果我们不希望鼠标有这...

yekong 4周前 (02-28) 52℃ 0喜欢