Wechat: yu389741| Email: gisdqy@163.com


在Ubuntu16.04系统上搭建OSM 瓦片服务器


Step 1: 更新Ubuntu的软件库

    # sudo apt update

    # sudo apt upgrade


Step 2: 使用PostGIS安装PostgreSQL数据库服务器

We will usePostgreSQL to store map data. PostGIS is a geospatial extenstion to PostgreSQL.Run the following commands to install them.

# sudo apt install postgresql postgresql-contrib postgis postgresql-9.5-postgis-2.2


A usernamed postgres will be created during the installation process. Thisallows the use of peer authentication. Let’s switch tothe postgres user:

# sudo -u postgres -i


Create a PostgreSQL database user osm

    # createuser osm


Create adatabase named gis andat the same time make osm as the owner of the database. -EUTF8 specifies the character encoding scheme to be used in the database isUTF8.

# createdb -E UTF8 -O osm gis


Create hstore and postgis extension.

# psql -c "CREATE EXTENSION hstore;" -d gis
# psql -c "CREATE EXTENSION postgis;" -d gis


Exit from the postgres user.

# exit


Create osmuseruser on your operating system so the tile server can run as osmuser user.

# sudo adduser osmuser



Step 3: 下载地图样式表和地图数据

First switch to osmuser user

  # su – osmuser


Download the latest CartoCSS mapstylesheets to the osmuser user’s homedirectory.

  # wget https://github.com/gravitystorm/openstreetmap-carto/archive/v2.41.0.tar.gz


Extract it.

  # tar xvf v2.41.0.tar.gz


Next, download map data to the osmuser user’s home directory. Use the belowcommand to download the map data of the whole planet (32G).

  # wget -c http://planet.openstreetmap.org/pbf/planet-latest.osm.pbf

【If you want a map of individual country orstate, go to http://download.geofabrik.de.Also, BBBike.org provides extractsof more than 200 cities and regions world-wide in different formats.】


For example, download the map data of GreatBritain (847M).

# wget -c http://download.geofabrik.de/europe/great-britain-latest.osm.pbf


Now exit from the osmuser user.



Step 4: 将地图数据导入PostgreSQL

To import mapdata, we need to install osm2pgsql which converts OpenStreetMap datato postGIS-enabled PostgreSQL databases.

  # sudo apt install osm2pgsql


Switch to osmuseruser again.

       #su – osmuser


Run thefollowing command to load map stylesheet and map data into the gis Database. Replace great-britain-latest.osm.pbf withyour own map data file.

# osm2pgsql --slim -d gis -C 3600 --hstore -S openstreetmap-carto-2.41.0/openstreetmap-carto.style great-britain-latest.osm.pbf


Once the import is complete, exit fromthe osmuser user.


Step 5: 安装mod_tile

mod_tile 是一个瓦片服务必须的Apache模块. 目前没有二进制包可用于Ubuntu。 我们可以从Github存储库编译它。

First install build dependency.

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


Then clone the repository from Github.

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


Compile and install

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


Step 6: 生成Mapnik样式表


Install required packages.

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


Switch to osmuseruser.

# su – osmuser


cd into the carto style directory.

# cd openstreetmap-carto-2.41.0/


Get shapefiles.

# ./get-shapefiles.sh


Now build the Mapnik xml stylesheet.

# carto project.mml > style.xml


Exit from the osmuseruser.

  # exit


Step 7:渲染配置

Edit renderd config file.

  # sudo nano /usr/local/etc/renderd.conf

In the [default] section, change the value of XML and HOSTto the following.

XML=/home/ osmuser /openstreetmap-carto-2.41.0/style.xml

In [mapnik] section, change the value of plugins_dir.


Save the file.


Install renderd init script by copying thesample init script.

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


Grant execute permission.

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


Edit the init script file

    # sudo nano /etc/init.d/renderd

Change the following variable.

DAEMON_ARGS="-c /usr/local/etc/renderd.conf"

Save the file.


Create the following file and set osmuser the owner.

    # sudo mkdir -p /var/lib/mod_tile
# sudo chown osmuser: osmuser /var/lib/mod_tile


Then start renderd service

    # sudo systemctl daemon-reload
# sudo systemctl start renderd
# sudo systemctl enable renderd (若出现错误,改用下面指令来使能renderd)
[# sudo /lib/systemd/systemd-sysv-install enable renderd]


Step 8: Apache Web服务器配置

Install Apache web server

    # sudo apt install apache2


Create a module load file.

    # sudo nano /etc/apache2/mods-available/mod_tile.load

Paste the following line into the file.

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


Create a symlink.

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


Then edit the default virtual host file.

# sudo nano /etc/apache2/sites-enabled/000-default.conf


Paste the following lines in <VirtualHost*:80>

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

Save and close the file.


Restart Apache.

# sudo systemctl restart apache2


Then in your web browser address bar, type





平铺网络地图在OpenStreetMap术语中也称为滑动地图。 有两个免费的和开放源码的JavaScript地图库可以用于你的tile服务器:OpenLayer和Leaflet。 Leaflet的优点是使用起来很简单,而且您的地图将移动流畅。


Openlayers是一个开源的Javascript库(基于修改过的BSD许可发布),用来在Web浏览器显示地图。它提供API接口创建类似于Google Maps和Bing Maps的基于web的地理应用。这个库包括Rico和Prototype框架。


# cd /var/www/html
# sudo wget https://github.com/openlayers/openlayers/releases/download/
# sudo unzip v4.3.4.zip


Next, create the index.html file.

# sudo nano/var/www/html/index.html

Paste the following HTMLcode in the file. Replace red-colored text and adjust the longitude, latitudeand zoom level according to your needs.





<linkrel=”stylesheet” href=”http://your-server-ip/v4.3.4/css/ol.css“type=”text/css”>



  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;





  <a class=”skiplink”href=”#map”>Go to map</a>

  <div id=”map”class=”map” tabindex=”0″></div>

  <button id=”zoom-out”>Zoomout</button>

  <button id=”zoom-in”>Zoomin</button>


    var map = new ol.Map({

      layers: [

        new ol.layer.Tile({

          source: new ol.source.OSM({

             url: ‘http://your-server-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],





  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);





Save and close the file.

Now you can view your slippy map by typing yourserver IP address in browser.

【eg: Writein browser—> your-server-ip/index.html】




Leftlet 是一个开源的适合移动设备的交互式地图的JavaScrip库。


To display your slippy map with Leftlet, download JavaScript and CSSfrom leftletjs.com andextract it to the web root folder.


# cd /var/www/html/
# sudo wget http://cdn.leafletjs.com/leaflet/v1.2.0/leaflet.zip
# sudo unzip leaflet.zip


Next, create the index.html file.

# sudo nano /var/www/html/index.html

Paste the following HTML code in the file. Replace red-colored textand adjust the longitude, latitude and zoom level according to your needs.

<title>My first osm</title>
<link rel="stylesheet" type="text/css" href="leaflet.css"/>
<script type="text/javascript" src="leaflet.js"></script>
  <div id="map"></div>
    var map = L.map('map').setView([53.555,9.899],5);

Save and close the file.

Now you can view your slippy map by typing yourserver IP address in browser.

【eg: Writein browser—> your-server-ip/index.html】