Ubuntu 16.04 で OpenStreetMap タイルサーバを構築 – 3 –

ステップ5 :

mod_tile のインストール

mod_tileはタイルを提供するために必要とされるApacheモジュールです。

現在のところ、Ubuntuのためのバイナリパッケージは利用可能ではありません。

GitHubのリポジトリからそれをコンパイルすることができます。

先にコンパイルするのに必要なファイル類をインストールします。

sudo apt install git autoconf libtool libmapnik-dev apache2-dev

その後に、GitHupのリポジトリからクローンします。

git clone https://github.com/openstreetmap/mod_tile.git
cd mod_tile/

コンパイルしてインストールします。

./autogen.sh
./configure
make
sudo make install
sudo make install-mod_tile

ステップ6:

Mapnik スタイルシートの生成

必要なパッケージをインストールします。

sudo apt install curl unzip gdal-bin mapnik-utils node-carto

osm ユーザーに切り替えます。

su - osm

Carto ディレクトリへ移動します。

cd openstreetmap-carto-2.41.0/

シェープファイルを取得します。

./get-shapefiles.sh

Mapnik xml スタイルシートをビルドします。

carto project.mml > style.xml

osm ユーザーから抜けます。

exit

ステップ7:

renderd 設定

renderd config ファイルを編集します。

sudo vi /usr/local/etc/renderd.conf

[default] の項目で、XML と HOST の値を変更します。

XML=/home/osm/openstreetmap-carto-2.41.0/style.xml
HOST=localhost

[mapnik]

の項目で、plugins_dir の値を変更します。

plugins_dir=/usr/lib/mapnik/3.0/input/

ファイルを保存します。

サンプルの init スクリプトをコピーして、renderd のinit スクリプトをインストールします。

sudo cp mod_tile/debian/renderd.init /etc/init.d/renderd

実効権限を与えます。

sudo chmod a+x /etc/init.d/renderd

init スクリプトを編集します。

sudo vi /etc/init.d/renderd

次の変数を変更します。

DAEMON=/usr/local/bin/$NAME
DAEMON_ARGS="-c /usr/local/etc/renderd.conf"
RUNASUSER=osm

ファイルを保存します。.

次のディレクトリを作成しosmユーザーを所有者とします。

sudo mkdir -p /var/lib/mod_tile

sudo chown osm:osm /var/lib/mod_tile

renderd サービスをスタートします。

sudo systemctl daemon-reload

sudo systemctl start renderd

ここまでは問題なし

sudo systemctl enable renderd

とやったら

renderd.service is not a native service, redirecting to systemd-sysv-install
Executing /lib/systemd/systemd-sysv-install enable renderd

と表示されるので

sudo /lib/systemd/systemd-sysv-install enable renderd

としておいた。

ステップ8:

apache コンフィグ

apache web サーバをインストールします。

sudo apt install apache2

モジュールロードファイルを作成します。

sudo vi /etc/apache2/mods-available/mod_tile.load

ファイルに次の行を貼り付けます。

LoadModule tile_module /usr/lib/apache2/modules/mod_tile.so

シンボリックリンクを作成します。

sudo ln -s /etc/apache2/mods-available/mod_tile.load /etc/apache2/mods-enabled/

デフォルトのバーチャルホスト conf ファイルを編集します。

sudo vi /etc/apache2/sites-enabled/000-default.conf

の行の後に

LoadTileConfigFile /usr/local/etc/renderd.conf
ModTileRenderdSocketName /var/run/renderd/renderd.sock
# Timeout before giving up for a tile to be rendered
ModTileRequestTimeout 0
# Timeout before giving up for a tile to be rendered that is otherwise missing
ModTileMissingRequestTimeout 30

ファイルを保存して閉じます。 apache を再起動します。

sudo systemctl restart apache2

次にあなたのブラウザのアドレスバーに入力します。

your-server-ip/osm_tiles/0/0/0.png

あなたは世界地図のタイルが表示されるはずです。
おめでとう！あなたは成功し、独自のOSMタイルサーバを構築しました。

あなたのタイル張りのWeb地図を表示します

タイル張りのWebマップはまた、 OpenStreetMapの用語でスリッピーマップとして知られています。

OpenLayerとリーフレット：あなたのタイルサーバー用に使用できる2つのフリーでオープンソースのJavaScriptマップ・ライブラリがあります。

リーフレットの利点は、使い方が簡単で、マップをモバイル対応になるということです。

OpenLayer

OpenLayerであなたのスリッピーマップを表示するには、最初のWebフォルダを作成します。

次に JavaScript と CSS を openlayer.org からダウロードして web ルートフォルダに展開します。

続いて、index.html ファイルを作成します。

sudo vi /var/www/osm/index.html

次のテキストファイルを貼り付け赤文字のところを適当な内容に書き換えます。

<!DOCTYPE html>
<html>
<head>
<title>Accessible Map</title>
<link rel="stylesheet" href="http://your-ip/ol.css" type="text/css">
<script src="http://your-ip/ol.js">
</script>
a.skiplink {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
  }
  a.skiplink:focus {
    clip: auto;
    height: auto;
    width: auto;
    background-color: #fff;
    padding: 0.3em;
  }
  #map:focus {
    outline: #4A74A8 solid 0.15em;
  }
</style>
</head>
<body>
  <a class="skiplink" href="#map">Go to map</a>
  <div id="map" class="map" tabindex="0"></div>
  <button id="zoom-out">Zoom out</button>
  <button id="zoom-in">Zoom in</button>
  <script>
    var map = new ol.Map({
      layers: [
        new ol.layer.Tile({
          source: new ol.source.OSM({
             url: 'http://your-ip/osm_tiles/{z}/{x}/{y}.png'
          })
       })
     ],
     target: 'map',
     controls: ol.control.defaults({
        attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
          collapsible: false
        })
     }),
    view: new ol.View({
       center: [244780.24508882355, 7386452.183179816],
       zoom:5
    })
 });

  document.getElementById('zoom-out').onclick = function() {
    var view = map.getView();
    var zoom = view.getZoom();
    view.setZoom(zoom - 1);
  };

  document.getElementById('zoom-in').onclick = function() {
     var view = map.getView();
     var zoom = view.getZoom();
     view.setZoom(zoom + 1);
  };
</script>
</body>
</html>

ファイルを保存して閉じます。

今、あなたはブラウザでサーバのIPアドレスを入力してスリッピーマップを表示することができます。と思ったのですが、バーチャルホストの設定直していないので、まだ表示されないですね。

sudo vi /etc/apache2/sites-enabled/000-default.conf

DocumentRoot /var/www/osm

に書き換えて

ファイルを保存して閉じます。 apache を再起動します。

sudo systemctl restart apache2

今、あなたはブラウザでサーバのIPアドレスを入力してスリッピーマップを表示することができます。

次に

Leaflet

cd /var/www/osm

に JavaScript と CSS を leftletjs.com からダウンロードして web ルートフォルダに配置します。

続いて、index2.html ファイルを作成します。

sudo vi index2.html

次のテキストファイルを貼り付け赤文字のところを適当な内容に書き換えます。

<html>
<head>
<title>My first osm</title>
<link rel="stylesheet" type="text/css" href="leaflet.css"/>
<script type="text/javascript" src="leaflet.js"></script>
<style>
   #map{width:100%;height:100%}
</style>
</head>

<body>
  <div id="map"></div>
  <script>
    var map = L.map('map').setView([53.555,9.899],5);
    L.tileLayer('http://your-ip/osm_tiles/{z}/{x}/{y}.png',{maxZoom:18}).addTo(map);
</script>
</body>
</html>

こっちの方がするする動く感じですね。

ただ

こんな感じでトーフが並んでます。

とーふ対策できました。

代わりにその場でレンダリングのタイルは、 render_listコマンドを使用プリレンダリング。プリレンダリングされたタイルは、/var/lib/mod_tile ディレクトリにキャッシュされます。 -zおよび-Zフラグは、ズームレベルを指定します。

render_list -m default -a -z 0 -Z 10

このチュートリアルはMiles B. Dyson 氏の助言でできるようになったそうです。

タグ: OpenStreetMap, OSM, タイルサーバ

keizoh.com

Ubuntu 16.04 で OpenStreetMap タイルサーバを構築 – 3 –

目次

ステップ5 :

mod_tile のインストール

ステップ6:

Mapnik スタイルシートの生成

ステップ7:

renderd 設定

ステップ8:

apache コンフィグ

あなたのタイル張りのWeb地図を表示します

Leaflet

コメントを残すコメントをキャンセル

keizoh.com

目次

ステップ5 :

mod_tile のインストール

ステップ6:

Mapnik スタイルシートの生成

ステップ7:

renderd 設定

ステップ8:

apache コンフィグ

あなたのタイル張りのWeb地図を表示します

Leaflet

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル