web3D项目中，需要对模型进行操作，比如点击模型后，模型高亮，这里用到了射线投射器Raycaster
效果展示
通过鼠标交互—射线拾取实现点击模型，模型高亮实现实例。
threejs 鼠标交互—射线拾取 选中模型高亮
动态效果
threejs版本
0.123.0
射线拾...
yekong
1年前 (2023-07-21)
喜欢
webGL使用threejs实现白雾效果
通过Fog实现雾
// 设置雾化效果，雾的颜色和背景颜色相近，这样远处网格线和背景颜色融为一体
scene.fog = new THREE.Fog(0xffffff, -100, 1000);
背景
通过和雾类似的背景来和雾搭配使用。
...
yekong
1年前 (2023-07-21)
喜欢
Three.js的Raycaster（射线投射器）是一个用于检测场景中物体与射线相交的工具。它可以用于实现鼠标拾取、碰撞检测、交互式选择等功能。Raycaster通过从指定的原点（如摄像机位置）发射射线，来检测射线与场景中物体的相交情况。Raycaster射线投射在3d模型中使用...
yekong
1年前 (2023-07-21)
喜欢
THREE.Fog 是 Three.js 中用于实现线性雾化效果的类。它的用法、参数和一个简单的使用实例如下：
用法：
创建 THREE.Fog 对象：
const fog = new THREE.Fog(color, near, far);
参数：
color：表示雾化的颜...
yekong
1年前 (2023-07-21)
喜欢
课程概述
《物联网Web3D可视化WebGL》讲解如何实现物联网Web3D可视化效果，比如你想实现一个粮仓或园区的Web3D可视化效果，主要使用WebGL的3D引擎Threejs开发实现。
学习本课程有前端基础即可，如果了解three.js更好
学习建议：一定要结合每节课提供的...
yekong
1年前 (2023-07-20)
喜欢
vue3 vite 数据大屏项目在进行接口调用的时候，会遇到跨域问题,报如下错误：
Access to XMLHttpRequest at https://www.wanjunshijie.com" from origin "http://localhost:8...
yekong
1年前 (2023-07-20)
喜欢
跨域（Cross-Origin）是指在浏览器中，一个网页的代码所在的域（协议、主机和端口）与该网页请求的资源所在的域不一致，这种情况下浏览器会限制页面的访问，防止潜在的安全风险。跨域问题出现的原因是浏览器的同源策略（Same-Origin Policy）。
同源策略要求网页只能访...
yekong
1年前 (2023-07-20)
喜欢
Vue Vite 和 Webpack 是两种用于构建前端项目的工具，它们有一些区别和特点。
构建速度：
Vue Vite：Vite 是一种基于原生 ES 模块的构建工具，利用浏览器对 ES 模块的原生支持，不需要进行打包和编译，因此启动速度非常快，可以实现秒级的热更新。
Web...
yekong
1年前 (2023-07-20)
喜欢
在Vue项目中初始化一个Webpack项目，通常使用Vue CLI（Command Line Interface）工具来帮助我们快速创建和配置一个基本的Webpack项目。Vue CLI提供了一套预定义的项目模板和脚手架，方便我们开始一个新的Vue项目。
以下是使用Vue CLI...
yekong
1年前 (2023-07-20)
喜欢
最近的项目，都要求使用vue3来开发， 正好也实践一下vite，我们也可以了解一下vite和webpack的区别
创建命令
npm init vite@latest
输入项目名称
执行完上面的命令后，会让输入项目名称，这里我们直接默认，如果需要修改的话，自行输入自己想要的名称就...
yekong
1年前 (2023-07-20)
喜欢
