archive-gh-me/ShadowEditor

Fork 0

mirror of https://github.com/tengge1/ShadowEditor.git synced 2026-01-25 15:08:11 +00:00

tengge1 5acf95cb89 更新图片。

2019-04-27 08:35:55 +08:00

19 KiB

Raw Blame History

Shadow Editor

Language: 中文 / 繁體中文 / English / 日本語 / Le français / русский

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

v0.1.8即將更新

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

v0.1.7更新

發布日期：2019年3月23日
更新日誌：

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

項目截圖

溫馨小窩。

點擊此處查看更多截圖。

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

主要功能

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

使用指南

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

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

安裝NodeJs，在最外層目錄，執行以下命令。

npm install
npm run build

下載MongoDB，安裝並啟動MongoDB服務。 MongoDB服務的默認端口為27017。

mongod --dbpath=D:\mongodb\db --logpath=D:\mongodb\log\mongoDB.log --install --serviceName MongoDB
net start MongoDB

編輯文件ShadowEditor.Web/Web.config，將27017修改為你電腦上MongoDB服務的端口。

<add key="mongo_connection" value="mongodb://127.0.0.1:27017" />

使用Visual Studio 2017打開項目，生成ShadowEditor.Web項目。
將ShadowEditor.Web部署在iis上即可在瀏覽器中訪問。
為了保存各種類型文件能正常下載，需要在iis上添加以下兩個MIME類型。

文件擴展名	MIME類型	說明
.*	application/octet-stream	各種格式後綴文件
.	application/octet-stream	無後綴文件

編譯文檔，請安裝gitbook。

npm install -g gitbook-cli

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

gitbook install

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

npm run build-docs

常見問題

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

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

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

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

更新日誌

v0.1.7

發布日期：2019年3月23日
更新日誌：

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

v0.1.6

發布日期：2019年3月10日
更新日誌：

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

v0.1.5

發布日期：2019年2月23日
更新日誌：

線段、CatmullRom曲線、二次貝塞爾曲線、三次貝塞爾曲線、橢圓曲線可視化編輯、保存和載入。
修復時間軸上的動畫無法拖動的bug。
修復無法在場景樹狀視圖將物體拖動到組上的bug。
基本幾何體都支持多層嵌套，可以正常保存載入。
修復視角控件尺寸計算bug。
修復視角控件可能被其他物體遮擋的bug。

v0.1.4

發布日期：2019年2月11日
更新日誌：

新增一個指示方向的控件。
新增線段、CatmullRom曲線、二次貝塞爾曲線、三次貝塞爾曲線、橢圓曲線。 (暫不支持保存)

v0.1.3

發布日期：2019年1月28日
更新日誌：

多語言支持：支持中文和英文，支持語言動態切換。
新增曲線幾何體。

v0.1.2

發布日期：2019年1月11日
更新日誌：

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

v0.1.1

發布日期：2018年12月30日
更新日誌：

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

v0.1.0

發布日期：2018年12月15日
更新日誌：

重新梳理模型導入功能。目前支持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模型)的編輯器。
播放器新增第一視角控制器、飛行控制器、軌道控制器、指針鎖定控制器、軌跡球控制器5種控制器，在相機面板設置。
場景面板，編輯場景分類，根據類別、名稱、全拼、拼音首字母實時過濾。
模型面板，編輯模型分類，根據類別、名稱、全拼、拼音首字母實時過濾。
貼圖面板，編輯貼圖分類，根據類別、名稱、全拼、拼音首字母實時過濾。
材質面板，編輯材質分類，根據類別、名稱、全拼、拼音首字母實時過濾。
音頻面板，編輯音頻分類，根據類別、名稱、全拼、拼音首字母實時過濾。
材質組件，新增保存材質和從材質面板選擇材質功能。
紋理、透明紋理、凹凸紋理、法線紋理、置換紋理、粗糙紋理、金屬紋理、環境紋理、光照紋理、遮擋紋理、發光紋理從貼圖面板選擇貼圖功能。
刪除上個版本場景窗口、模型窗口、貼圖窗口、音頻窗口。

v0.0.9

發布日期：2018年11月25日
更新日誌：

新增布料帶動畫。
gltf模型導入帶動畫。
skinned morph(*.js)模型導入帶動畫。 (新版three.js示例中已經移除該模型。)
平面畫點工具。
平面畫線工具。
平面貼花工具。
選中物體效果優化。

v0.0.8

發布日期：2018年10月27日
更新日誌：

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

v0.0.7

發布日期：2018年10月14日
更新日誌：

場景、模型、紋理、音頻、mmd資源編輯功能，可上傳預覽圖。
材質紋理屬性編輯功能。
播放器重新架構。
粒子發射器、天空、火焰、煙保存、載入、播放優化。
剛體組件不再默認添加，改為從組件菜單中手動添加。

v0.0.6

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

提供補間動畫支持。可以在時間軸上可視化修改補間動畫，並在播放器中播放。
新增上傳mmd模型（pmd和pmx格式）和mmd動畫，可以在播放器中播放。
新增上傳lmesh模型，可在播放器中播放。
基本幾何體、光源、地形封裝，便於進一步開發。

v0.0.5

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

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

v0.0.4

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

腳本編輯優化，腳本不再跟物體綁定，可以跟場景一起保存載入，提供javascript、vertexShader、fragmentShader、programInfo示例腳本。自定義腳本支持init、start、update、stop、onClick、onDblClick、onKeyDown、onKeyUp、onMouseDown、onMouseMove、 onMouseUp、onMouseWheel、onResize 13種事件。
背景支持純色、背景圖片、立體貼圖三種不同類型，可以保存載入。
新增網格、相機、點光源、平行光、聚光燈、半球光、矩形光、幫助器、骨骼9種幫助器的顯示隱藏設置。
新增日誌面板。
平板新增鏡面特效。

v0.0.3

發布日期：2018年8月15日
更新日誌：

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

v0.0.2

發佈時間：2018年6月9日
更新日誌：

使用rollup重構three.js自帶編輯器的代碼。

v0.0.1

發佈時間：2017年6月21日
更新日誌：

主要完成three.js自帶編輯器的翻譯。

19 KiB Raw Blame History Unescape Escape