archive-gh-me/ShadowEditor
1
0
Fork 0
mirror of https://github.com/tengge1/ShadowEditor.git synced 2026-01-25 15:08:11 +00:00
Code Issues Projects Releases Wiki Activity
ShadowEditor/README-tw.md
tengge1 7814115165 删除多余的说明文件。
2019-08-02 20:33:30 +08:00

19 KiB
Raw Blame History

Shadow Editor

Language: 中文 / 繁體中文 / English

  • 名稱：Shadow Editor
  • 版本：v0.1.8(開發中)
  • 簡介：基於three.js的場景編輯器。

v0.1.8即將更新

  1. 設置面板放到選項菜單中。
  2. 新增色調旋轉(hue-rotate)、飽和度、亮度、高斯模糊(blur)、對比度、灰度、顏色反轉(invert)、復古(sepia)濾鏡。
  3. 濾鏡設置保存在場景配置中，並在編輯器和播放器解析。

v0.1.7更新

  • 發布日期：2019年3月23日
  • 更新日誌：
  1. 修復物體改變後，場景樹狀圖無法及時響應，無法記住樹節點展開狀態，樹節點順序錯亂的bug。
  2. 物體名稱超長自動顯示省略號。鼠標移到節點上，顯示完整名稱。
  3. 新增全屏播放功能、新窗口播放功能。播放器和編輯器徹底解除耦合，播放器可獨立運行。
  4. 可將編輯好的場景嵌入iframe運行。地址：/view.html?sceneID=sceneID。可使用新窗口播放功能獲取該地址。
  5. 物體選中效果優化：等寬描邊。
  6. 修復整理模型工具，複製模型時未復製文件夾中所有文件的bug。
  7. 所有設置改為存儲在localStorage中，不再保存在場景配置中。
  8. 重構平行光幫助器、半球光幫助器、點光源幫助器、矩形光幫助器、聚光燈幫助器，採用事件驅動方式，不再對編輯器嚴重依賴。
  9. 整理文件夾結構。重寫歷史面板模塊，徹底刪除耦合度高的Outliner控件。
  10. 英文翻譯優化。
  11. 新增場景一鍵導出功能，自動分析場景所需模型和資源，所有所需資源放在/temp/yyyyMMddHHmmss文件夾。
  12. 導出不帶資源的編輯器功能。
  13. 重新發布了演示項目：Gitee GitHub
  14. 修復渲染器設置中，陰影、γ輸入、γ輸出、γ因子設置無效bug。
  15. 平面上點、線、噴塗工具一次只能繪製一個。
  16. 修復補間動畫無法播放問題。

項目截圖

溫馨小窩。

image

image

點擊此處查看更多截圖。

                                                                                                                               
源碼GitHub碼雲文檔GitHub碼雲
演示GitHub碼雲數據庫及資源百度網盤20190116提取碼：n8je

主要功能

  1. 基於three.js/WebGL的3D場景在線編輯器，服務端使用MongoDB保存動畫、音頻、類別、角色、貼圖、材質、網格模型、粒子、預設體、場景數據。
  2. 內置幾何體：平面、正方體、圓、圓柱體、球體、二十面體、輪胎、紐結、茶壺、酒杯、精靈、文本；線段、CatmullRom曲線、二次貝塞爾曲線、三次貝塞爾曲線、橢圓曲線。
  3. 內置光源：環境光、平行光、點光源、聚光燈、半球光、矩形光。
  4. 支持多種不同3D格式模型和動畫導入。支持3ds、3mf、amf、assimp(anim)、awd、babylon、binary、bvh(anim)、collada、ctm、draco 、fbx(anim)、gcode、gltf(anim)、js(anim)、json(anim)、kmz、lmesh(anim)、md2、mmd (anim)、nrrd、obj、pcd、pdb、ply、prwm、sea3d(anim)、stl、vrm、vrml、vtk 、x 31種3D文件格式，帶anim的表示支持動畫。多種3D文件同時支持json和二進制格式。 mmd文件同時支持pmd和pmx格式，支持vmd格式的模型和相機動畫。它也是唯一支持lmesh(lolking網站lol模型)的編輯器。
  5. 內置材質：線條材質、虛線材質、基本材質、深度材質、法向量材質、蘭伯特材質、馮氏材質、點雲材質、標準材質、物理材質、精靈材質、著色器材質、原始著色器材質。
  6. 支持紋理：顏色紋理、透明紋理、凹凸紋理、法線紋理、位移紋理、鏡面紋理、環境紋理、光照紋理、遮擋紋理、自發光紋理。
  7. 支持貼圖：圖片、立方體貼圖、視頻貼圖。
  8. 內置組件：背景音樂、粒子發射器、天空、火焰、水、煙、布組件。
  9. 可視化修改場景、相機等物體屬性，提供40多種不同修改面板。
  10. 在線編輯js腳本、著色器程序，帶智能提示。
  11. 自帶播放器，實時演示場景動態效果，支持全屏和新窗口播放，可以直接嵌入項目iframe中。
  12. 支持補間動畫、骨骼動畫、粒子動畫、mmd動畫、lmesh動畫（lolking網站lol模型）。
  13. 支持場景、模型、貼圖、材質、音頻、動畫、粒子、預設體、角色資源管理，支持自定義分類，根據漢字和拼音快速搜索。其中，粒子、預設體、角色資源管理暫未實現相應功能。
  14. 支持第一視角控制器、飛行控制器、軌道控制器、指針鎖定控制器、軌跡球控制器5種控制器。
  15. 支持點陣化特效、顏色偏移特效、殘影特效、背景虛化、快速近似抗鋸齒(FXAA)、毛刺特效、半色調特效、全屏抗鋸齒(SSAA)、像素特效、可擴展環境光遮擋(SAO)、多重採樣抗鋸齒(SMAA)、屏幕空間環境光遮蔽(SSAO)、時間抗鋸齒(TAA)。
  16. 提供歷史記錄和日誌功能，支持撤銷、重做。
  17. 支持導出gltf、obj、ply、stl模型。
  18. 支持bullet物理引擎。正方體、圓形、圓柱體、二十面體、酒杯、平面、球體、茶壺、輪胎、紐結和加載的模型都支持剛體組件。支持可視化設置碰撞體形狀（正方體、球體）、質量和慣性。
  19. 具有平移、旋轉、縮放、在物體表面繪製點、線、貼花的工具，實時統計場景種物體、頂點、三角形數量。
  20. 支持場景一鍵導出功能。
  21. 中英文雙語支持。
  22. 支持色調旋轉(hue-rotate)、飽和度、亮度、高斯模糊(blur)、對比度、灰度、顏色反轉(invert)、復古(sepia)濾鏡。
  23. 支持版本控制。

使用指南

該項目僅支持Windows系統，電腦上需要安裝.Net Framework 4.5。

推薦使用最新版谷歌瀏覽器，不保證兼容其他瀏覽器。

  1. 安裝NodeJs，在最外層目錄，執行以下命令。
npm install
npm run build
  1. 下載MongoDB，安裝並啟動MongoDB服務。 MongoDB服務的默認端口為27017。
mongod --dbpath=D:\mongodb\db --logpath=D:\mongodb\log\mongoDB.log --install --serviceName MongoDB
net start MongoDB
  1. 編輯文件ShadowEditor.Web/Web.config，將27017修改為你電腦上MongoDB服務的端口。
<add key="mongo_connection" value="mongodb://127.0.0.1:27017" />

  1. 使用Visual Studio 2017打開項目，生成ShadowEditor.Web項目。

  2. 將ShadowEditor.Web部署在iis上即可在瀏覽器中訪問。

  3. 為了保存各種類型文件能正常下載，需要在iis上添加以下兩個MIME類型。

文件擴展名 MIME類型 說明
.* application/octet-stream 各種格式後綴文件
. application/octet-stream 無後綴文件
  1. 編譯文檔，請安裝gitbook。
npm install -g gitbook-cli

然後切換到docs-dev目錄，安裝gitbook插件。

gitbook install

然後切換到上級目錄，執行以下命令生成文檔。

npm run build-docs

常見問題

  1. 上傳模型時為什麼都是上傳失敗？

需要把模型貼圖等資源壓縮成一個zip包，而且入口文件不能嵌套文件夾。服務端會解壓上傳的zip包放到~/Upload/Model文件下，並在MongoDB _Mesh表裡添加一條數據。

  1. 如何將多個模型組合在一起？

基本幾何體都支持多層嵌套。可以添加一個 組（在幾何體菜單中），然後在場景樹狀圖上，將多個模型拖動到 組 上。

更新日誌

v0.1.7

  • 發布日期：2019年3月23日
  • 更新日誌：
  1. 修復物體改變後，場景樹狀圖無法及時響應，無法記住樹節點展開狀態，樹節點順序錯亂的bug。
  2. 物體名稱超長自動顯示省略號。鼠標移到節點上，顯示完整名稱。
  3. 新增全屏播放功能、新窗口播放功能。播放器和編輯器徹底解除耦合，播放器可獨立運行。
  4. 可將編輯好的場景嵌入iframe運行。地址：/view.html?sceneID=sceneID。可使用新窗口播放功能獲取該地址。
  5. 物體選中效果優化：等寬描邊。
  6. 修復整理模型工具，複製模型時未復製文件夾中所有文件的bug。
  7. 所有設置改為存儲在localStorage中，不再保存在場景配置中。
  8. 重構平行光幫助器、半球光幫助器、點光源幫助器、矩形光幫助器、聚光燈幫助器，採用事件驅動方式，不再對編輯器嚴重依賴。
  9. 整理文件夾結構。重寫歷史面板模塊，徹底刪除耦合度高的Outliner控件。
  10. 英文翻譯優化。
  11. 新增場景一鍵導出功能，自動分析場景所需模型和資源，所有所需資源放在/temp/yyyyMMddHHmmss文件夾。
  12. 導出不帶資源的編輯器功能。
  13. 重新發布了演示項目：Gitee GitHub
  14. 修復渲染器設置中，陰影、γ輸入、γ輸出、γ因子設置無效bug。
  15. 平面上點、線、噴塗工具一次只能繪製一個。
  16. 修復補間動畫無法播放問題。

v0.1.6

  • 發布日期：2019年3月10日
  • 更新日誌：
  1. 使用xtype.js，採用非侵入式開發方式重構UI框架。
  2. 主框架使用絕對定位重新佈局。
  3. 底部面板支持最大化和還原。
  4. 底部面板顯示資源統計信息。
  5. 蒐集整理大量貼圖和模型，並進行分類。
  6. 整理貼圖工具。
  7. 整理模型工具。
  8. 整理縮略圖工具。
  9. 添加點光源，默認不再添加圓球和光暈。
  10. 添加半球光，默認不再添加天空球。
  11. 添加矩形光，默認不再添加矩形白色屏幕。
  12. 由於原來的選中效果是使用後期處理實現的，產生了嚴重性能損耗和鋸齒。所以用法線擠出和模板測試的方法重新實現選中效果。
  13. 重寫後的選中效果不再產生鋸齒，不默認開啟快速抗鋸齒(FXAA)功能，提高了性能。舊場景請在場景屬性中取消勾選快速近似抗鋸齒(FXAA)，並重新保存。
  14. 默認啟用時不再加載任何後期處理(postprocessing)相關著色器和特效類庫，提高加載速度。
  15. 修復創建腳本註釋未漢化bug。
  16. 折疊底部面板功能。
  17. 重寫場景樹狀圖控件，支持折疊、拖動、選中。
  18. 點擊場景選中模型時，場景樹狀圖優先選中整個模型，而不是模型的一部分，而且會自動展開並滾動到所選模型。

v0.1.5

  • 發布日期：2019年2月23日
  • 更新日誌：
  1. 線段、CatmullRom曲線、二次貝塞爾曲線、三次貝塞爾曲線、橢圓曲線可視化編輯、保存和載入。
  2. 修復時間軸上的動畫無法拖動的bug。
  3. 修復無法在場景樹狀視圖將物體拖動到組上的bug。
  4. 基本幾何體都支持多層嵌套，可以正常保存載入。
  5. 修復視角控件尺寸計算bug。
  6. 修復視角控件可能被其他物體遮擋的bug。

v0.1.4

  • 發布日期：2019年2月11日
  • 更新日誌：
  1. 新增一個指示方向的控件。
  2. 新增線段、CatmullRom曲線、二次貝塞爾曲線、三次貝塞爾曲線、橢圓曲線。 (暫不支持保存)

v0.1.3

  • 發布日期：2019年1月28日
  • 更新日誌：
  1. 多語言支持：支持中文和英文，支持語言動態切換。
  2. 新增曲線幾何體。

v0.1.2

  • 發布日期：2019年1月11日
  • 更新日誌：
  1. 場景新增版本控制。場景表僅保存最新場景，歷史數據保存在場景名稱_history表中。
  2. 保存材質自動生成材質球縮略圖。
  3. 保存載入服務端模型修改後的材質。
  4. 正方體、圓形、圓柱體、二十面體、酒杯、平面、球體、茶壺、輪胎、紐結、加載模型都支持剛體組件。支持可視化設置碰撞體形狀（正方體、球體）、質量和慣性。
  5. 新增正方體和球體物理形狀幫助器。

v0.1.1

  • 發布日期：2018年12月30日
  • 更新日誌：
  1. 修復mmd動畫和音頻不同步問題。支持多個mmd模型與模型動畫、相機動畫同步。
  2. 新增點陣化特效、顏色偏移特效、殘影特效、背景虛化、快速近似抗鋸齒(FXAA)、毛刺特效、半色調特效、全屏抗鋸齒(SSAA)、像素特效、可擴展環境光遮擋(SAO)、多重採樣抗鋸齒(SMAA)、屏幕空間環境光遮蔽(SSAO)、時間抗鋸齒(TAA)。
  3. 新增粒子、預設體、角色面板。 （暫未實現具體功能）

v0.1.0

  • 發布日期：2018年12月15日
  • 更新日誌：
  1. 重新梳理模型導入功能。目前支持3ds、3mf、amf、assimp(anim)、awd、babylon、bvh(anim)、collada、ctm、draco、fbx (anim)、gcode、gltf(anim)、js(anim)、json(anim)、kmz、lmesh(anim)、md2、mmd(anim )、nrrd、obj、pcd、pdb、ply、prwm、sea3d(anim)、stl、vrm、vrml、vtk、 x 31種3D文件格式，帶anim的表示支持動畫。多種3D文件同時支持json和二進制格式。 mmd文件同時支持pmd和pmx格式，支持vmd格式的模型和相機動畫。它也是唯一支持lmesh(lolking網站lol模型)的編輯器。
  2. 播放器新增第一視角控制器、飛行控制器、軌道控制器、指針鎖定控制器、軌跡球控制器5種控制器，在相機面板設置。
  3. 場景面板，編輯場景分類，根據類別、名稱、全拼、拼音首字母實時過濾。
  4. 模型面板，編輯模型分類，根據類別、名稱、全拼、拼音首字母實時過濾。
  5. 貼圖面板，編輯貼圖分類，根據類別、名稱、全拼、拼音首字母實時過濾。
  6. 材質面板，編輯材質分類，根據類別、名稱、全拼、拼音首字母實時過濾。
  7. 音頻面板，編輯音頻分類，根據類別、名稱、全拼、拼音首字母實時過濾。
  8. 材質組件，新增保存材質和從材質面板選擇材質功能。
  9. 紋理、透明紋理、凹凸紋理、法線紋理、置換紋理、粗糙紋理、金屬紋理、環境紋理、光照紋理、遮擋紋理、發光紋理從貼圖面板選擇貼圖功能。
  10. 刪除上個版本場景窗口、模型窗口、貼圖窗口、音頻窗口。

v0.0.9

  • 發布日期：2018年11月25日
  • 更新日誌：
  1. 新增布料帶動畫。
  2. gltf模型導入帶動畫。
  3. skinned morph(*.js)模型導入帶動畫。 (新版three.js示例中已經移除該模型。)
  4. 平面畫點工具。
  5. 平面畫線工具。
  6. 平面貼花工具。
  7. 選中物體效果優化。

v0.0.8

  • 發布日期：2018年10月27日
  • 更新日誌：
  1. 編輯器文檔更新。
  2. 立體貼圖上傳服務端，並可設置為場景背景。
  3. 所有場景一鍵發布靜態網站，便於部署到GitHub Pages服務上。
  4. 柏林地形組件、序列化和反序列化，並可在播放器中展示。
  5. 上傳mp4視頻貼圖，並可以設置到材質上，在三維場景中播放視頻。
  6. 增加水組件。

v0.0.7

  • 發布日期：2018年10月14日
  • 更新日誌：
  1. 場景、模型、紋理、音頻、mmd資源編輯功能，可上傳預覽圖。
  2. 材質紋理屬性編輯功能。
  3. 播放器重新架構。
  4. 粒子發射器、天空、火焰、煙保存、載入、播放優化。
  5. 剛體組件不再默認添加，改為從組件菜單中手動添加。

v0.0.6

  • 發布日期：2018年9月30日
  • 更新日誌：
  1. 提供補間動畫支持。可以在時間軸上可視化修改補間動畫，並在播放器中播放。
  2. 新增上傳mmd模型（pmd和pmx格式）和mmd動畫，可以在播放器中播放。
  3. 新增上傳lmesh模型，可在播放器中播放。
  4. 基本幾何體、光源、地形封裝，便於進一步開發。

v0.0.5

  • 發布日期：2018年9月16日
  • 更新日誌：
  1. 佈局修改：右側改為兩欄，左邊欄提供場景層次圖和js腳本管理功能，右邊欄是屬性、設置和歷史面板。 在編輯場景下方新增動畫編輯（未完成），並把日誌查看移動到這裡。
  2. 屬性面板組件化改造，新增基本信息、相機、幾何體、光源、材質、粒子發射器、物理配置、場景、影子、 位移、音頻監聽器、背景音樂等多個組件。
  3. 背景音樂支持保存載入，提供音頻管理。
  4. 修復編輯著色器程序功能，實時查看著色器效果。
  5. 新增茶壺參數編輯組件。
  6. 各種幾何體都可以開啟反射。

v0.0.4

  • 發布日期：2018年9月2日
  • 更新日誌：

  1. 腳本編輯優化，腳本不再跟物體綁定，可以跟場景一起保存載入，提供javascript、vertexShader、fragmentShader、programInfo示例腳本。自定義腳本支持init、start、update、stop、onClick、onDblClick、onKeyDown、onKeyUp、onMouseDown、onMouseMove、 onMouseUp、onMouseWheel、onResize 13種事件。

  2. 背景支持純色、背景圖片、立體貼圖三種不同類型，可以保存載入。

  3. 新增網格、相機、點光源、平行光、聚光燈、半球光、矩形光、幫助器、骨骼9種幫助器的顯示隱藏設置。

  4. 新增日誌面板。

  5. 平板新增鏡面特效。

v0.0.3

  • 發布日期：2018年8月15日
  • 更新日誌：
  1. 使用asp.net開發web服務端，使用MongoDB保存模型和場景數據。
  2. 15種格式3D模型的上傳，並可以保存到場景。
  3. 場景的創建、保存、載入。
  4. 組、12種內置幾何體、5種光源可以保存場景並載入。
  5. 85種three.js對象的序列化和反序列化。

v0.0.2

  • 發佈時間：2018年6月9日
  • 更新日誌：
  1. 使用rollup重構three.js自帶編輯器的代碼。

v0.0.1

  • 發佈時間：2017年6月21日
  • 更新日誌：
  1. 主要完成three.js自帶編輯器的翻譯。

相關鏈接