threejsAnimation: 基于threejs开发的动画案例

6月21日 Gitee Talk | 模力方舟 AI 应用沙龙 · 青岛站开放报名，来聊聊 AI+ 应用的多场景落地实践~

加入 Gitee

与超过 1200万开发者一起发现、参与优秀开源项目，私有仓库也完全免费：）

该仓库未声明开源许可证文件（LICENSE），使用请关注具体项目描述及其代码上游依赖。

克隆/下载

删除多余文件 ca1eff1

手柄控制摄像头跟踪

相机适配不同尺寸模型

.env.production

package-lock.json

Loading...

README

此项目使用vitejs开发，不过不了解`vite`也没关系，实现的内容与`vite`并无很大的依赖性。

此项目为广大不同平台使用者考虑，均以`typescript`语言开发，入口文件为`src/pages/content/main.ts`

可将`main.ts`中的内容迁移到自己的业务逻辑，或者直接在自己的`vite`，`vue`，`umi`等项目中去使用。

## 静态地址说明

文件中配置了静态资源地址，`npm run dev`启动项目时，环境默认为`.env`中的本地地址，
如需部署到服务器上，请修改`.env.production`文件，部署环境地址默认作者oss地址（非指定网站不可访问）。

## 安装依赖

yarn

```bash
npm install
```

或

```bash
yarn install
```

## 安装环境

仅供参考

```bash
node -v
v18.19.0
```

[vitejs官网](https://cn.vitejs.dev/guide/#scaffolding-your-first-vite-project)

## 启动

```bash
yarn dev
```

```bash
npm run dev
```

## 打包

``` bash
npm run build
```

启动成功后默认[访问](http://localhost:5173/) (如端口5173被占用可根据控制台提示自行选择地址)

> 文中使用大量的canvas渲染和模型的加载，对于电脑的gpu性能要求较高，如体验最佳效果，建议使用高性能电脑进行测试。另页面中涉及体积比较大的模型文件，首次加载会比较慢

基于threejs开发的动画案例

README

取消

暂无发行版

TypeScript 70.9% JavaScript 23.9% HTML 3.3% CSS 1.9%

马建仓 AI 助手

尝试更多

代码解读

代码找茬

代码优化

1

https://gitee.com/sunhuapeng/threejs-animation.git

git@gitee.com:sunhuapeng/threejs-animation.git

sunhuapeng

threejs-animation

threejsAnimation

master