????????因工作學習需要亏拉，近段時間需要做一個玻璃廠的web端三維可視化項目星瘾，有前輩的基礎，不過此次要在web端實現(xiàn)钝的，由于web端的特性翁垂，因此需要將之前的模型進行輕量化處理铆遭，提高頁面的fps,加載時間，內(nèi)存占用等問題沿猜，在學習過程中會以此方式記錄所遇到的問題以及處理方法枚荣。
? ? ? ? 所謂術業(yè)有專攻，聞道有先后啼肩，文中所提及的知識點以及觀點僅供參考學習橄妆，不一定正確，若對內(nèi)容存在疑問祈坠，歡迎評論或者私聊交流害碾。
一、開發(fā)工具
ThreeJS+html+3DsMax赦拘；
????????ThreeJs:? 輕量化的網(wǎng)頁端3D圖形庫慌随；
????????Html: 網(wǎng)頁開發(fā)，界面設計躺同；
? ? ? ?3DsMax：建模工具儒陨，設計廠房模型以及相關機械設備模型；
二笋籽、項目進度
初步完成以下內(nèi)容：
? ? ? ? 1.玻璃廠房模型的建立并導入蹦漠；
????????2.產(chǎn)線部分模型建立，包括熔化區(qū)车海，成型區(qū)笛园，冷卻區(qū)，加工區(qū)的傳輸設備建立侍芝；
三研铆、今日完成
1.熔化區(qū)以及成型區(qū)的簡化處理以及導入，吸盤抓取裝置的建模導入州叠；
四棵红、實施
1. 模型的處理--以熔化區(qū)為例
????????選用的三維軟件為3dsMax，以.fbx格式導入web端,至于原因沒什么特別的原因咧栗，因為之前的學習對.fbx格式了解比較多逆甜，.fbx格式適用范圍廣。
????????之前的模型是在solidworks建立的致板，由于兩種軟件的點面計算的區(qū)別交煞，以及前者的建立方式?jīng)]有過多對模型的頂點數(shù)量以及三角面數(shù)進行控制，導入3dsMax中斟或，頂點數(shù)目以及面數(shù)比較多素征，如下圖所示。
????????數(shù)目比較大，有32萬個三角形以及16萬個頂點御毅，在公司的電腦(具體配置忘記了根欧，過兩天去看看)直接導入web端需要加載5s左右，fps以及網(wǎng)頁內(nèi)存占用均不理想端蛆。
????????因此需要根據(jù)實際工廠的比例對模幾何大小進行調(diào)整咽块，利用多邊形編輯，刪除或者簡化不重要的幾何特征欺税，簡化得到下圖模型只有6000多個頂點以及7000多面侈沪。加載效率以及顯示效果大大提高。
2. 導入模型的代碼
????????.fbx的導入晚凿，在threejs的官方案例中很好找到如何引入并使用亭罪。引入的模型的地址，設定其在場景中的位置歼秽，添加到場景中即可应役。
3.利用頂點緩存復制相同的模型
????????場景里面有許多幾何特征形同的模型，這些模型的頂點與面索引等信息完全一樣燥筷，如果都在3dsMax中陣列會提高數(shù)據(jù)量箩祥，因此可以利用頂點緩存在模型加載時用代碼進行克隆，然后改變模型位置即可達到相同的視覺效果肆氓，也不會消耗web端的性能袍祖。
五、結語
????????第一次寫谢揪，比較倉促蕉陋，很多知識點沒有細講，也需要翻閱資料拨扶，寫了一個小時了凳鬓，把東西用文字復述一遍還是很不容易啊。以后會多查閱資料患民，寫得更完善更專業(yè)一些缩举，謝謝大佬有緣閱讀。
