3Dサイトコンポーネントの操作

AEM 3Dには、3Dモデルのインタラクティブな表示をWebページに実装するためのAEM Sitesコンポーネントが含まれています。

3Dコンポーネントを追加した後、そのコンポーネント内の3Dアセットを表示できます。

ページテンプレートへの 3D コンポーネントの追加

ページ上に配置する前に、ページ内で3Dコンポーネントを有効にする必要があります。テンプレートでのコンポーネントの有効化について詳しくは、テンプレートの編集を参照してください。

ページテンプレートへの 3D コンポーネントの追加:

ツール／一般／テンプレートに移動します。
3D コンポーネントを有効にするページテンプレートに移動し、テンプレートを選択します。
「編集」をタップしてテンプレートを開きます。
ページの右上付近にあるドロップダウンメニューで、「構造」モードを選択します（まだアクティブでない場合）。
レイアウトコンテナの領域をタップして選択します。
「ポリシー」ボタンをタップして、ポリシーエディターを開きます。
「プロパティ」セクションで、3Dチェックマークを選択し、「完了」をタップして変更を保存し、ポリシーエディターを閉じます。

これで、このテンプレートを使用するすべてのページに3Dサイトコンポーネントを配置できます。

Web ページへの 3D ビューアコンポーネントの追加

注意

このバージョンの AEM 3D では、Web ページごとに 3D コンポーネントのインスタンスを 1 つだけサポートします。同じページ上の複数の3Dコンポーネントが正しく機能しません。

3D ViewerコンポーネントをWebページに追加するには:

AEM Sitesを開き、3Dコンポーネントを追加するWebページを選択します。
編集（鉛筆）アイコンをタップして、ページをページエディターで開きます。ページ右上付近の「編集」モードが選択されていることを確認します。
パネルセレクターをタップして、サイドパネルを開きます。
プラス記号アイコンをタップして、コンポーネントリストを開きます。
3Dビューアコンポーネントをコンポーネントリストから3Dビューアを表示するページ上の場所にドラッグします。

3D コンポーネントの設定

AEM Sitesページエディタで、前にページに追加した3Dビューアコンポーネントを選択します。

設定アイコン（レンチ）をタップして、コンポーネント設定ダイアログボックスを開きます。

次のコンポーネントプロパティを設定できます。

プロパティ	説明	適用性
高さ (px)	3D コンポーネントの目的の高さをピクセル単位で指定します。空の場合、デフォルトの 600 ピクセルになります。
Stage Name	使用可能なステージのリストから 3D ステージを選択します。ステージは背景とライティングを提供します。 AEM 3Dサイトでのステージの使用についてを参照してください。	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資産のみ。

チェックマークをタップして、変更内容を保存します。

コンポーネント設定ダイアログで使用できる設定に加えて、多くのグローバル設定を使用でき、CRXDE Liteを使用して変更できます。
これらのグローバル設定について詳しくは、詳細設定を参照してください。

コンポーネントへの 3D モデルの割り当て

AEM Sitesのページエディターで、アセットアイコンをクリックし、サイドパネルのアセットリストを開きます。
不要なアセットタイプを非表示にするには、3Dモデルフィルタを選択します。
編集中のページに表示する 3D アセットを検索するか、スクロールして見つけます。
3Dアセットをアセットリストから、前にページに配置した3Dビューアコンポーネントにドラッグします。

Adobe Dimensionアセットは、glTFオープン標準に基づく新しいビューア技術を使用してレンダリングされますが、他のすべての3Dアセットタイプは、従来のAEM 3D webGLビューアに依存します。 3Dモデルのタイプに基づいて、適切なビューアが自動的に選択されます。