#PowerApps 3Dで表示(View in 3D) #03 ODfB+Excel


「3D で表示」(View in 3D)に対して、OneDrive と Excel を準備してデータコネクターを利用して3Dモデルを表示する方法、詳細編です。

もくじ

事前準備:プレビュー環境構築方法など
View in 3D #01 :概要
View in 3D #02 :Source指定方法
View In 3D #03 :ODfB+Excelで表示 当記事

動作イメージ

OneDrive for Business(以降、ODfB)に .glb ファイルを格納して、Excel(Excel Online)データコネクターを利用して Power Apps 上に View in 3D しているだけ、です。詳細はこの後に解説します。

シングルタッチ、マルチタッチに対応しています。MR はPCのブラウザー上では動作しませんが、3Dで表示(View in 3D)はブラウザー上でも動作します。
この View in 3D で表示しているデータを、MR系コントロールへ受け渡すコトで、MR側で配置させる等の利用方法が可能です。MRコントロールとの連携方法は前回#02で紹介しているYouTubeを参照ください。

3D画像を用意する

「3D で表示」コントロールと ODfB + Excel の話題に入る前に、表示するためのファイルを用意しましょう。当方は Windows 10 の「ペイント3D」を使って、サンプルを保存して試しました。

ペイント 3D の使い方 (YouTube)
ペイント3Dで3Dサンプルを読み込むには -Windows10 使い方解説動画

View in 3D + ODfB + Excel

3D画像(.glb)ファイルの準備ができたら、Power Apps の 3D表示を試してみましょう。まず、準備した3DファイルをODfBへ仕込みをします。手順としては、公式のDocsにある説明と殆ど一緒です。ただし、記事投稿時点で素直に従うとハマるトコがあるので、その点もフォローしたいと思います。

 ■Docs
 Loading models as attachments or media content

1..glb ファイルを ODfB へ格納する

準備したファイルを ODfB へ格納(保存)します。まず拠点となるフォルダー(下イメージでは”zzz_3D"フォルダー)を作成します。
拠点フォルダーを作成したら、次に .glb ファイルを格納するフォルダー(下イメージでは"glb"フォルダー)を作成します。

glbフォルダーへ、事前に準備した3Dファイルを格納しましょう。
※ティラノサウルスの拡張子が異なっているのは意図的です。
※混乱するので、基本的に .glb ファイルだけを格納するようにしましょうね。

2.Excel ファイルを準備する

拠点フォルダーの直下にExcelを用意します。glbフォルダーの中ではダメです。
重要なので繰り返します。「Excel は glbフォルダーの中ではダメ」です。
つまり、拠点フォルダー直下にExcel、その配下に3D画像を管理するフォルダーを作成する、という構造にしてください。

Docs にも記載されていますが、Excelで上記のようなテーブルを作成して保存しておきます。なお、新規作成の際は「Name」と「3DModel [image]」の2列あればOKです。末尾の列は Power Apps からデータコネクターで接続した際に自動で付与されます。テーブル名は任意でかまいません。

列名 説明
Name 3Dイメージの名称。識別以外では利用しない。
3DModel [image] .glb ファイル名を含むパス。
Excelファイルからの相対パスであること。
※注意点アリ
PowerAppsId Power Apps からデータコネクターで接続すると自動生成される値。
※自作する必要はない

2-1.※ Excelファイルの注意点 その1

Docs では下イメージのようにバックスラッシュ(\)でパスが指定してあります。しかしながら、当方が試した限りではバックスラッシュも、UNCでディレクトリーを表す"¥"(本来は半角)も正しく動作しませんでした。

プレビューの機能なので、不具合なのか?Docsが誤っているのか?は不明ですが、前述スクリーンショットのように「./<glbフォルダー名>/<.glbファイル名>」と指定する必要あります。URLのようにスラッシュ(/)を利用してください。
ほかにも罠があるのですが、それは後述。

3.Power Apps キャンバスアプリ作成

glbファイルとExcelファイルの準備ができたら、Power Apps でキャンバスアプリを作成します。なお、記事投稿時点ではプレビュー機能が利用可能な環境のみコントロールが利用可能です。

画面構成としては下記のような感じ。前手順で用意したExcelファイルに対して、ODfB データコネクター で接続しています。なお、下イメージではテーブル名が”テーブル1”のままですね。

「Dropdown」コントロールには、前述ExcelファイルのNameを表示しているだけ、です。「3D で表示」コントロールは[Source]プロパティに下記を指定します。これで、ドロップダウンで選択した3D画像で切り替えるコトが可能になります。

ViewIn3D.Source
Dropdown.Selected.'3DModel'

「ラベル」コントロールについては続けて解説します。なお、解析のためにラベルを設置しているだけですので、少なくとも View in 3D したいだけならラベルは無視でOKかと思います。

4.'3DModel'を解析

ラベルコントロールにも「3D で表示」コントロールの[Source]プロパティと同じ設定をしてみます。

ラベルに「appres://datasources/~」で始まる文字列が表示されます。Excelファイルで指定した'3DModel [image]'は glb ファイルのパスを指定しただけでしたが、データコネクターを利用して接続するだけで自動的に3D表示が可能な情報に置き換わっているのがわかります。

4-1.※ Excelファイルの注意点 その2

データソースとして指定したExcelファイルの構造を変更してみました。”3DModel [image] ”の列名を別名称へ変更(今回は"hogehoge")してみます。

先ほどのアプリにデータコネクターを追加して、ドロップダウンのデータベースを変更してみます。そうすると、3D表示がされなくなります。

ラベルを確認すると、Excelファイルで指定したファイルパスが表示されています。確認した限りでDocsのドコにも明記されてないのですが、この結果から「Excelファイルの列名は決まったモノを使うべき」というコトがわかります。

4-2.※ Excelファイルの注意点 その2 補足

さらに深堀りしてみました。Power Apps のデバッグ機能でデータコネクターで取得した内容を比較してみました。


上記の結果から、Excelファイルに指定された列名でテーブルを準備してデータコネクター経由でアクセスすると、3Dモデルが自動的に解析されて「3DModel」というプロパティでアクセスできる、というのが把握できます。

5.OneDrive+Excel利用の.glb以外の表示はできません(現状

ティラノサウルスの拡張子が異なっていた理由ですw
今回紹介している手順で試してみた結果ですが、.glbファイル以外は現状表示できない模様です。OneDrive + Excel の組み合わせでデータコネクター経由でのアプローチは .glb ファイルを利用すべき、と考えられます。


@koruneko32767さんが教えてくださったのですが、.glbファイルでもPower Appsで表示できないパターンもあるようです。

まとめ

  • Windows 10 なら 3Dペイントで3D画像の準備が簡単にできますよ
  • Power Apps の View in 3D は現状 .glb ファイルしか表示できない
    • 稀に表示できないパターンもあるのでご注意(※詳細不明)
  • OneDrive を 利用する場合は、glbファイルを格納するフォルダー構造に注意
    • glbファイルを格納するだけのフォルダーを作成する必要アリぽい
  • さらに、glbファイルを指定するためのExcelファイルが必要
    • Excelファイルを置く場所にも注意が必要
  • Excelファイルのテーブル、列名が重要
    • 間違えると意図した動作をしない
    • glbファイルを指定するのはURL形式で相対パス
  • データコネクターを利用してアクセスすることで、自動的に3D表示可能にしているっぽい

知らないとハマりそうな部分がありますねぇ・・・。現段階ではプレビュー機能なのでしょうがないね!って気持ちです。今後のVerUpに期待しましょう。

それでは皆さま、素晴らしい Power Platform Life を!