# ThreeLayerInterface
カスタム three.js レイヤーのインターフェースです。これは実装者がモデル化するための仕様であり、エクスポートされたメソッドやクラスではありません。
カスタム three.js レイヤーには、three.js (opens new window) のシーンが含まれています。開発者は、マップのカメラを使って、three.js オブジェクトをマップの GL コンテキストに直接レンダリングすることができます。このレイヤーは Map#addLayer を使ってマップに追加できます。
カスタムの three.js レイヤーは、一意の id を持ち、type が 'three' である必要があります。また、onAdd、onRemove、prerender、render を実装することができます。
# プロパティ
# id (string (opens new window))
固有のレイヤー ID です。
# lightColor (number (opens new window) | Color (opens new window) | string (opens new window))
ライトの色です。16進数のカラー、three.js の Color (opens new window) インスタンス、または CSS 形式の文字列を指定できます。指定しない場合は、現在の日時に基づいた動的なライトの色が使用されます。現在の動的なライトは、light イベントまたは Map#getLight で取得できます。
# maxzoom (number (opens new window))
レイヤーの最大ズームレベルです。maxzoom 以上のズームレベルでは、レイヤーは非表示になります。値は 0 から 24(これを含む)までの任意の数値です。maxzoom が指定されていない場合は、レイヤーはすべてのズームレベルで表示されます。
# minzoom (number (opens new window))
レイヤーの最小のズームレベルです。minzoom 未満のズームレベルでは、レイヤーは非表示になります。値は 0 から 24(これを含む)の間の任意の数値です。minzoom が指定されていない場合は、レイヤーはすべてのズームレベルで表示されます。
# type (string (opens new window))
レイヤーのタイプです。必ず 'three' と指定してください。
# インスタンスメンバ
# onAdd(map, context)
Map#addLayer でレイヤーが Map に追加された際に呼び出される、任意実装のメソッドです。これを利用して、レイヤーは three.js のリソースを初期化し、イベントリスナーを登録することができます。
# パラメータ
map (Map) このレイヤーが追加された Mini Tokyo 3D の Map
context (Object (opens new window)) このレイヤーに含まれる three.js のレンダラー、シーン、カメラオブジェクト
| 名前 | 説明 |
|---|---|
context.cameraPerspectiveCamera (opens new window) | Camera オブジェクト |
context.rendererWebGLRenderer (opens new window) | Renderer オブジェクト |
context.sceneScene (opens new window) | Scene オブジェクト |
# onRemove(map, context)
Map#removeLayer でレイヤーが Map から削除されたときに呼び出される、任意実装のメソッドです。これを利用して、レイヤーは three.js のリソースを解放し、イベントリスナーを削除することができます。
# パラメータ
map (Map) このレイヤーが削除された Mini Tokyo 3D の Map
context (Object (opens new window)) このレイヤーに含まれる three.js のレンダラー、シーン、カメラオブジェクト
| 名前 | 説明 |
|---|---|
context.cameraPerspectiveCamera (opens new window) | Camera オブジェクト |
context.rendererWebGLRenderer (opens new window) | Renderer オブジェクト |
context.sceneScene (opens new window) | Scene オブジェクト |
# prerender(map, context)
各描画フレームでシーンが描画される前に呼び出される、任意実装のメソッドです。これを利用して、レイヤーはオブジェクトやユニフォーム、アニメーションを更新したり、最終的な描画で使用するオフスクリーンターゲットへ描画したりすることができます。レイヤーは特定の GL の状態を仮定してはならず、描画する前にフレームバッファをバインドする必要があります。
# パラメータ
map (Map) このレイヤーが属する Mini Tokyo 3D の Map
context (Object (opens new window)) このレイヤーに含まれる three.js のレンダラー、シーン、カメラオブジェクト
| 名前 | 説明 |
|---|---|
context.cameraPerspectiveCamera (opens new window) | Camera オブジェクト |
context.rendererWebGLRenderer (opens new window) | Renderer オブジェクト |
context.sceneScene (opens new window) | Scene オブジェクト |
# render(map, context)
各描画フレームでレイヤーを描画するために呼び出される、任意実装のメソッドです。実装した場合、このメソッドが最終的な描画を担当し、オフスクリーンターゲットへの描画やポストプロセス(ブルームなど)を行ってからマップに合成することができます。カメラ、ライト、フォグはすでに設定済みです。実装しない場合は、デフォルトのレンダラーでレイヤーのシーンが描画されます。
# パラメータ
map (Map) このレイヤーが属する Mini Tokyo 3D の Map
context (Object (opens new window)) このレイヤーに含まれる three.js のレンダラー、シーン、カメラオブジェクト
| 名前 | 説明 |
|---|---|
context.cameraPerspectiveCamera (opens new window) | Camera オブジェクト |
context.rendererWebGLRenderer (opens new window) | Renderer オブジェクト |
context.sceneScene (opens new window) | Scene オブジェクト |