とらりもん - Cesium入門 Diff
- Added parts are displayed like this.
- Deleted parts are displayed
like this.
2016/05/27 片木仁
{{toc}}
書きかけです。
! Cesiumとは
[[Cesium - WebGL Virtual Globe and Map Engine|https://cesiumjs.org/]]
Google Earthのオープンソース版みたいなもの。
JavaScriptのライブラリで、WebGLを用いて描画する。
! 準備
!! Cesiumの準備
Ubuntu 16.04 を想定しています。
mkdir cesium
cd cesium
wget https://cesiumjs.org/releases/Cesium-1.21.zip
unzip Cesium-1.21.zip
!! Node.jsの準備
ローカルサーバーの準備。apacheでもいいが、チュートリアルではNode.jsを使っていたのでNode.jsで立ち上げる。
[[参考|http://qiita.com/seibe/items/36cef7df85fe2cefa3ea]]
sudo apt-get install -y nodejs npm
sudo npm cache clean
sudo npm install n -g
sudo n stable
sudo ln -sf /usr/local/bin/node /usr/bin/node
# バージョンの確認
node -v
# 古いバージョンを削除
sudo apt-get purge -y nodejs npm
!! ローカルサーバーの準備
npm install
# 走らせる
node server.js
Webブラウザを立ち上げ、http://localhost:8080/ を入力。
Hello Worldをクリックし、地球が表示されれば無事成功。
(2016/06/18 追記) 現在、Beingのマップは表示されない模様。
! DEMデータの表示
coming soon.
!! DSMデータのダウンロード
JAXAの[[全球高精度デジタル3D地図 (ALOS World 3D)|http://www.eorc.jaxa.jp/ALOS/aw3d/index.htm]] からダウンロード。
今回はN36E140の茨城県のタイルを選択。
# ダウンロードしたら、解凍しておく
tar xzvf N036E140.tar.gz
!! DEMデータの変換
Cesiumで読み込める形式に変換。
gdalのversionは2.0.0以上でなければいけないので、必要に応じてインストール。
# gdalのインストール
mkdir ~/gdal && cd ~/gdal
wget http://download.osgeo.org/gdal/2.1.0/gdal-2.1.0.tar.gz
tar xzvf gdal-2.1.0.tar.gz
cd gdal-2.1.0
./configure && make
sudo make install
# ライブラリの依存関係を解決
sudo ldconfig
# cesium-terrain-builderのインストール
git clone https://github.com/geo-data/cesium-terrain-builder.git
cd cesium-terrain-builder
mkdir build && cd build && cmake .. && make install.
cmake -DGDAL_LIBRARY_DIR=/usr/local/lib \
-DGDAL_LIBRARY=/usr/local/lib/libgdal.so \
-DGDAL_INCLUDE_DIR=/usr/local/include \
..
sudo make install
# ライブラリの依存関係を解決
sudo ldconfig
cd ~/cesium && mkdir tiles
ctb-tile --output-dir ./tiles ~/Downloads/N036E140/AVERAGE/N036E140_AVE_DSM.tif
tar cvzf tiles.tar.gz tiles
! 参考になるページ
* [[Creating 3D terrains with Cesium|http://blog.thematicmapping.org/2014/10/3d-terrains-with-cesium.html]]
* [[cesium-terrain-builder|https://github.com/geo-data/cesium-terrain-builder]] … DEMをCesiumで表示できる形式に変換してくれる。
* [[Cesium Sandcastle|https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Terrain.html&label=Showcases]] … コードと一緒にいくつかの例が載っている。
* [[空撮画像技術と3次元リアルタイムデータの可視化について|http://www.slideshare.net/makinux7/3-59868281]]
{{toc}}
書きかけです。
! Cesiumとは
[[Cesium - WebGL Virtual Globe and Map Engine|https://cesiumjs.org/]]
Google Earthのオープンソース版みたいなもの。
JavaScriptのライブラリで、WebGLを用いて描画する。
! 準備
!! Cesiumの準備
Ubuntu 16.04 を想定しています。
mkdir cesium
cd cesium
wget https://cesiumjs.org/releases/Cesium-1.21.zip
unzip Cesium-1.21.zip
!! Node.jsの準備
ローカルサーバーの準備。apacheでもいいが、チュートリアルではNode.jsを使っていたのでNode.jsで立ち上げる。
[[参考|http://qiita.com/seibe/items/36cef7df85fe2cefa3ea]]
sudo apt-get install -y nodejs npm
sudo npm cache clean
sudo npm install n -g
sudo n stable
sudo ln -sf /usr/local/bin/node /usr/bin/node
# バージョンの確認
node -v
# 古いバージョンを削除
sudo apt-get purge -y nodejs npm
!! ローカルサーバーの準備
npm install
# 走らせる
node server.js
Webブラウザを立ち上げ、http://localhost:8080/ を入力。
Hello Worldをクリックし、地球が表示されれば無事成功。
(2016/06/18 追記) 現在、Beingのマップは表示されない模様。
! DEMデータの表示
coming soon.
!! DSMデータのダウンロード
JAXAの[[全球高精度デジタル3D地図 (ALOS World 3D)|http://www.eorc.jaxa.jp/ALOS/aw3d/index.htm]] からダウンロード。
今回はN36E140の茨城県のタイルを選択。
# ダウンロードしたら、解凍しておく
tar xzvf N036E140.tar.gz
!! DEMデータの変換
Cesiumで読み込める形式に変換。
gdalのversionは2.0.0以上でなければいけないので、必要に応じてインストール。
# gdalのインストール
mkdir ~/gdal && cd ~/gdal
wget http://download.osgeo.org/gdal/2.1.0/gdal-2.1.0.tar.gz
tar xzvf gdal-2.1.0.tar.gz
cd gdal-2.1.0
./configure && make
sudo make install
# ライブラリの依存関係を解決
sudo ldconfig
# cesium-terrain-builderのインストール
git clone https://github.com/geo-data/cesium-terrain-builder.git
cd cesium-terrain-builder
mkdir build && cd build && cmake .. && make install.
cmake -DGDAL_LIBRARY_DIR=/usr/local/lib \
-DGDAL_LIBRARY=/usr/local/lib/libgdal.so \
-DGDAL_INCLUDE_DIR=/usr/local/include \
..
sudo make install
# ライブラリの依存関係を解決
sudo ldconfig
cd ~/cesium && mkdir tiles
ctb-tile --output-dir ./tiles ~/Downloads/N036E140/AVERAGE/N036E140_AVE_DSM.tif
tar cvzf tiles.tar.gz tiles
! 参考になるページ
* [[Creating 3D terrains with Cesium|http://blog.thematicmapping.org/2014/10/3d-terrains-with-cesium.html]]
* [[cesium-terrain-builder|https://github.com/geo-data/cesium-terrain-builder]] … DEMをCesiumで表示できる形式に変換してくれる。
* [[Cesium Sandcastle|https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Terrain.html&label=Showcases]] … コードと一緒にいくつかの例が載っている。
* [[空撮画像技術と3次元リアルタイムデータの可視化について|http://www.slideshare.net/makinux7/3-59868281]]