使用3D Sites元件

AEM 3D包含AEM Sites元件,您可用來實作網頁上3D模型的互動式檢視。

新增3D元件後,您可以檢視該元件中的3D資產。

將3D元件添加到頁面模板

您必須先在頁面中啟用3D元件,才能將它放在頁面上。 如需在範本中啟用元件的詳細資訊,請參閱編輯範本

將3D元件新增至頁面範本:

  1. 導覽至​工具>一般>範本

  2. 導覽至您要在中啟用3D元件的頁面範本,然後選取範本。

  3. 點選​編輯​以開啟範本。

  4. 在頁面右上角的下拉式功能表中,選取​結構​模式(如果尚未啟用)。

    image2017-11-14_15-33-57

  5. 點選​版面容器​區域以選取它。

  6. 點選​Policy​按鈕以開啟​Policy Editor

  7. 在​屬性​區段中,選擇​3D​複選標籤,然後點選​完成​以儲存變更並關閉​原則編輯器

    您現在可以將3D Sites元件置於使用此範本的所有頁面上。

將3D檢視器元件新增至網頁

注意

此AEM 3D版本僅支援每個網頁上一個3D元件例項。 同一頁面上的多個3D元件無法正常運作。

若要將3D檢視器元件新增至網頁:

  1. 開啟「AEM網站」,並選取您要新增3D元件的網頁。

  2. 點選「編輯(鉛筆)」圖示,將頁面開啟至頁面編輯器。 請確定已選取頁面右上方附近的​編輯​模式。

    image2017-11-14_15-44-40

  3. 點選滑軌選擇器以開啟側面板。

  4. 點選加號圖示以開啟​元件​清單。

  5. 將​3D檢視器​元件從​元件​清單拖曳至您要3D檢視器出現的頁面位置。

配置3D元件

  1. 在「AEM Sites」頁面編輯器中,選取您先前新增至頁面的​3D檢視器​元件。

  2. 點選​Configuration​圖示(扳手)以開啟元件設定對話方塊。

    可以設定以下元件屬性:

    屬性 說明 適用性
    高度 (px) 以像素為單位指定所需的3D元件高度。 如果保留空白,預設值為600像素。
    階段名稱

    從可用階段清單中選擇3D階段。 舞台提供背景和照明。

    請參閱關於AEM 3D Sites中階段的使用。

    已忽略Adobe Dimension資產。
    自動回轉速度(RPM)

    3D檢視器在載入並重設後,會持續環繞相機。 當用戶啟動手動軌道操作時,自動自旋終止。

    您可以使用下列值,以RPM指定回轉速度:

    • 將正值設為向右旋轉
    • 將負值設為左旋轉
    • 設定0值以停用自動回轉。

    預設值為3 RPM,相當於每次完整旋轉20秒。

    注意: 回轉速度假設為60/秒影格速率。通常,在功能更強大的圖形硬體上,小型到中型機型可達到此速度。 較大機型或較慢的裝置會以較低的速率自動旋轉。

    已忽略Adobe Dimension資產。
    導覽按鈕顏色 使用檢色器為檢視器的控制按鈕選擇主要顏色。 Adobe Dimension資產已忽略。
    導覽暫留色彩 使用檢色器為檢視器的控制按鈕選擇暫留/選取的顏色。 已忽略Adobe Dimension資產。
    顯示色票 供日後使用。 已忽略Adobe Dimension資產。
    顯示GLTF相機預設集 顯示或隱藏Adobe Dimension資產中可能存在的相機預設集。 僅限Adobe Dimension資產。
    GLTF背景顏色 如果3D模型不包含背景,則預設背景顏色。 僅限Adobe Dimension資產。
  3. 點選核取標籤以儲存變更。

    除了元件配置對話框中的可用設定外,還提供了一些全局配置設定,這些設定可通過CRXDE Lite進行修改。
    如需這些全域設定的詳細資訊,請參閱進階組態設定

為元件指定3D模型

  1. 在「AEM Sites」頁面編輯器中,按一下「資產」圖示,以開啟側面板中的「資產」清單。

  2. 選擇​3D Models​篩選器可隱藏不想要的資產類型。

    screen_shot_2017-12-11at124258

  3. 搜尋或捲動至您要在編輯之頁面上檢視的3D資產。

  4. 將3D資產從​Assets​清單拖曳至先前放在頁面上的​3D檢視器​元件。

    Adobe Dimension資產是使用以glTF Open Standard為基礎的新檢視器技術來轉譯,而所有其他3D資產類型則仰賴傳統的AEM 3D webGL檢視器。 元件會根據3D模型類型自動選取適當的檢視器。

預覽具有3D元件的網頁

當網頁處於​編輯​模式時,3D元件顯示3D模型,但無法與模型交互。

您可以在頁面編輯器中預覽網頁,並完整存取3D元件的功能。

另請參閱在Sites 3D元件中查看3D資產。

若要預覽包含3D元件的網頁:

  1. 執行下列任一項作業:

    • 在頁面右上方附近,按一下「預覽​」以進入預覽模式。
    • 從瀏覽器的頁面URL刪除/edit.html

發佈頁面和資產

如需如何發佈資產的詳細資訊,請參閱發佈資產。 如需如何發佈頁面的詳細資訊,請參閱發佈頁面

注意

使用​頁面資訊​功能表上的​發佈頁面​功能表項目,將發佈頁面和所有主要頁面相依性。 以此方式發佈頁面時,不會發佈3D模型和/或3D階段可能參照的次要相依性,例如紋理映射和IBL影像。

Adobe建議您直接從AEM Assets發佈所有3D資產及其相依性,然後再發佈參照這些資產的網頁。

本頁內容