見出し画像

仮想世界(メタバース)に建物を建設する - Earth2.io | Built With Mapbox

Earth2.ioは、第二の地球をコンセプトに、ユーザーがバーチャル空間上の土地を売買したり、入札したりすることができる未来型のサービスです。Earth2のユーザーは、この新しい仮想世界に"足を踏み入れて"、土地を所有することができます。そんなEarth2.ioは先日、MTS(Mapbox Tiling Service)を使った新しいマップとヒートマップをリリースしました。Earth2では、Mapbox GL JSと最新の衛星画像、そしてTemporary Geocoding APIを活用することで、Earth2で購入するタイル(=土地)を検索する機能を強化しています。ユーザーは、(マップ上の)購入したタイルに自国の国旗を掲示することで、所有権を主張できます。

画像1

▲ 衛星画像マップとヒートマップビュー

今回新たにリリースされたHolobuildingsでは、Mapboxのmapbox-gl-draw APIを利用してポリゴンの頂点をマップ上に直接描画したり、Mapboxのfill-extrusionレイヤータイプを利用して描画したポリゴンの高さやベースの高さを指定したりすることが可能になりました。

Earth2.io Holobuildings開発者 セルジュ氏「Mapboxの素晴らしい技術を導入すること、そしてそれを支える人々と一緒に仕事をすることは、ポジティブで生産的な経験でした。Mapboxをパートナーとして迎えられたことを嬉しく思います。」


Holobuildingsとは?

HolobuildingsはEarth2上に建設できる、建物のホログラムです。Holobuildingsにより、Earth2で取得した不動産のレイアウトを計画したり、未来的な建物を作ったり、巨大都市や空想世界を構築したりすることができるのです。

今回のリリースでは、Holobuildingsの設計図を作成、保存、編集、削除できるようになりました。

画像2

▲ Holobuildingsの設計図

Holobuildingsエディターでは、マップビュー、衛星画像ビュー、3Dビューを切り替えることできます。また、検索したい任意の文字列を入力して、自分の土地を含む任意の場所にカメラを移動させることもできます。

画像3

▲ Holobuildingsエディター内での検索

Earth2では、新しいHolobuildingsの設計図を作成したり、既存の設計図を開いたりすることができます。Holobuildingsエディターではmapbox-gl-drawのAPIを使用しており、マップ上にポリゴンや長方形を描画したり、ポリゴンを統一、切り抜き、結合、削除したりすることができます。

画像4

▲ Holobuildingsエディターでの動作

またHolobuildingsエディターでは、設計図の作成だけではなく、既存の設計図やポリゴンに修正を加えることもできます。編集モードでは、ポリゴンの頂点を選択したり、ポリゴンを押し出したりすることができます。また、ポリゴンの拡大・縮小や回転、ポリゴンの頂点の編集も可能です。ポリゴンの押し出しには、fill-extrusionレイヤーのfill-extrusion-heightfill-extrusion-basefill-extrusion-colorを使用しています。

画像5

▲ Holobuildingsの設計図の編集画面

では、Earth2ユーザーがHolobuildingsエディターを使って実際に作ったものを見てみましょう。

画像6

▲ Image by Karlomartinez(Earth2ユーザー)

画像7

▲ Image by Concepts StarCity 2(Earth2ユーザー)

画像8

▲ Image by Karlomartinez(Earth2ユーザー)

画像9

▲ Image by Royz Concepts StarCity(Earth2ユーザー)

画像10

▲ Image by Mega16TopTracker(Earth2ユーザー)

画像11

▲ Image by Hodoo Maru, Limda214(Earth2ユーザー)


・・・


Earth2のエンジニアリングチームは、Mapboxのテクノロジーを見事に使いこなし、メタバースのコンセプトを全く新しいレベルに引き上げました。私たちは今後も、Earth2チームとのエキサイティングなリリースを予定しています。ぜひEarth2のメンバーになって、earth2.ioの新しいHolobuildingsをチェックしてみてください。

*本記事は、Mapbox Inc. Blogの翻訳記事です


【関連記事】

お問い合わせは下記までご連絡ください
https://www.mapbox.jp/contact