![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
threejs
文章平均质量分 89
搞GIS图形的sky.
三维GIS、图形相关,公众号:sky的数孪技术
展开
-
Threejs中的WebGPU实践(1-2)
更多精彩内容尽在 dt.sim3d.cn ,关注公众号【sky的数孪技术】,技术交流、源码下载请添加VX:digital_twin123此处接上文:Threejs中的WebGPU实践(1-1)原创 2024-08-19 13:26:11 · 494 阅读 · 0 评论 -
Threejs中的WebGPU实践(1-1)
更多精彩内容尽在 dt.sim3d.cn ,关注公众号【sky的数孪技术】,技术交流、源码下载请添加VX:digital_twin123对于一直关注 Three.js 的最新发展的人来说,经常会发现陷入了的未知领域,因为直到现在也没有一些官方的思维导图。事实上,虽然 Three.js 的 WebGPURenderer 能够满足大多数项目要求,但在技术上仍处于未完成的状态,许多其他功能仍处于不断改进、重新开发的过程中。原创 2024-08-19 13:20:00 · 689 阅读 · 0 评论 -
使用 SDF 和 WebGL 塑造镜头模糊效果
介绍如何利用有符号距离场 (SDF) 的功能在 WebGL 中绘制形状并创建交互效果,例如镜头模糊,关注公众号后台回复“SDF镜头模糊”即可获取源码。更多精彩内容尽在,关注公众号【sky的数孪技术】,技术交流、源码下载请添加VX:digital_twin123有符号距离函数 (SDF) 的功能非常强大,这些函数对于渲染复杂的几何和形状以及创建动态视觉效果非常有效。它们简化了边缘检测和形状操作所需的计算,使其成为高级图形应用的理想选择。原创 2024-06-24 09:30:02 · 717 阅读 · 0 评论 -
冰与火时空门特效解析
本文。更多精彩内容尽在,关注公众号:sky的数孪技术,技术交流、源码下载请添加VX:digital_twin123。原创 2024-06-14 13:22:24 · 808 阅读 · 0 评论 -
Three.js 效能要点
本文。更多精彩内容尽在,关注公众号:sky的数孪技术,技术交流、源码下载请添加VX:digital_twin123。原创 2024-06-14 13:20:33 · 850 阅读 · 0 评论 -
【数字孪生平台】光幻示例解析
本文。更多精彩内容尽在,关注公众号:sky的数孪技术,技术交流、源码下载请添加VX:digital_twin123。原创 2024-06-03 14:27:43 · 1024 阅读 · 1 评论 -
使用Three.js绘制快速而逼真的水
GPGPU代表通用图形处理单元(General-Purpose Graphic Processing Unit),意思是用GPU计算图形以外的计算任务。在 Three.js 里,指的是我们使用片段着色器来计算其他内容(例如粒子的位置或速度)的技术。通过使用 GPU(GLSL 着色器)而不是 CPU(Javascript)来进行这些计算,我们可以从并行计算中获得巨大的性能提升。但是我们在 Three.js 中并不经常看到这个术语,更常见的是“帧缓冲区对象”或 FBO 一词。原创 2024-05-11 13:22:11 · 1546 阅读 · 0 评论 -
【数字孪生平台】使用 Three.js 以 3D 形式可视化日本新宿站地图
在本文中,我们将使用日本新宿站的室内地图数据,并使用 Three.js 将其进行 3D 可视化。更多精彩内容尽在。原创 2024-03-29 13:47:23 · 1571 阅读 · 0 评论 -
【数字孪生平台】使用 Three.js 绘制月球陨石坑
在本文中,我们将使用 NASA 发布的月球地形数据“SLDEM2015”在 Three.js 上绘制月球陨石坑。更多精彩内容尽在。原创 2024-03-29 13:46:14 · 1199 阅读 · 0 评论 -
用 Three.js 创建一个酷炫且真实的地球
背景就是插入任何你认为适合的天空盒,我这里使用等距柱状图像来实现。原创 2023-10-14 23:02:37 · 2555 阅读 · 2 评论 -
ThreeJs酷炫的发光特效
分享一个酷炫的发光特效效果,可见。原创 2023-06-20 12:28:05 · 4689 阅读 · 0 评论 -
使用 Three.js 后处理的粗略铅笔画效果
一个自定义通道继承自PasssetSizerender和dispose,我们将主要关注render方法。首先,我们扩展Pass类来创建自己的类,然后再实现我们自己的渲染逻辑。import {从上面代码中可以看出该render方法接受一个对象和两个对象(一个用于写入缓冲区,另一个用于读取缓冲区)。在Three.js中,渲染目标一般是我们可以渲染到场景的纹理,它们用于在通道之间发送数据。readBuffer从先前的渲染通道接收数据,在我们的例子中是默认的RenderPass;则是将数据发送到下一个渲染通道。原创 2023-02-14 21:21:55 · 712 阅读 · 1 评论 -
Three.js中的3D文字效果
对于一些设计网页中经常会出现一些3D的文字效果,本文将利用Three.js实现各种动画WebGL文本输入效果。原创 2023-02-12 18:06:33 · 2672 阅读 · 4 评论 -
Threejs中的Shadow Mapping(阴影贴图)
简而言之,步骤如下:1.从灯光位置视点(阴影相机)创建深度图。2.从相机的位置角度进行屏幕渲染,在每个像素点,比较由阴影相机的MVP矩阵计算的深度值和深度图的值的大小,如果深度图值小的话,则表示该像素点有阴影,就在此处渲染阴影状态。原创 2023-02-10 17:24:01 · 1515 阅读 · 0 评论 -
风机可视化效果实现
风机效果图如上所示,这个效果是网上看到的,就分析了一下。主要用Threejs来实现,大致效果是一个风机,从原来白色表面材质,逐渐过渡到线框效果,并且底部也有一些类似于流线浮动的效果。原创 2023-02-08 09:57:09 · 567 阅读 · 0 评论