FVS三維自訂場景組件

適用場景：安裝了「FineVis資料視覺化」插件的使用者，可參考本文了解 FVS 範本的相關功能。

1.1 版本

1.2 應用場景

「三維自訂場景」組件支援使用者生成空場景，上傳 glb 格式 的模型檔案，透過資料圖層和事件，搭建三維自訂場景。

應用範例文檔可參見：構建3D園區監視場景 。效果如下圖所示：

注：不支援行動端。

1.3 操作步驟

本文將為大家介紹 FVS 三維自訂組件的場景設定、模型匯入、視角轉換等操作。

三維自訂場景的搭建，建議操作步驟如下表所示：

另外本文提供模型資源可供使用者試用，請點選下載解壓後使用：智慧園區監視glb檔案.zip

點選設計器「檔案>建立視覺化看板」，建立一張空白看板。如下圖所示：

點選組件區「3D>三維自訂場景」，即可將其新增到畫布中，點選「編輯組件」，進入三維自訂場景編輯頁面。如下圖所示：

V4.2.0 及之後版本，支援在「編輯組件」介面內對三維組件內容進行儲存。

支援點選頁面右上角「儲存」或使用快捷鍵 Ctrl+S 進行儲存。儲存成功後提示：組件儲存成功，預覽更新需傳回視覺化看板進行範本儲存。如下圖所示：

3.1 建立場景

若首次編輯該自訂場景組件，則需要先建立場景。建立場景有兩種方式：生成空場景，匯入已有場景。

3.1.1 生成空場景

生成空場景，FVS 提供兩種場景風格：實景風格、科技風格。預設選中實景風格，如下圖所示：

注：V4.1.0 之前版本為場景風格，僅提供實景風格、科技風格。

3.1.2 匯入已有場景

三維自訂場景可匯出使用，詳情可參見 3.2 節。若使用者獲得了匯出的三維自訂場景檔案，可選擇「匯入已有場景」直接匯入。如下圖所示：

3.2 匯出場景

在場景編輯介面，使用者可匯出當前場景。

匯出場景時，會包括場景風格、右側「場景」配置和「模型」配置，生成 .fcust 檔案。

匯出的檔案可參考上文 3.1.2 節，在其他三維自訂場景組件中匯入使用。

3.3 設定場景屬性

新增場景後，可對場景的屬性進行配置，如下圖所示：

注：自 V4.1.0 版本起，原「影像」Tab 移除，相關配置項移至「環境 > 後期」中。

3.3.1 環境

1）環境效果

環境效果支援設定多套，點選  即可新增新環境效果

不同的環境效果下可儲存不同的地面、霧等環境配置

注：V4.1.0 之前版本為「整體風格」，可點選切換科技風格/實景風格，更改整體風格將會改寫所有已配置的樣式設定

2）場景時間

透過時間體系可快速設定出滿意的光照、天空等效果，可用於呈現場景跟隨時間動態的過渡效果

詳情請參見文檔：三維自訂場景組件場景時間

3）天空背景

預設開啟天空背景，背景選擇「動態」，與場景時間配合展現

若選擇背景為「靜態」，可選擇背景使用「天空盒」或「顏色」：

• 天空盒：支援內建素材或自訂上傳圖片，自訂上傳支援的貼圖格式包括 jpg、jpeg 和 png

• 顏色：支援設定單色或漸變色

注：調整場景時間時，天空背景預設恢復為「動態」設定。

4）環境光

預設開啟環境光，開啟後可設定環境光的強度，範圍為 0-100

注：調整場景時間時，環境光恢復為時間對應的預設值。

5）光源

可設定場景的光源和投影效果，存在一個「預設平行光」

詳情請參見文檔：FVS自訂模型組件的光源和投影 

注：調整場景時間時，「預設平行光」設定跟隨時間變化，且恢復為時間對應的預設值。

6）地面

可選擇是否「開啟地面」，開啟地面後可設定地面風格，地面背景和地面特效

詳情請參見文檔：FVS自訂模型組件地面特效

7）環境貼圖

環境貼圖主要體現在「金屬材質」的模型上，例如模型：材質球.zip

可選擇是否「開啟環境貼圖」，開啟後可設定環境貼圖及其強度

• 環境貼圖：支援使用內建素材和自訂上傳，自訂上傳的貼圖格式僅支援 hdr

• 強度：支援設定環境貼圖的強度，範圍為 0-2

8）霧

可選擇是否「開啟霧」，開啟後可設定霧顏色、近霧距離、遠霧距離

• 近霧距離：近處的霧和鏡頭之間的距離

• 遠霧距離：遠處的霧和鏡頭之間的距離

9）後期

V4.1.0 版本新增「後期」，支援的配置如下圖所示：

注：V4.1.0 之前版本，「景深」位於「相機」Tab下；其餘設定位於「影像」Tab下。

10）粒子

若勾選「開啟粒子特效」，城市空中會有類似雪花飛舞的效果出現。

11）衝擊波

為了突出顯示某個區域，可設定衝擊波，將區域設定為衝擊波的中心點。

• 支援新增、修改、刪除、隱藏衝擊波
  

• 支援設定衝擊波的名稱、座標、輻射範圍、衝擊波速度、衝擊波顏色等屬性

• 最多支援新增 10 個衝擊波

12）飛昇線條

若勾選「開啟飛昇線條」，會不斷的有光柱從地面飛昇至空中。

3.3.2 相機

1）視角

支援設定場景視角基礎屬性：縮放設定、垂直角度

支援開啟景深、視角變化；支援新增相機視角

詳情請參見文檔：三維場景相機視角 。

2）漫遊路徑

支援新增漫遊路徑，設定漫遊路徑動畫。詳情請參見文檔：三維場景漫遊動畫 。

4.1 新增模型

模型列表中未新增模型物件時，可點選「模型資源管理」或「新增模型」進入「模型管理」頁面。如下圖所示：

注：V3.4.0 之前版本，「模型資源管理」名稱為「新增模型物件」 。

4.2 模型管理

在模型管理頁面，上傳模型後可進行模型管理，支援刪除模型、載入場景、查看模型詳細資訊、模型預處理等操作。

4.2.1 上傳模型

僅支援上傳 .glb 格式模型檔案，可透過 FineVis模型庫 下載通用模型使用，更多模型相關問題可參考 三維模型相關文檔快速引導 。

點選「上傳模型」，選擇需要的模型檔案上傳即可，支援多選模型批量上傳。如下圖所示：

注：glb 檔案名稱中不得包含【】中提到的字元 【 ? ! @ # $ ^ & % * + , : ; = ' \ " ` < > () [] {} / | 空格 】 。

上傳的模型網格數（Mesh 數）超過 3000 時，彈出提示：可能卡頓，建議精簡模型。點選「查看幫助」，可查看網格數過多的影響以及如何優化網格數。

4.2.2 模型預處理

模型初次上傳時，會彈出模型預處理設定框。可進行模型「資料預處理」和「風格預處理」。

若多選模型上傳，會逐個彈出預處理設定框，逐個設定即可。

1）資料預處理

支援調整模型的顯示層級上限，超出顯示層級上限的模型資料不會在模型列表中展示，也不會觸發其他交互效果。

注：資料預處理設定暫不支援廢除，不可二次修改，請謹慎操作。

例如一個模型是一個班級，班級又分為兩組人，每組裏面又分為 6 個單獨的同學。

0 級代表模型為 1 個整體，班級不可拆分。1 級代表可點選小組。以此類推。

2）風格預處理

可選擇是否「啟動線框風格」，啟動後可選擇「預設線框」或「自訂線框」。風格預處理可進行二次修改，初次上傳模型時可選擇略過。

更多詳細內容請查看文檔：三維自訂場景組件線框風格 。

4.2.3 模型載入場景

選中一個或多個模型，點選「載入場景」，即可將模型新增到場景中。

V2.3.0 及之後版本，模型載入成功會提示「模型載入場景成功」；若有模型載入失敗，會提示載入失敗及失敗的模型名稱。

模型載入場景後，模型管理頁面不會自動關閉，可繼續進行模型管理操作。

V3.2.0 及之後版本，點選「載入場景」在模型列表中新新增的模型預設選中並在列表內定位到所新增模型的位置。

注1：批量上傳多個模型時，自動選中定位到最後成功載入場景的模型。

注2：新新增的模型自動新增到列表末尾，不進入任何分組。

新增模型會檢查當前場景的 fps（幀率），如果小於 15，則提示「檢查到場景幀數較低，是否開啟流暢效果」。

開啟流暢效果可有效提升使用體驗，但會關閉部分特效配置，被關閉的特效配置項可手動重新開啟。

4.2.4 刪除模型

滑鼠懸浮模型模型縮略圖，出現「刪除」按鈕，點選即可刪除；或選中模型後，點選「刪除模型」按鈕刪除，支援多選批量刪除。

若模型物件已應用於場景，點選刪除時，會彈出確認刪除提示：

4.2.5 模型取代

V3.3.0 版本新增「模型取代」功能，支援對已上傳的模型進行模型取代。

• 僅支援單次取代一個模型，不支援批量取代。

• 僅取代模型本體，不變化模型預處理內容。

• 取代後模型名稱不變，仍為初次上傳的模型名稱。

• 取代後遍歷當前範本涉及該模型的內容，無法展示的內容自動刪除，不保留。

滑鼠懸浮模型縮略圖，點選右上角「取代」按鈕。在彈出的確認取代提示中點選「取代」，即可選擇對應模型進行取代。如下圖所示：

注：直接預覽會有相容邏輯比較慢，建議進入編輯儲存範本。

4.2.6 模型資訊

點選模型右下角「查看」按鈕，可查看模型資訊。如下圖所示：

4.2.7 搜尋模型

在搜尋框可對模型進行模糊搜尋，快速尋找模型。如下圖所示：

4.3 模型配置面板

選擇模型載入場景後，關閉「模型管理」頁面回到模型列表。選中模型列表中的模型，可配置模型相關屬性。

按照上傳模型時設定的顯示層級，可選中模型或模型中的部分子模型，對其屬性進行單獨配置，不會影響其他部分的模型。

各屬性設定項詳細說明如下表所示：

注1：若新增的模型在中間展示區未顯示，可能是因為模型太大， 需要將視角拉遠/模型縮放後才能正常顯示 。

注2：若新增的模型縱向內容缺失，可能由於模型頂部為 y = 0，調整「位置」中的 y 值即可顯示完整縱向模型 。

在模型列表中，選中模型，滑鼠右鍵可鍵出操作選單，支援複製、刪除、組合或顯示隱藏模型。

4.4 場景中模型相關操作

4.4.1 選中模型

在模型列表和場景編輯介面均支援選中模型，被選中的模型高亮。

• 模型列表：點選即可選中模型物件；按住 ctrl，使用滑鼠左鍵點選可實現多選/減選；按住 shift ，使用滑鼠左鍵可實現連選。

• 場景編輯介面：點選模型物件即可選中；按住 shift ，使用滑鼠左鍵框選可實現多選模型物件。
  

     V3.2.0 及之後版本，列表中被選中的模型自動捲動定位，在列表中置頂顯示。框選多個模型時，列表中順序最高的模型置頂。

     注：僅支援選中 mesh 。

• 點選非模型外的區域或上方工具欄的「取消選中」按鈕，即可取消選中。

注1：支援單獨選中子層級物件進行操作，但選中父層級物件時，可操作物件包含子層級物件。

注2：V3.1.0 及之後版本，模型預處理時進行層級處理後，若層級處理至子層級，則可以選中子層級物件；若層級處理至父層級，在場景內點選任意子層級物件，都會選中整個父層級物件。

4.4.2 行動、旋轉和縮放模型

選中模型物件後，出現 Gizmo 工具，操作 Gizmo 即可調整模型物件位置、旋轉和縮放效果。

1）行動 Gizmo：

• 滑鼠懸浮 X、Y、Z 軸的頂端箭頭，箭頭變色後，拖動箭頭即可在對應方向上行動模型位置。

• 拖動座標系中間的方形區域，可在 XZ 軸平面隨意行動模型位置。

2）旋轉 Gizmo：滑鼠懸浮圓圈，圓圈變色後，行動滑鼠即可改變旋轉角度。

3）縮放 Gizmo：滑鼠懸浮 X、Y、Z 軸直線上的小方塊，方塊變色後，拖動方塊即可改變對應方向上的縮放比例。

若右側屬性面板中的「縮放」勾選了「固定比例」，則 X、Y、Z 軸同時等比縮放。

4.4.3 複製貼上模型

在模型列表或場景中選中模型後，即可複製貼上模型。

• 支援使用快捷鍵 Ctrl+C/V 進行復制/貼上；也支援在場景中，按滑鼠右鍵，鍵出「建立複本」選項，點選即可複製並貼上。

注1：V2.4.0 版本取消右鍵貼上選項，點選複製後直接複製並貼上。

注2：V3.2.0 之前版本，按滑鼠右鍵，鍵出選項名稱為「複製」。

• 複製貼上後，預設選中貼上的模型，貼上的模型展示在原模型相同位置，需手動行動位置。

4.4.4 廢除還原

可透過頂部工具欄按鈕廢除或還原，也支援快捷鍵操作。ctrl+Z 為廢除，shift+ctrl+Z 為還原。

跳出場景再進入，不記憶上次操作，需重新操作後才能廢除或還原。

• V3.3.0 之前版本，僅 行動、旋轉和縮放模型 支援廢除和還原操作。

• V3.3.0 及之后版本，场景编辑界面模型操作能力持续优化，新增支持撤销和还原的操作如下表所示：

三維自訂場景組件中僅支援新增模型資料圖層。

新增資料圖層並綁定資料後，支援為圖層新增「資料更新後」和「按滑鼠左鍵」事件，實現模型資料展示、聯動交互等效果。

功能詳細介紹請參見文檔：三維場景組件資料圖層 。

V2.2.1 及之後版本，配置了資料圖層的自訂模型，在預覽時，滑鼠懸浮有輪廓高亮效果。如下圖所示：

V2.2.0 版本工具欄優化，固定在場景頂部顯示。工具欄具體介紹如下表所示：

設定項	說明
	點選傳回視覺化看板畫布介面
	開啟流暢渲染後，可提升場景編輯效能。詳情請參見：三維場景流暢渲染模式
	一鍵查看場景頂檢視表、主檢視表、側檢視表
	選中模型後，點選可取消選中
	「廢除」和「還原」，支援的操作範圍見 4.4.4 節
	場景視角調整的操作說明，以及「自訂模型位置調整」和「模型多選」操作說明