做GIS梦的人

最近在开发一个功能，在三维场景里有很多模型，需要点击模型，高亮对应的模型，代表选中了该模型。做起来还是稍微麻烦一些的。

Three.js 实现点击模型改变颜色想实现点击模型，改变模型颜色的效果。在网上看了一些代码，发现特别搞笑，很多的博客给出的计算代码都是错误的，根本无法实现点击效果，还在不同的博客相互的复制，只能感叹抄袭党太多。下面我简单的介绍一些我的方法，我是在Vue中开发的。文章目录Three.js 实现点击模型改变颜色三维空间点击事件的原理环境准备代码实现效果展示注意事项三维空间点击事件的原理在三维空间内判断鼠标点击的是哪个模型，核心的原理还是射线碰撞，*即从相机（camera）的中心点到屏幕上鼠标点组成

three.js 实现管道流动特效想在系统里实现在管道上指示水或液体的流向，在网上查阅了很多资料，也是经历的比较多的麻烦。网上部分代码不可用，还有一部分代码使用定时器实现，流动效果比较卡段这里给大家分享一下。文章目录three.js 实现管道流动特效环境准备代码展示效果展示注意环境准备基于vue的环境准备，可以参考我之前的博文基于管道体模型的加载，可以参考这篇使用Three.js 展示管道体TubeGeometry代码展示<template> <div id="a

使用Three.js 展示管道体TubeGeometry网上关于使用Three.js加载管道体的demo，不少，但是没有完整的例子，很多都是基于老旧代码运行的，。这里我使用基于Vue的场景，展示一下如何显示管道体。文章目录使用Three.js 展示管道体TubeGeometry环境准备编码1. 自定义随机路径类2. 场景展示效果展示环境准备基于vue的环境准备，可以参考我之前的博文编码1. 自定义随机路径类import { Vector3, Curve} from 'th

在上一篇博文中，介绍了如果使用three.js加载gltf三维模型。这里介绍一下如何加载Obj模型。其实原理和方法都是类似的，只是换了一个解析的依赖 OBJLoader.js。多余的代码，不再写了，可以参考上一篇博文。依赖OBJLoader.jsimport { BufferGeometry, FileLoader, Float32BufferAttribute, Group, LineBasicMaterial, LineSegments, Loader, Material, .

用Three.js实现的粒子系统，主要是用图片做的纹理，有下雨、下雪、星空等效果，很多参数可以自己控制。 --> var scene, camera, renderer, spot1, stats; var cloud, controls;