Threejs
GIS融合之路（二）CesiumJS和ThreeJS深度缓冲区整合
在这篇文章开始前再次重申一下，山海鲸并没有使用ThreeJS引擎。但由于ThreeJS引擎使用广泛，下文中直接用ThreeJS同CesiumJS的整合方案代替山海鲸中3D引擎和CesiumJS整合。 系列传送门： 山海鲸可视化：GIS融合之路（一）技术选型CesiumJS/loaders.gl/iT ......
初见threejs
threejs底层封装了强大的webGL技术，让开发者们可以开箱即用 （其实也并非开箱即用，还是挺麻烦的🙂）。 恰巧朋友遇到了些难题，借此契机，接触了下threejs。 官网是支持中文的，虽然翻译的很差，但寥胜于无。 这里还有个野生的中文文档，感兴趣的可以看看，毕竟也是某位开发者的一腔热血之作！ ......
ThreeJS纯记录用
缝合了ThreeJS，然后地图缝合了Cesium，缝的版本又老，不更新成新版本，功能比ThreeJS和Cesium都弱，想调用Cesium原生方法，嘿，没门，封死了。 价格贵的要死。你咨询技术支持他首先就会问你买会员了没。SVIP一年一万，买了毛用没有，技术支持并不会因此变得专业，问就是刷新，问就是 ......
threejs 大屏炫酷3D地图-附源码
炫酷3D地图效果如下： 代码注释非常详细： create() { // 添加雾,随着距离线性增大,只能看到一个小是视野范围内的场景，地图缩小很多东西就会看不清 //this.scene.fog = new THREE.Fog(0x191919, 30, 70) this.getCenterPoint ......
ThreeJS导入失败
title: ThreeJS导入失败 banner_img: https://proxy.thisis.plus/aadc0c1c0eb1c7f5e57ab3b42256cb0.jpg date: 2023-1-13 10:00:00 categories: - 踩坑 tags: - ThreeJS ......
ThreeJS实现屏幕坐标转3d坐标
title: ThreeJS实现屏幕坐标转3d坐标 banner_img: https://drive.studyinglover.com/api/raw/?path=/photos/blog/background/e4127f10a90d5f6fd4f77b0225a19878.jpg date: ......
threejs—01—概念
一、物体如何移动 所有的物体不管是PerspectiveCamera()还是mesh()构造函数，都是继承Object3D()的。 因为继承，所以，camera实例和mesh实例，不仅可以访问自己构造函数的函数原型prototype对象里的东西，也可以访问Object3D()函数的属性。 其中，Ob ......
Threejs 导入OBJ、GLTF、GLB 模型
<script src="../build/three.js"></script> <script src="js/controls/OrbitControls.js"></script> // 相机控件 <script src="js/loaders/OBJLoader.js"></script> ......
threejs的坐标渲染和着色
点击查看代码 function createBasic() { // 目标：了解顶点坐标绘制正方形 // 1. 准备 BufferGemotry 缓冲几何图形 // 2. 准备 32 位浮点数的数组，定义矩形的顶点位置 // 3. 准备 BufferAttribute 属性缓冲对象，保存几何图形的属 ......
gasp动画 threejs camera 相机位置 相机变换 动态视角
gasp动画控制相机的位置变换 关键代码threejs/Cameras.ts //通过gsap 动画移动相机,从而实现看似物体在运动的效果 // 1.添加动画 private changePerspectiveCameraPosition() { // 添加一个动画 gsap.to(this.per ......
threejs CSS2DObject点击事件触发不了
原因：在three.js 0.13X版本后,上面dom的onclick 不会触发，原因是控制器Controls，可以尝试一下去掉控制器，看看dom上的点击事件是否ok let obtControls = new OrbitControls(camera, container); // OrbitCo ......
threejs安装与开始
安装导入 npm npm i three 导入 并非所有功能都在three，还需从子目录导入 // three模块 import * as three from 'three' // 一些不在three模块的功能，这里是OrbitControls导入示例 import { OrbitControls ......
Threejs -- TweenJS自定义flyTo函数
TweenJS 参考文档 笔记末尾附自定义flyTo函数 动画库tweenjs简介和引入项目 TweenJS是一个有javascript语言编写的补间动画库，如果需要tweenjs辅助你生成动画，对于任何前端web项目，你都可以选择tweenjs库。 如果你是用three.js开发web3d项目，使 ......
threejs源码
##### 剖分  ##### 管道  #### 1.在node.js官网下载  material depthWrite material depthTest 材质混合 实例中的问题 默认类似于这种组合， 多个透明物体的渲染时候，thre ......
Threejs物体缩放与旋转
[TOC] 物体的缩放与旋转是我们经常要操作的方式。 #### 1 scale设置缩放 因为物体的scale属性是vector3对象，因此按照vector的属性和方法，设置x/y/z轴方向的缩放大小。 -开发中的容易被忽略的
在threejs Editor中调好一些样式属性后， 可以直接选择导出具体的格式，或者导出成json【json 一般体积大很多，比glb】(场景，通过objectLoader 加载json！！！) 自发光属性和自发光贴图： .emissive .emissiveMap 【有时候模型导出后，使用thr ......
我不知道的threejs（5）- 虹彩效应-切换几何体内存不泄露
虹彩效应：肥皂泡，油滴，蝴蝶翅膀等薄膜的虹彩效应 MeshPhysicalMaterial({ color:, roughness: transmission: thinkness:0.1 薄膜效应，厚度需要小 iridescence:1 //彩虹效应， 和设置的折射率有关 iridescenceI ......
threejs渲染第一个场景和物体
[TOC]  #### 1 基本概念 三维的物体要渲染在二维的屏幕上 ......
Threejs轨道控制器查看物体
[TOC] #### 1 如何360度的查看立方体 上一节，我们讲解了如何渲染出一个立方体物体，但是不能很好的全方位观看立方体。这个时候可以使用控制控制器，让相机围绕立方体运动，就像地球围绕太阳一样运动，去观察立方体。 ##### 1.1 创建轨道控制器 ```js // 创建轨道控制器 const ......