オープンソースの 3D 地図エンジン Navara

WHY NAVARA

難しいことを簡単に、
そして美しく。

すぐに、高品質に

ほんの数行のコードで、美しいシーンが立ち上がります。

細部まで、自在に

多様なエフェクトを、思いどおりに調整できます。

作るだけで、終わらせない

自分だけの表現を、作り・拡張し・再利用できる柔軟な基盤。

書き直さない土台

Rust / WASM によるレンダリングエンジンに依存しない設計。WebGPU やネイティブも対応予定。

宣言的スタイルで描いた、ペーパーホワイトの地図の上の PLATEAU 建物と地形

宣言的に、思いのままに拡張。

Plugin・API・Shader で自由に。

Declarative3D Tiles・地形・ベースマップを、宣言的に追加。

レイヤーやマテリアルを設定オブジェクトで宣言するだけで、GIS データを可視化。

PluginDefaultPlugin を使用し、一括で大気・太陽・雲・影を追加。

目的別の機能をプラグインとして簡単に追加。複雑な機能も再利用できます。

API各建物を計測高さで評価し、地物ごとに色分け。

地物評価・ピッキング・座標計算・カメラ制御を柔軟に操作。

ShaderFogLight シェーダを使用し、夜の表現を追加。

Three.js へフルアクセスし、独自のシェーダやエフェクトを実装。

HELLO WORLD

数行のコードで、地球を。

// Initialization
const view = new ThreeView({ useNormal: true });
const defaultPlugin = new DefaultPlugin();
const tilejson = new TileJsonPlugin();
view.addPlugin(defaultPlugin);
view.addPlugin(tilejson);
await view.init();

// Setting up default atmosphere
defaultPlugin.addDefaultPhotorealScene();
view.atmosphere.date = new Date("2026-07-16T01:00:00Z");
view.toneMappingExposure = 10;

// Raster tile
const source = await tilejson.addSource({
  type: "raster-tile",
  url: "https://papers.reearth.land/bluemarble/tilejson.json",
});
view.addLayer({ type: "raster", source });