bosombaby / web3d-product

这个Github开源仓库是基于three.js技术的，包含了多个案例，如粒子特效、二维漫画、可视化和实践项目等。无论你是想学习如何使用three.js创建炫酷的3D场景，还是寻找实用的示例代码，这个仓库都会是一个不错的选择。同时，里面还提供了一些实践项目，可以帮助你更深入地了解three.js在实际项目中的运用。无论你是初学者还是有一定经验的开发者，这个开源仓库都值得你去探索！

作品展示平台

一、前言

概述：基于WebGL的三维引擎，目前是国内资料最多、使用最广泛的三维引擎，可以制作一些3D可视化项目

目前随着元宇宙概念的爆火，THREE技术已经深入到了物联网、VR、游戏、数据可视化等多个平台。

最近一段时间主要对之前学习three.js的总结和记录，记录只对自己觉得重要的部分记录，其他的可以参考别的平台资源。

目前作品的相关展示平台已上线：VR_Team作品展示平台，欢迎大家查看。

项目开源地址：web3d-product，下面为一部分的网页的作品展示。

二、作品展示

粒子特效

在线预览：粒子平面墙

在线预览：迷失太空

在线预览：粒子海浪

在线预览：银河系

二维漫画

在线预览：漫画-蜘蛛侠

可视化

在线预览：电脑主机拆解

后期处理

在线预览：后期处理-虚幻花朵

三、项目使用流程

3.1 项目结构

功能说明

• public文件夹：存放一些独立的案例界面（html格式），不需要依赖，可以直接运行在网页
  • assets存在依赖的资源
  • Basic：基础界面
  • Comic：二维漫画
  • Particles：粒子效果
  • Processing：后期chuli
  • Visualization：可视化
• src
  • views：功能主界面

3.2 基本使用

//安装依赖
npm i
//运行项目
npm run dev

3.3 项目模板

该模板集成最简单的一个three.js环境，在此基础上可以自行搭建。

3.4 技术栈

前端：vue + three.js + js