ホスティングパッケージ
メタタグ
8th Wall <meta>
タグを使用して、一般的なレンダラーやパッケージをクラウドエディタープロジェクトに素早くロードします。
name属性で
rendererと
package のどちらを読み込むかを指定し、
content` 属性でどのレンダラー/パッケージを読み込むかを指定する:
<meta name="8thwall:renderer" content="renderer:version">
<meta name="8thwall:package" content="@package.package">
レンダラ
<meta name="8thwall:renderer" ...>`タグを使って、A-Frame、three.js、またはBabylon.jsをクラウドエディタプロジェクトに読み込むことができます:
<meta name="8thwall:renderer" content="aframe:version">
<meta name="8thwall:renderer" content="threejs:version">
<meta name="8thwall:renderer" content="babylonjs:version">
aframe
A-Frame の特定のバージョンのみが、<meta>
タグを介してサポートされています。 これは、8th WallがA-Frameのカスタムバージョンを使用しているためで、ARをよりよくサポートするためにさまざまな改良が加えられている。
0.8.2
0.9.0
0.9.2
1.0.3
1.0.4
1.1.0
1.2.0
1.3.0
1.4.1
1.5.0
例
<meta name="8thwall:renderer" content="aframe:1.5.0">
threejs
すべてのバージョンのthree.jsは、<meta>
タグを介してサポートされています。
three.js 160+では、
`タグの代わりにimport mapsを使う必要がある。 例はこちらを参照。例
<meta name="8thwall:renderer" content="threejs:159">
パッケージ
<meta name="8thwall:package" ...>`タグを使用して、一般的なパッケージをクラウドエディタプロジェクトに読み込むことができます:
パッケージ | コンテンツ価値 |
---|---|
XRExtras | 8thwall.xrextras`。 |
ランディングページ | 8thwall.landing-page`。 |
コーチング・オーバーレイ | 8thwall.coaching-overlay`。 |
ビュー | vuejs.vue`。 |
HoloVideoObject | mrcs.holovideoobject`。 |
リアクト | @react.react |
リアクトDOM | @react.react-dom |
リアクト・ルーター DOM | react.react-router-dom`。 |
A-Frame Extras | aframe.aframe-extras`。 |
Aフレーム物理システム | aframe.aframe-physics-system`。 |
例
<meta name="8thwall:package" content="@8thwall.xrextras">
上記の<meta>
タグはすべて公式CDN URLを評価する。 彼らは、サポートされている最新バージョンのパッケージを引っ張ってくる。 特定のバージョンを使用したい場合は、代わりに <script>
タグを使用してください。
8番目の壁 CDN
8th Wallは、利便性のために特定のバージョンに固定された様々なパッケージをCDN上でホストしています。
ammo
https://cdn.8thwall.com/web/aframe/ammo.wasm.js
https://cdn.8thwall.com/web/aframe/ammo.wasm.wasm
aframe-physics-system
https://cdn.8thwall.com/web/aframe/aframe-physics-system-3.2.0.min.js
https://cdn.8thwall.com/web/aframe/aframe-physics-system-4.0.1.min.js
https://cdn.8thwall.com/web/aframe/aframe-physics-system-4.0.1-updated.min.js
https://cdn.8thwall.com/web/aframe/aframe-physics-system-4.2.2.min.js
aframe-animation-component
https://cdn.8thwall.com/web/aframe/aframe-animation-component-5.1.2.min.js
アフレーム・クロマキー素材
https://cdn.8thwall.com/web/aframe/aframe-chromakey-material-1.1.1.min.js
アフレコ・エキストラ
https://cdn.8thwall.com/web/aframe/aframe-extras-4.2.0.min.js
https://cdn.8thwall.com/web/aframe/aframe-extras-6.1.0.min.js
https://cdn.8thwall.com/web/aframe/aframe-extras-6.1.1.min.js
https://cdn.8thwall.com/web/aframe/aframe-extras-7.2.0.min.js
https://cdn.8thwall.com/web/aframe/aframe-extras-7.2.0.min.js
aframe-particle-system-component
https://cdn.8thwall.com/web/aframe/aframe-particle-system-component-1.1.3.min.js
https://cdn.8thwall.com/web/aframe/aframe-particle-system-component-1.1.4.min.js
aframe-spe-particles-component
https://cdn.8thwall.com/web/aframe/aframe-spe-particles-component.min.js
デプスキット
https://cdn.8thwall.com/web/aframe/depthkit-1.0.0.min.js
holovideoobject
https://cdn.8thwall.com/web/mrcs/holovideoobject-0.2.2.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.2.2.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.2.3.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.2.5.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.3.1.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.3.2.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.3.3.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.3.4.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.3.6.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.3.7.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.4.0.min.js
https://cdn.8thwall.com/web/mrcs/holovideoobject-1.5.0.min.js
特定のエンジンチャンクのロード
エンドユーザーのダウンロードサイズを最小化するために、以下の方法を使用して必要なエンジン機能のみを選択的にロードすることができます。
クラウド・エディター
どのチャンクをプリロードするかは、head.html
に以下のメタタグを追加することで指定できる。
- 使用可能なチャンク:'slam', 'hand', 'face'.
<meta name="8thwall:preloadChunks" content="slam,hand,face" />
セルフサービス
あるいは、以下のスクリプト・タグを追加して、必要なチャンクを定義することもできる:
- 受け入れられるチャンクは「スラム」「ハンド」「フェース」。
<script>window._XR8Chunks = ['スラム']です。 </script>