deck.gl は WebGL を利用した可視化フレームワークで、大規模なデータセットを扱うことができ、2D および 3D データの可視化が簡単にできます。deck.gl のデータ可視化を Maps JavaScript API で追加するには、deck.gl の GoogleMapsOverlay
クラスを使用します。
deck.gl は複数のデータソースと形式をサポートしており、地図上に複数の可視化レイヤをレンダリングすることで、合成した可視化を作成できます。
要件
deck.gl を使用するには、Maps JavaScript API で提供されるラスターマップまたはベクターマップのどちらかを使う必要がありますが、Google の基本地図で WebGL を利用した機能(傾斜、回転、フル 3D カメラ コントロールなど)を最大限に活用するには、ベクターマップを使用することを強くおすすめします。
詳しくは、ベクターマップの概要をご覧ください。
deck.gl の読み込み
ウェブアプリで deck.gl を読み込むには、スクリプトタグを使用するか、Node Package Manager(NPM)のモジュールとしてインストールします。
詳しくは、deck.gl ウェブサイトの @deck.gl/google-maps に関するドキュメントをご覧ください。
地図に deck.gl の可視化機能を追加する
deck.gl の可視化機能を地図に追加するには、deck.gl が提供する GoogleMapsOverlay
クラスのインスタンスを作成します。
詳しくは、deck.gl ウェブサイトの GoogleMapsOverlay
に関するドキュメントをご覧ください。
使用可能な可視化機能
deck.gl には、さまざまな種類のデータを表示するために最適化された、2D と 3D の可視化機能が多数用意されています。完全なリストについては、deck.gl ウェブサイトのレイヤカタログをご覧ください。
例
deck.gl と Maps JavaScript API のその他の使用例: