こんにちは松田です。
OpenStreetMapを使ってみる１でPostgreSQLに地図データを投入が完了しましたので、
今回は地図画像の生成とブラウザでの表示までやりたいと思います。
各バージョン
- CentOS 7.4（前回と同じ）
- PostgreSQL 9.4.19（前回と同じ）
- Mapnik 3.0.10
- Apache 2.4
前提パッケージのインストール
|
1
2
3
|
yum install git
yum install automake libtool
yum install harfbuzz-devel freetype-devel libtool-ltdl-devel libpng-devel libtiff-devel libjpeg-devel gcc-c++ libicu-devel python-devel bzip2-devel boost libwebp-devel libtiff-devel libjpeg-turbo-devel libpng-devel sqlite-devel gdal-devel gdal-python
|
Mapnikのインストール
地図画像生成ライブラリのインストール
|
1
2
3
4
5
6
7
|
export PATH=$PATH:/usr/pgsql-9.4/bin/
cd /usr/local/src/
wget https://mapnik.s3.amazonaws.com/dist/v3.0.10/mapnik-v3.0.10.tar.bz2
tar -xf mapnik-v3.0.10.tar.bz2
cd mapnik-v3.0.10
./configure
make && make install
|
以下のファイルができたことを確認
※PostgreSQLがインストールされていないとpostgis.inputが生成されないので注意
|
1
2
3
|
/usr/local/lib/libmapnik.so
/usr/local/lib/mapnik/
/usr/local/lib/mapnik/input/postgis.input
|
共有ライブラリ設定
|
1
2
3
4
5
6
7
8
|
vim /etc/ld.so.conf.d/mapnik.conf
---
/usr/local/lib
---
ldconfig
ldconfig -v | grep mapnik
libmapnik.so.3.0 -> libmapnik.so.3.0.10
|
mapnik-stylesheetsのインストール
mapnik-stylesheetsのインストール
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
cd /usr/local/src
git clone git://github.com/openstreetmap/mapnik-stylesheets.git
cd mapnik-stylesheets
wget http://tile.openstreetmap.org/world_boundaries-spherical.tgz
wget http://tile.openstreetmap.org/processed_p.tar.bz2
wget http://tile.openstreetmap.org/shoreline_300.tar.bz2
tar xzf world_boundaries-spherical.tgz
tar xjf processed_p.tar.bz2 -C world_boundaries
tar xjf shoreline_300.tar.bz2 -C world_boundaries
cd world_boundaries
wget http://www.naturalearthdata.com/http//www.naturalearthdata.com/download/10m/cultural/ne_10m_populated_places.zip
wget http://www.naturalearthdata.com/http//www.naturalearthdata.com/download/110m/cultural/ne_110m_admin_0_boundary_lines_land.zip
unzip ne_10m_populated_places.zip
unzip ne_110m_admin_0_boundary_lines_land.zip
rm ne_10m_populated_places.zip
rm ne_110m_admin_0_boundary_lines_land.zip
|
設定用XMLファイルの生成
|
1
2
|
cd /usr/local/src/mapnik-stylesheets
./generate_xml.py --host localhost --user gis --dbname gis --password 【パスワード】 --port 5432 --symbols ./symbols/ --world_boundaries=./world_boundaries/ --accept-none
|
/usr/local/src/mapnik-stylesheets/inc/datasource-settings.xml.incのホスト名、DB名、ユーザ名、パスワード、ポートが正しいことを確認。
apacheのインストール
/usr/bin/apxsが必要な為、develもインストールします。
|
1
|
yum install httpd httpd-devel
|
mod_tileのインストール
mod_tileのインストール
|
1
2
3
4
5
6
7
8
9
|
cd /usr/local/src/
git clone https://github.com/openstreetmap/mod_tile.git
cd mod_tile
./autogen.sh
./configure --with-apxs=/usr/bin/apxs
make
make install
make install-mod_tile
ldconfig
|
以下のファイルができたことを確認
|
1
2
3
|
/usr/local/bin/renderd
/usr/lib64/httpd/modules/mod_tile.so
/etc/httpd/modules/mod_tile.so
|
mod_tileの設定
ディレクトリ作成
|
1
2
3
4
|
mkdir -p /var/run/renderd
mkdir -p /var/lib/mod_tile
chmod 777 /var/run/renderd
chmod 777 /var/lib/mod_tile
|
設定ファイル /etc/renderd.conf の作成
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
[renderd]
socketname=/var/run/renderd/renderd.sock
num_threads=8
tile_dir=/var/lib/mod_tile
stats_file=/var/run/renderd/renderd.stats
[mapnik]
plugins_dir=/usr/local/lib/mapnik/input
font_dir=/usr/local/lib/mapnik/fonts
font_dir_recurse=1
[default]
URI=/osm_tiles2/
XML=/usr/local/src/mapnik-stylesheets/osm.xml
HOST=localhost
|
httpdの設定
/etc/httpd/conf.d/tile.confの作成
|
1
2
3
4
5
6
7
|
LoadModule tile_module modules/mod_tile.so
LoadTileConfigFile /etc/renderd.conf
ModTileRenderdSocketName /var/run/renderd/renderd.sock
# Timeout before giving up for a tile to be rendered
ModTileRequestTimeout 30
# Timeout before giving up for a tile to be rendered that is otherwise missing
ModTileMissingRequestTimeout 30
|
httpdの起動
|
1
2
|
apachectl configtest
systemctl start httpd.service
|
renderdの起動
renderdの起動
|
1
|
/usr/local/bin/renderd -f >> /var/log/renderd.log 2>> /var/log/renderd.log &
|
しかし起動に失敗する。
/var/log/renderd.logに以下のエラーが出ていた。
|
1
|
renderd[18594]: An error occurred while loading the map layer 'default': failed to initialize projection with: '&srs900913;' in Map of '/usr/local/src/ma pnik-stylesheets/osm.xml'
|
どうやらXMLのエンティティ参照が原因のようです。以下のコマンドでエラー解消。（かなりハマりました）
|
1
2
3
|
xmllint --noent /usr/local/src/mapnik-stylesheets/osm.xml > /usr/local/src/mapnik-stylesheets/osm_noent.xml
mv /usr/local/src/mapnik-stylesheets/osm.xml /usr/local/src/mapnik-stylesheets/osm_original.xml
mv /usr/local/src/mapnik-stylesheets/osm_noent.xml /usr/local/src/mapnik-stylesheets/osm.xml
|
こんどこそ起動
|
1
|
/usr/local/bin/renderd -f >> /var/log/renderd.log 2>> /var/log/renderd.log &
|
ちなみにPostgreSQLが起動していなかったり、接続情報に誤りがあると以下のエラーになります。
|
1
|
renderd[23896]: DEBUG: Failed to read cmd on fd 7
|
htmlファイル用意
/var/www/html/index.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
<html>
<head>
<title>地図の表示</title>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
function init() {
map = new OpenLayers.Map("divMap");
layer = new OpenLayers.Layer.OSM("Default", "/osm_tiles2/${z}/${x}/${y}.png", {numZoomLevels: 19});
map.addLayer(layer);
map.zoomIn();
}
</script>
</head>
<body onload="init();">
<div id="divMap" style="width:100%; height:100%; margin:0;"></div>
</body>
</html>
|
ブラウザで確認
http://サーバのIP/index.html
GoogleMapと同じようにマウスで移動やズームができます。
地図画像は都度生成しているので画面内のすべての画像が表示されるまで３０秒程度かかります。
日本語フォント導入
デフォルトだと日本語の地名が文字化けしちゃっています。
ので日本語フォントを導入します。
|
1
2
3
4
|
cd /usr/local/src/
wget https://launchpad.net/takao-fonts/trunk/15.03/+download/TakaoFonts_00303.01.zip
unzip TakaoFonts_00303.01.zip
mv TakaoFonts_00303.01/Takao* /usr/local/lib/mapnik/fonts/
|
/usr/local/src/mapnik-stylesheets/osm.xmlのフォント部分を以下のように修正
|
1
2
3
4
5
6
7
8
9
|
<FontSet name="book-fonts">
<Font face-name="TakaoPGothic Regular"/>
</FontSet>
<FontSet name="bold-fonts">
<Font face-name="TakaoPGothic Regular"/>
</FontSet>
<FontSet name="oblique-fonts">
<Font face-name="TakaoPGothic Regular"/>
</FontSet>
|
renderdを再起動
|
1
2
|
kill `pgrep renderd`
/usr/local/bin/renderd -f >> /var/log/renderd.log 2>> /var/log/renderd.log &
|
日本語が表示されるようになりました。
終わりに
ブラウザで地図画像の表示までできました。
前回と同様に今回も依存関係やエラーの解消にかなり苦労しました。
この記事が誰かの役に立てば幸いです。