{"id":14981240,"url":"https://github.com/zhangbo126/threejs-3dmodel-edit","last_synced_at":"2025-05-16T09:04:05.529Z","repository":{"id":180423382,"uuid":"664702806","full_name":"zhangbo126/threejs-3dmodel-edit","owner":"zhangbo126","description":"基于three.js开发的3D模型可视化编辑器 包含模型加载，模型文件导入导出，模型背景图，全景图，模型动画，模型灯光，模型定位，辅助线，模型辉光，模型拖拽，模型拆解， 模型材质等可视化操作编辑系统，模型编辑数据保存预览和代码嵌入 前端技术:Vue3+Typescript+Pinia+Threejs","archived":false,"fork":false,"pushed_at":"2025-05-12T15:32:51.000Z","size":250390,"stargazers_count":334,"open_issues_count":1,"forks_count":67,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-05-12T16:47:54.260Z","etag":null,"topics":["3d-models","three-edit","three-js","three-preview","three-view","three-vue","threejs","threejs-learning","threejs-view","threejs3d","threejs3d-model","webgl"],"latest_commit_sha":null,"homepage":"https://three3d-0gte3eg619c78ffd-1301256746.tcloudbaseapp.com/threejs-3dmodel-edit/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mulanpsl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zhangbo126.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2023-07-10T14:58:20.000Z","updated_at":"2025-05-12T15:32:55.000Z","dependencies_parsed_at":"2024-12-04T02:32:36.215Z","dependency_job_id":"90a9b64a-5fb5-40fd-b15a-3f572f361e2a","html_url":"https://github.com/zhangbo126/threejs-3dmodel-edit","commit_stats":{"total_commits":279,"total_committers":6,"mean_commits":46.5,"dds":0.2724014336917563,"last_synced_commit":"85b392940549efb33251f3ed25ad6ed4260da6fc"},"previous_names":["zhangbo126/three3d-view","zhangbo126/threejs-3dmodel-edit"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhangbo126%2Fthreejs-3dmodel-edit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhangbo126%2Fthreejs-3dmodel-edit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhangbo126%2Fthreejs-3dmodel-edit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhangbo126%2Fthreejs-3dmodel-edit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zhangbo126","download_url":"https://codeload.github.com/zhangbo126/threejs-3dmodel-edit/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254501556,"owners_count":22081528,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["3d-models","three-edit","three-js","three-preview","three-view","three-vue","threejs","threejs-learning","threejs-view","threejs3d","threejs3d-model","webgl"],"created_at":"2024-09-24T14:03:11.615Z","updated_at":"2025-05-16T09:04:00.518Z","avatar_url":"https://github.com/zhangbo126.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"### 🌱 基于 Three.js+Vue3+Typescript+Element-Plus 开发的 3d 模型可视化编辑系统\n\n\u003ca href='https://gitee.com/ZHANG_6666/Three.js3D/stargazers'\u003e\u003cimg src='https://gitee.com/ZHANG_6666/Three.js3D/badge/star.svg?theme=dark' alt='star'\u003e\u003c/img\u003e\u003c/a\u003e \u003ca href='https://gitee.com/ZHANG_6666/Three.js3D/members'\u003e\u003cimg src='https://gitee.com/ZHANG_6666/Three.js3D/badge/fork.svg?theme=dark' alt='fork'\u003e\u003c/img\u003e\u003c/a\u003e\n\n\u003ca target=\"_black\" href=\"https://github.com/zhangbo126/threejs-3dmodel-edit\"\u003e\n\u003cimg alt=\"github-starts\" src=\"https://img.shields.io/github/stars/zhangbo126/threejs-3dmodel-edit?style=social\"\u003e\n\u003c/a\u003e\n\u003ca target=\"_black\" href=\"https://github.com/zhangbo126/threejs-3dmodel-edit\"\u003e\n\u003cimg alt=\"github-fork\" src=\"https://img.shields.io/github/forks/zhangbo126/threejs-3dmodel-edit?style=social\"\u003e\n\u003c/a\u003e\n\n### 📦️ 分支介绍\n\n1. master: `Vue3+Pinia+Javascript` (最新的功能 issues 和修复的 bug 都在这个分支)\n2. ts-master: `Vue3+Pinia+Typescript` (master 分支的 typescript 版本,最新版本的ts代码正在开发中ing...)\n3. develop: `Vue3+Pinia+Javascript` (一些不确定的功能和代码重构会在这个分支开发)\n4. gh-pages: `git-pages 线上包分支` (忽略即可)\n\n### 🌐 安装/启动/打包(详见 package.json)\n\n```\n yarn  / yarn serve  / yarn build(yarn build:pro)\n\n pnpm install / pnpm serve / pnpm build(pnpm build:pro)\n\n```\n\n### 🎨 预览\n\n- 1.注意:部分模型文件较大,首次加载需要等待较长时间\n- 2.线上访问:[https://zhangbo126.github.io/threejs-3dmodel-edit/](https://three3d-0gte3eg619c78ffd-1301256746.tcloudbaseapp.com/threejs-3dmodel-edit/)\n- 3.关于打包部署服务端:在 vite.config.js 里修改 base 路径来适配当前的域名路径\n\n### 项目地址\n\n- 1. github:[https://github.com/zhangbo126/threejs-3dmodel-edit](https://github.com/zhangbo126/threejs-3dmodel-edit)\n- 2. gitee:[https://gitee.com/ZHANG_6666/Three.js3D](https://gitee.com/ZHANG_6666/Three.js3D)\n\n### 🎵 主要技术栈\n\n| 名称                     | 版本    | 名称         | 版本  |\n| ------------------------ | ------- | ------------ | ----- |\n| Vue                      | 3.5.13  | Axios        | 1.5.0 |\n| Vite                     | 4.3.x   | Element-plus | 2.4.x |\n| Three                    | 0.169.x | Pinia        | 2.1.x |\n| Vue3-Draggable-Resizable | 1.6.x   | Mitt         | 3.0.x |\n| 详见 `package.json`      | 😁      | 🥰           | 🤗    |\n\n### 🌺 开发环境:\n\n| 名称 | 版本    | 名称    | 版本   |\n| ---- | ------- | ------- | ------ |\n| node | 21.3.0  | npm     | 10.2.4 |\n| yarn | 1.22.21 | windows | 10     |\n| pnpm | 9.15.1  | windows | 10     |\n\n### 🍻 问题/功能\n\n1. 任何问题 bug 和功能需求欢迎提 issues\n2. 更多功能持续更新中...\n3. 当前项目three.js版本跟随官方版本持续同步，如有版本升级导致bug请提issues\n\n### 🗃️ 功能模块介绍\n\n| 模块名称🚀     | 功能简介         | 功能简介                  | 功能简介                           | 功能简介          |\n| -------------- | ---------------- | ------------------------- | ---------------------------------- | ----------------- |\n| 背景           | 背景图加载       | 全景图加载                | 外部全景图（hdr,jpeg,png）         | 外部视频（video） |\n| 材质           | 材质类型切换     | 材质选中效果              | 材质属性修改（颜色，网格，透明度） | 材质贴图修改      |\n| 后期处理       | 模型分解         | 模型材质拖拽，缩放，平移  | 辉光效果（颜色，强度，半径 ）      |                   |\n| 模型灯光       | 环境光编辑       | 平行光编辑                | 点光源编辑                         | 聚光灯编辑        |\n| 模型动画       | 动画播放         | 动画配置修改              | 动画轴旋转（x,y,z）                |                   |\n| 辅助线/轴配置  | 轴旋转（x,y,z）  | 模型位置修改              | 网格辅助线                         | 坐标轴辅助线      |\n| 几何体模型配置 | 几何体模型选中   | 几何体模型配置修改        |                                    |                   |\n| 3d标签配置     | 标签拖拽加载渲染 | 标签选中                  | 标签内容编辑                       |                   |\n| 多模型配置     | 多模型选中效果   | 多模型位置,轴旋转修改     | 多模型大小缩放                     |                   |\n| 左侧操作栏     | 编辑模型场景切换 | 几何体模型添加            | 外部模型加载                       | 多模型拖拽        |\n| 顶部操作栏     | 模型预览         | 模型导出（.glb,obj,usdz） | 嵌入代码                           | 编辑数据保存      |\n| 模型库         | 模型编辑效果展示 | 模型拖拽添加              | three.js3d模型在可视化大屏上展示   |                   |\n\n### 💥 注意\n\n1. 部分功能的使用对电脑的内存依赖较高，如有卡顿等场景请确保有足够的内存使用空间\n2. 建议使用谷歌浏览器`（chrome）`\n3. 模型数据编辑配置存储在`localStorage`如有数据相关报错清除本地数据缓存重新进入即可\n4. 外部模型不支持效果预览，和数据保存\n5. 3d 模型对性能依赖较高,模型库组件配置过`(\u003e4)`,可能导致浏览器崩溃\n6. 部分特殊模型文件和大模型文件加载可能会导致系统卡顿很长时间,如遇到这种情况`（欢迎提issues）`\n\n### 💚 如果觉得该项目对你有帮助留个 star 也是不错的 ⭐\n\n### 🥰 或者请作者喝杯咖啡吧,这将是我持续更新的动力,相信这肯定比打赏主播更有意义\n\n![输入图片说明](public/image/code.jpg)\n\n### 🥰又或者该↓项目能满足你的需求,也可联系咨询作者购买vx:answer_2027\n\n\u003c!-- Start of Selection --\u003e\n\n**3D模型场景编辑器 : [淘宝链接](https://item.taobao.com/item.htm?ft=t\u0026id=906085738255\u0026spm=a21dvs.23580594.0.0.621e2c1brvhsYX)**\n\n\u003c!-- End of Selection --\u003e\n\n### 👷 界面\n\n![输入图片说明](public/image/1.png)\n![输入图片说明](public/image/2.png)\n![输入图片说明](public/image/3.png)\n![输入图片说明](public/image/4.png)\n![输入图片说明](public/image/6.png)\n![输入图片说明](public/image/7.png)\n![输入图片说明](public/image/8.png)\n\n### 🍻 相关链接\n\n###### Three.js:[https://threejs.org/](https://threejs.org/)\n\n###### Element-Plus:[https://element-plus.gitee.io/zh-CN/](https://element-plus.gitee.io/zh-CN/)\n\n###### 模型下载网站 [https://sketchfab.com/feed](https://sketchfab.com/feed)\n\n###### 贴图素材网站 [https://polyhaven.com/](https://polyhaven.com/)\n\n###### 图片格式转换网站 [https://onlineconvertfree.com/zh/convert/hdr/](https://onlineconvertfree.com/zh/convert/hdr/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzhangbo126%2Fthreejs-3dmodel-edit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzhangbo126%2Fthreejs-3dmodel-edit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzhangbo126%2Fthreejs-3dmodel-edit/lists"}