技术栈
three
大橙子额
7 天前
前端
·
javascript
·
vue.js
·
three
vue安装three之后报错You may need an appropriate loader to handle this file type
如下图所示：Three.js 版本过高：从 r125+ 开始，Three.js 全面采用 ES6 类语法，而默认 Webpack 配置不处理 node_modules/three/ 中的现代 JS 语法。
军军君01
12 天前
前端
·
javascript
·
vue.js
·
typescript
·
前端框架
·
echarts
·
three
数字孪生监控大屏实战模板：商圈大数据监控
前端数字孪生大屏，使用VUE3+Elementplus+Echarts+TS实现商圈大数据监控大屏，数字孪生，监控大屏展示，可下载作为课堂作业、界面模板、扩展开发，个人作品等。 若想系统学习Echarts开发，我的课程提供了完整的Echarts基础知识讲解并附加大量实战案例，系列课程地址如下： 1. CSDN课程：https://edu.csdn.net/course/detail/40842 2. 51学堂课程：https://edu.51cto.com/course/40414.html 3
军军君01
3 个月前
前端
·
javascript
·
vue.js
·
学习
·
3d
·
前端框架
·
three
Three.js基础功能学习十三：太阳系实例上
使用实际的尺寸作为各个元素的大小及坐标，使用随机生成的方式生成星空背景及各个星空的颜色，使用指定的几何图形生成星河/各个星系/黑洞/恒星等。
军军君01
3 个月前
前端
·
javascript
·
学习
·
3d
·
threejs
·
three
·
三维
Three.js基础功能学习十二：常量与核心
本章介绍threejs的常量与核心内容，包括各种常量定义以及核心类，包括各个基础类及公共的类等。three.js学习及项目实战：核心内容
军军君01
4 个月前
前端
·
javascript
·
3d
·
前端框架
·
three
·
三维
·
前端编程
Three.js基础功能学习八：数学库与插值
本章介绍threejs的数学库及插值相关内容，包括工具类、常见数据结构的封装类及插值计算等内容。three.js学习及项目实战：数学库学习
军军君01
4 个月前
开发语言
·
前端
·
javascript
·
3d
·
typescript
·
three
·
三维
Three.js基础功能学习四：摄像机与阴影
在three.js中最常用的摄像机并且之前我们一直用的摄像机是透视摄像机 PerspectiveCamera，它可以提供一个近大远小的3D视觉效果. 阴影贴图的工作方式就是具有投射阴影的光能对所有能被投射阴影的物体从光源渲染阴影。
军军君01
4 个月前
开发语言
·
前端
·
javascript
·
学习
·
3d
·
前端框架
·
three
Three.js基础功能学习五：雾与渲染目标
在3D引擎里，雾通常是基于离摄像机的距离褪色至某种特定颜色的方式。在three.js中添加雾是通过创建 Fog 或者 FogExp2 实例并设定scene的fog 属性。 Fog 让你设定 near 和 far 属性，代表距离摄像机的距离。任何物体比 near 近不会受到影响，任何物体比 far 远则完全是雾的颜色。在 near 和 far 中间的物体，会从它们自身材料的颜色褪色到雾的颜色。 FogExp2 会根据离摄像机的距离呈指数增长。 在three.js中，渲染目标大体上指的是可以被渲染
军军君01
4 个月前
前端
·
javascript
·
3d
·
前端框架
·
three
·
三维
·
三维框架
Three.js基础功能学习三：纹理与光照
纹理一般是指我们常见的在一些第三方程序中创建的图像，如Photoshop或GIMP。 OrbitControls 让我们可以围绕某一个点旋转控制相机。OrbitControls 是 three.js 的可选模块，所以我们首先需要引入这个模块。
军军君01
4 个月前
前端
·
javascript
·
学习
·
3d
·
材质
·
three
·
三维
Three.js基础功能学习二：场景图与材质
场景图在 3D 引擎是一个图中节点的层次结构，其中每个节点代表了一个局部空间（local space）。 Three.js提供了多种类型的材质（material）。它们定义了对象在场景中的外型。你使用哪种材质取决于你想达到的目的。
百锦再
8 个月前
开发语言
·
javascript
·
学习
·
3d
·
three
·
2d
·
gbl
每天两小时学习three.js
总览：这个阶段的目标是理解核心概念，并能让一个3D场景在浏览器中跑起来。第1周：环境搭建与第一个场景第2-3周：光源、材质与动画
Tiffany_Ho
1 年前
3d
·
three
【threejs】每天一个小案例讲解：创建基本的3D场景
GitHub - TiffanyHoo/three_practices: Learning three.js together!
美食制作家
1 年前
javascript
·
three
【无标题】Threejs第一个3D场景
第一步得安装和引入Threejs创建实列对象创建3D场景对象创建几何形状这些都是基本上常用的形体创建材质
优雅永不过时·
1 年前
前端
·
javascript
·
学习
·
编辑器
·
three
Three.js编辑器百度搜索 Top 1
低代码的开发是非常曲折的，尤其是早期根本没有任何参考作品或者 相关的一些知识博客去引领我们去做，会经历多次的推到再到重头再来，又需要开发者有很高的知识储备，举步维艰。，目前 web 二维 在市场上已经非常普遍，而web 三维低代码普及率并不是很高。 以下是我的一些的编辑器功能分布，希望能对你有一些启发，让你少走一些弯路。
咔咔库奇
1 年前
开发语言
·
javascript
·
three.js
·
贴图
·
three
【three.js】纹理贴图
目录1.纹理贴图2.纹理过滤3.UV映射原理3.1纹理UV坐标3.2纹理映射4.纹理阵列，偏移和旋转4.1纹理阵列
咔咔库奇
1 年前
three.js
·
three
【three.js】模型-几何体Geometry,材质Material
在现实开发中，有时除了需要用代码创建模型之外，多数场景需要加载设计师提供的使用设计软件导出的模型。此时就需要使用模型加载器去加载模型，不同格式的模型需要引入对应的模型加载器，虽然加载器不同，但是使用方式基本上是相同的。下面就是使用 OBJLoader 加载 .obj 格式模型的过程
程序员_三木
1 年前
开发语言
·
前端
·
javascript
·
ecmascript
·
three
使用 Three.js 创建圣诞树场景
今天带大家一起实现一个圣诞树，先看下效果创建场景的目的是构建 3D 空间的容器，用于承载各种 3D 对象和光源。
六卿
1 年前
javascript
·
three.js
·
three
1、Three.js开端准备环境
1.安装 VSCode 2.安装 Node.js 3.查看Three.js最新版本 4.如何cdn引入： https://cdn.jsdelivr.net/npm/three@v版本号/build/three.module.js 例如：https://cdn.jsdelivr.net/npm/three@v0.170.0/build/three.module.js
六卿
1 年前
javascript
·
three.js
·
three
2、Three.js初步认识场景Scene、相机Camera、渲染器Renderer三要素
有了虚拟场景Scene，相机录像Camera，在相机小屏幕上看到的RendererScene当前空间 Mesh人在场景 Camera相机录像 Renderer显示器上 首先先描述下Scene： 这个场景为三要素之一，一切需要展示的东西都需要添加到Scene里面，也就是画布，你需要在页面展示的东西都需要add到Scene中， 在场景里面我们可以添加 Mesh网格模型、光源等
优雅永不过时·
1 年前
前端
·
javascript
·
react.js
·
webgl
·
threejs
·
three
Three.js 原生 实现 react-three-fiber drei 的 磨砂反射的效果
Three.js 原生 实现 react-three-fiber drei 的 磨砂反射的效果
优雅永不过时·
1 年前
前端
·
javascript
·
css3
·
threejs
·
three
three.js 实现 css2d css3d效果 将 二维Dom 和 三维场景结合
three.js 实现 css2d css3d效果 将 二维Dom 和 三维场景结合预览