使用適用於 Azure Digital Twins 的 3D Scenes Studio (預覽) 建置 3D 場景

Azure Digital Twins 3D Scenes Studio (預覽) 是沉浸式 3D 環境，企業和前線工作者可以使用視覺內容，取用和調查來自其 Azure Digital Twins 解決方案的作業資料。

必要條件

若要使用 3D Scenes Studio，您需要下列資源。

• Azure Digital Twins 執行個體。 如需指示，請參閱設定執行個體和驗證。

  • 取得 Azure Digital Twins 資料擁有者或 Azure Digital Twins 資料讀者對執行個體的存取權。 如需指示，請參閱設定使用者存取權限。
  • 記下執行個體的主機名稱，以供稍後使用。

• 一個 Azure 儲存體帳戶。 如需指示，請參閱建立儲存體帳戶。

  • 記下儲存體帳戶的「URL」，以供稍後使用。

• 儲存體帳戶中的私人容器。 如需相關指示，請參閱建立容器。

  • 記下儲存體容器的「名稱」，以供稍後使用。

• 儲存體資源的權限，包括：

  • 至少讀取器控制平面存取
  • 儲存體 Blob 資料擁有者或儲存體 Blob 資料參與者的資料存取角色

  您可以在儲存體帳戶層級或容器層級授與必要的角色。 如需 Azure 儲存體權限的指示和詳細資訊，請參閱指派 Azure 角色。

• 設定儲存體帳戶的 CORS (請參閱下列子區段中的詳細資料)。

設定 CORS

您必須為儲存體帳戶設定 CORS，讓 3D Scenes Studio 能夠存取儲存體容器。

一律需要這些 CORS 標頭：

• 授權
• x-ms-version
• x-ms-blob-type

如果您打算使用私人連結功能，則需要這些額外的 CORS 標頭：

• 內容-類型
• Content-Length
• x-ms-copy-source
• x-ms-requires-sync

以下是 Azure CLI 命令，其會針對儲存體帳戶中的 CORS 設定上述方法、來源和標頭。 此命令包含一個代表儲存體帳戶名稱的預留位置。

az storage cors add --services b --methods GET OPTIONS POST PUT --origins https://explorer.digitaltwins.azure.net --allowed-headers Authorization Content-Type Content-Length x-ms-version x-ms-blob-type x-ms-copy-source x-ms-requires-sync --account-name <your-storage-account>

現在您已擁有在 3D Scenes Studio 中使用場景所需的所有資源。

初始化 3D Scenes Studio 環境

在本節中，您會在 3D Scenes Studio 中設定環境，並針對 Azure Digital Twins 執行個體中的樣本圖表自訂場景。

1. 瀏覽至 3D Scenes Studio。 Studio 將會開啟，並連接到您上次在 Azure Digital Twins Explorer 中存取的 Azure Digital Twins 執行個體。

2. 選取執行個體名稱旁的 [編輯] 圖示，以設定執行個體和儲存體容器詳細資料。

   

   1. Azure Digital Twins 執行個體 URL 應以 https:// 開頭，後面接著 [必要條件] 區段中的執行個體主機名稱。

   2. 針對 [Azure 儲存體帳戶 URL]，請從 [必要條件] 區段輸入儲存體容器的 URL。 針對 [Azure 儲存體容器名稱]，請從 [必要條件] 區段輸入儲存體容器的名稱。

   3. 選取 [儲存]。

   

建立、編輯和檢視場景

3D Scenes Studio 中環境的 3D 表示法稱為場景。 場景是由 3D 檔案和自動為您建立的設定檔所組成。

若要建立場景，請從 .GLTF 或 .GLB 格式的分段 3D 檔案開始。 您可以使用此連結下載及檢視樣本 3D 檔案：下載 RobotArms.glb。

提示

3D Scenes Studio 支援動畫。 如果您使用包含動畫的 3D 模型檔案，其將會在場景中播放。

您可以使用 3D Scenes Studio 搭配已存在於儲存體容器中的 3D 檔案，也可以直接將檔案上傳至 3D Scenes Studio，這樣做會自動將其新增至容器。 以下是使用 3D 檔案來建立新場景的步驟。

1. 從 3D Scenes Studio 的首頁，選取 [新增 3D 場景] 按鈕以開始建立新的場景。

2. 輸入場景的 [名稱] 和 [描述]。

3. 如果您想要在地球檢視中顯示場景，請將 [在地球上顯示] 切換至 [開啟]。 輸入場景的 [緯度] 和 [經度] 值。

4. 在 [連結 3D 檔案] 區段中選取下列其中一個索引標籤：

   1. 選擇檔案，以輸入已在儲存體容器中的 3D 檔案 URL
   2. 上傳檔案以從電腦上傳 3D 檔案

   

5. 選取 建立。

編輯場景

在場景建立後若要加以編輯或刪除，請使用 3D Scenes Studio 首頁中的場景旁的 [動作] 圖示。

編輯場景將會重新開啟您在建立場景時設定的所有場景屬性，讓您能夠變更屬性並更新場景。

在全域檢視中檢視場景

3D Scenes Studio 的首頁會顯示場景的清單檢視。

您也可以選取 [全域檢視]，以查看以視覺方式放置於全域的場景。

產生的全域檢視看起來像這樣：

個別檢視場景

您可以從首頁選取個別場景，以在建置模式中將其開啟。 在這裡，您可以看到場景的 3D 網格，並編輯其元素和行為。

您可以切換至 [檢視] 模式，以啟用特定元素的篩選，以及您已建立之元素行為的視覺效果。

您可以從這裡檢視元素的所有屬性，以及在執行個體上啟用資料歷程記錄時的值。 若要檢視屬性歷程記錄，請選取 [開啟資料歷程記錄總管] 圖示。

這會開啟屬性的 [資料歷程記錄總管]。 如需使用資料歷程記錄總管的詳細資訊，請參閱驗證和探索歷程記錄屬性。

在自訂應用程式中內嵌場景

檢視器元件也可以內嵌至 3D Scenes Studio 以外的自訂應用程式中，並且可與第三方元件搭配使用。

以下是內嵌檢視器在獨立應用程式中的外觀範例：

3D 視覺效果元件程式庫可以從 GitHub 中的 iot-cardboard-js 存放庫取得。 這是開放原始碼 React 元件程式庫，可用於建立物聯網 (IoT) Web 體驗。

如需如何使用這些程式庫將 3D 體驗內嵌至自訂應用程式的指示，請參閱該存放庫的 Wiki：內嵌 3D 場景。 您也可以使用 CRA IoT 卡片板範例來部署程式庫的「建立 React 應用程式」範本，以開始使用內嵌檢視器來建置自訂應用程式。

新增元素

元素是一組自我定義的 3D 網格，其連結至一或多個基礎數位對應項上的資料。

建立新元素的其中一種方式是從場景的 [建置] 檢視中的 [元素] 索引標籤中選取 [新增元素]。

或者，您可以直接從視覺效果中選取網格元件，並建立已連線到其中的新元素。

這會開啟 [新增元素] 面板，您可以在其中填入元素資訊。

名稱和主要對應項

主要對應項是元素的主要數位對應項對應項目。 您會將元素連線到 Azure Digital Twins 執行個體中的對應項，讓元素可以在 3D 視覺效果中代表對應項及其資料。

在 [新增元素] 面板中，[主要對應項] 下拉式清單包含連線的 Azure Digital Twins 執行個體中所有對應項的名稱。 在此欄位旁邊，您可以選取 [檢查屬性] 圖示來檢視對應項資料，或選取 [進階對應項搜尋] 圖示，透過查詢屬性值來尋找其他對應項。

選取對應項以連結至這個元素。 這會自動將數位對應項識別碼 ($dtId) 套用為元素名稱。 如有需要，您可以重新命名元素，使 3D 場景的建立器和取用者都能瞭解該元素的名稱。

提示

Azure Digital Twins Explorer 可協助您尋找連結至元素的正確對應項，方法是顯示對應項的視覺化圖表，並讓您查詢特定對應項條件。

網狀

[網格] 索引標籤是您指定視覺 3D 網格的哪些元件代表這個元素的位置。

如果您在視覺效果中選取網格來開始建立元素，將會在此填入該網格。 您現在可以在視覺效果中選取網格，以將其新增至元素。

行為

行為是場景的情節。 選取此索引標籤上的 [新增行為]。您可以從該處選取現有的行為，以將其新增至此專案，或選取 [新增行為] 以進入建立新行為的流程。

如需建立新行為的詳細資訊，請參閱新增行為。

其他對應項

在 [其他對應項] 索引標籤上，您可以新增元素的次要數位對應項資料來源。 如果主要對應項上的資料不足以定義元素所需的所有行為，您可以將其他對應項新增至元素，因此您需要其他對應項資料的存取權。

您無法在新元素建立期間新增其他對應項。 如需新增其他對應項的指示，請參閱對應項作為行為選項。

將其他對應項新增至元素之後，您可以在此索引標籤上加以檢視和修改。

新增行為

行為是場景的情節，會利用相關元素數位對應項上的特定資料來驅動檢視器視覺效果。

建立新行為的方法之一，是從場景 [建置] 檢視的 [行為] 索引標籤中選取 [新增行為]。

或者，您可以從 [元素] 索引標籤中選取元素，並從該元素的 [行為] 索引標籤建立新的行為。

這會開啟 [新增行為] 面板，您可以在其中填入行為資訊。

名稱和場景圖層

首先，選擇行為的 [顯示名稱]。

提示

此行為名稱會顯示為場景視覺效果的一部分，因此請選擇檢視場景的終端使用者能清楚瞭解的名稱。

針對 [場景圖層] 下拉式功能表，您可以將此行為新增至現有的圖層，或建立新的圖層來協助組織此行為。 如需圖層的詳細資訊，請參閱管理圖層。

元素

在 [元素] 索引標籤中，選取此行為應以哪些元素為目標。

如果您已從特定元素啟動行為建立程序，則會在此選取該元素。 否則，您可以在此第一次選擇元素。

對應項

在 [對應項] 索引標籤上，您可以修改此行為可使用其資料的對應項集合。 這包括目標元素的主要對應項，以及任何其他對應項。

您可以新增元素的次要數位對應項資料來源。 設定其他對應項之後，您就可以在此元素的行為運算式中使用來自這些對應項的屬性。 僅當其他對應項含有您想要用於此行為的視覺效果規則和小工具的主要對應項以外的資料時，您才需要新增其他對應項。

若要新增對應項資料來源，請選取 [新增對應項] 和 [建立對應項]。

這會開啟 [新增對應項] 面板，您可以在其中命名其他對應項，並從您的 Azure Digital Twins 執行個體中選取對應項以進行對應。

提示

Azure Digital Twins Explorer 可協助您查看可能與這個元素的主要對應項相關的對應項。 您可以使用 SELECT * FROM digitaltwins WHERE $dtId="<primary-twin-id> 查詢圖表，然後使用按兩下展開功能來探索相關的對應項。

視覺效果規則

在 [視覺效果規則] 索引標籤中，您可以在元素上設定資料驅動重疊，以指出其在檢視器中的健康情況或狀態。

若要建立規則，請從選取 [新增規則] 開始進行。

選擇規則的 [顯示名稱]。

接下來，請先選擇規則是否相依於 [單一屬性] 或 [自訂 (進階)] 屬性運算式。 針對 [單一屬性]，您將取得主要對應項的數值屬性下拉式清單。 針對 [自訂 (進階)]，您將取得一個文字方塊，您可以在其中使用一或多個屬性撰寫自訂 JavaScript 運算式。 運算式的結果必須符合您在 [類型] 欄位中所指定的結果類型。 如需撰寫自訂運算式的詳細資訊，請參閱使用自訂 (進階) 運算式。

注意

如果您無法從下拉式清單中選取屬性，因為清單沒有回應，這可能表示執行個體中的某些模型發生錯誤。 例如，在模型屬性中具有非唯一列舉值將會中斷這項功能。 如果發生這種情況，請檢閱您的模型定義，並確定所有屬性都有效。

定義屬性運算式之後，請選取 [新增條件] 來定義條件式視覺效果。

在 [新增條件] 選項中，輸入視覺效果中條件的 [標籤]。

然後，設定 [值] 以識別條件的值界限 (確切的選取範圍會根據屬性類型而有所改變)。 針對數值屬性，每個值範圍的最小值皆為內含，最大值為獨佔。

在 [動作] 下，定義符合條件時，場景視覺效果中會發生的事。 您可以使用 [網格著色] 來控制檢視器中屬性運算式的色彩，或使用 [徽章] 在符合屬性運算式的條件時，顯示特定色彩和圖示的徽章。

完成時，選取儲存。

Widget

小工具是在 [小工具] 索引標籤上進行管理。小工具是提供其他內容和資料的資料驅動視覺效果，可協助您了解行為所代表的案例。 設定小工具可協助您確定特定條件為作用中時，可找到正確的資料。

選取 [新增小工具] 以顯示小工具程式庫，您可以在其中從不同類型的可用小工具中進行選取。

以下是您可以建立的小工具類型：

• 量測計：用來以視覺化方式表示數值資料點

  輸入 [顯示名稱] 和 [測量單位]，然後選擇量測計是反映 [單一屬性] 還是 [自訂 (進階)] 屬性運算式。 針對 [單一屬性]，您將取得主要對應項的數值屬性下拉式清單。 針對 [自訂 (進階)]，您將取得一個文字方塊，您可以在其中使用一或多個屬性撰寫自訂 JavaScript 運算式。 該運算式應會有數值結果。 如需撰寫自訂運算式的詳細資訊，請參閱使用自訂 (進階) 運算式。

  定義屬性運算式後，請設定值範圍，使其以特定色彩顯示於量測計上。 每個值範圍均內含最小值，不含最大值。

  

  注意

  如果您無法從下拉式清單中選取屬性，因為清單沒有回應，這可能表示執行個體中的某些模型發生錯誤。 例如，在模型屬性中具有非唯一列舉值將會中斷這項功能。 如果發生這種情況，請檢閱您的模型定義，並確定所有屬性都有效。

• 連結：讓您透過連結的 URL 包含外部參考的內容

  輸入 [標籤] 和目的地 [URL]。

  

  連結 URL 也可包含具有下列語法的計算運算式：${<calculation-expression>}。 上方的螢幕擷取畫面包含用來存取主要對應項屬性的運算式。 運算式將會在檢視器中動態計算和顯示。

• 值：用來直接顯示對應項屬性值

  輸入 [顯示名稱]，然後選取您要顯示的 [屬性運算式]。 這可以是主要對應項的 [單一屬性]，或是 [自訂 (進階)] 屬性運算式。 自訂運算式應為使用一或多個對應項屬性的 JavaScript 運算式，且您應選取運算式所將產生的結果類型。 如果您的自訂屬性運算式輸出字串，您也可以使用 JavaScript 的範本常值語法，在字串輸出中包含動態運算式。 使用下列語法將動態運算式格式化：${<calculation-expression>}。 然後，將整個字串輸出包覆在倒引號 (`) 中。 如需撰寫自訂運算式的詳細資訊，請參閱使用自訂 (進階) 運算式。

  

  注意

  如果您無法從下拉式清單中選取屬性，因為清單沒有回應，這可能表示執行個體中的某些模型發生錯誤。 例如，在模型屬性中具有非唯一列舉值將會中斷這項功能。 如果發生這種情況，請檢閱您的模型定義，並確定所有屬性都有效。

  以下是值小工具的範例，會檢查主要對應項的 InFlow 值是否超過 99。 如果是，則會輸出有運算式的字串，其中包含對應項的 $dtId。 否則，輸出中不會有運算式，因此不需使用倒引號。

  值運算式如下：PrimaryTwin.InFlow > 99 ? `${PrimaryTwin.$dtId} has an InFlow problem` : 'Everything looks good'。 運算式 ($dtId) 的計算結果會顯示在檢視器的小工具中。

  

• 資料歷程記錄：用於顯示一段時間的屬性值。 此小工具可與 Azure 數位對應項的資料歷程記錄功能搭配使用，因此僅在您為此 3D 場景中使用的執行個體啟用資料歷程記錄時，才能使用此功能。 一旦執行個體的資料歷程記錄連線存在，您就可以使用此小工具顯示該資料。

  小工具會以已連線至此 Azure 數位對應項執行個體的 Azure 資料總管執行個體中的資料為目標，自動填入 [連接字串] 欄位。

  輸入 [顯示名稱]，並根據主要對應項的屬性新增一或多個 [時間序列] 資料集。 您也可以自訂時間序列資料在小工具圖表中的顯示方式。

  

  注意

  如果您無法從下拉式清單中選取屬性，因為清單沒有回應，這可能表示執行個體中的某些模型發生錯誤。 例如，在模型屬性中具有非唯一列舉值將會中斷這項功能。 如果發生這種情況，請檢閱您的模型定義，並確定所有屬性都有效。

使用自訂 (進階) 運算式

在行為中定義視覺效果規則和小工具時，您可以使用自訂運算式來定義屬性條件。

這些運算式會使用 JavaScript 語言，並可讓您使用相關對應項的一或多個屬性來定義自訂邏輯。 運算式的結果必須符合您在 [類型] 欄位中所指定的結果類型。

下圖指出在 3D Scenes Studio 自訂運算式中支援哪些 JavaScript 運算子。

運算子類型	是否支援？
指派運算子	No
比較運算子	Yes
算術運算子	Yes
位元運算子	Yes
邏輯運算子	Yes
字串運算子	Yes
條件 (三元) 運算子	Yes
命令運算子	No
一元運算子	No
關聯式運算子	No

管理圖層

您可以在場景中建立圖層，以協助組織行為。 圖層的作用就像行為上的標籤，讓您能夠定義需要一起查看的行為，進而為不同的角色或工作建立場景的自訂檢視。

建立圖層的其中一種方式是使用場景 [建置] 檢視中的 [場景圖層] 按鈕。

選取 [新增圖層] 會提示您輸入您要建立之新圖層的名稱。

或者，您可以在建立或修改行為時建立圖層。 行為窗格也是您可以將行為新增至您已建立之圖層的位置。

在檢視器中查看場景時，您可以使用 [選取圖層] 按鈕來選擇要在視覺效果中顯示的圖層。 不屬於任何圖層的行為，會分組在 [預設] 圖層底下。

設定最小重新整理頻率

您可以手動設定 3D 場景檢視器的最小重新整理頻率，藉此控制資料的提取頻率和效能最終影響。 最小重新整理頻率可以設定為 10 秒到一小時之間的任何時間點。

在場景的建立器中選取 [場景設定] 按鈕。

使用下拉式清單，選取重新整理頻率的選項。

當您在檢視器中查看場景時，可以將滑鼠停留在 [重新整理] 按鈕，藉此檢閱重新整理頻率設定，以及上一次重新整理的時間。 您也可以選取此按鈕來手動重新整理場景。

修改主題

在場景的建立器或檢視器中選取 [主題] 圖示，可變更顯示的樣式、物件色彩和背景色彩。

共用您的環境

3D Scenes Studio 環境是由 Azure Digital Twins 執行個體和 Azure 儲存體容器的唯一配對所組成。 您可以與他人共用整個環境 (包括您所有的場景)，或共用特定場景。

若要與其他人共用您的環境，請先為其提供對資源的下列權限：

• Azure Digital Twins 資料讀者在 Azure Digital Twins 執行個體上存取 (或更新)
• 儲存體 Blob 資料讀者存取 (或更新) 儲存體容器
  • 儲存體 Blob 資料讀者可讓他們檢視場景。
  • 儲存體 Blob 資料擁有者或儲存體 Blob 資料參與者可讓他們編輯您的場景。

然後，依照本節其餘段落的指示，共用整個環境或特定場景。

共用一般環境

使用者在取得必要權限後，將有兩種方式可存取您的整個環境。 您可以執行下列任一動作：

• 使用 3D Scenes Studio 首頁上的 [共用] 按鈕來複製 3D Scenes Studio 環境的 URL。 (URL 包含 Azure 數位對應項執行個體和儲存體容器的 URL。)

  與收件者共用，他們可以直接將此 URL 貼到瀏覽器中以連線到環境。

• 共用 Azure Digital Twins 執行個體的 URL，以及您在初始化 3D Scenes Studio 環境時所使用的 Azure 儲存體容器 URL。 收件者可以存取 3D Scenes Studio，並使用這些相同的 URL 值將其初始化，以連線到相同環境。

之後，收件者就可以在 Studio 中檢視場景並與其互動。

共用特定場景

您也可以透過對特定場景的直接連結來共用您的環境。 若要共用特定場景，請在 [檢視] 模式中開啟場景。

使用 [共用場景] 圖示產生場景的連結。 您可以選擇是否要透過連結來保留目前選取的圖層和元素。

當收件者將此 URL 貼到其瀏覽器時，指定的場景將會在檢視器中開啟，並選取任何已選擇的圖層或元素。

注意

以這種方式與他人共用場景時，收件者也可以離開此場景，並選擇在您的環境中檢視其他場景。

下一步

在開始使用 3D Scenes Studio 中使用樣本情節試用 3D Scenes Studio。

或者，使用 Azure Digital Twins Explorer 以不同的方式視覺化 Azure Digital Twins 圖表。