openstreetmap-carto是openstreetmap的默认地图风格，广受好评，各方面均衡，是离线地图的常用选择。

搭建的主要步骤基本围绕使用 osm 数据做一个自己的 PostGIS 数据库这篇文章展开。

我们完成1、2、3步骤后，再导入 osm 数据前要做一些修改

4. 依据 openstreetmap-carto 样式导入数据

仍然是安装好 osm2pgsql 工具，下载好中国区 pbf 数据，之后我们要准备样式包

# 下载openstreetmap-carto相关数据文件
git clone https://github.com/gravitystorm/openstreetmap-carto.git

# 导入数据，手动指定carto样式文件
osm2pgsql -c -d china -G --slim --hstore --style /home/openstreetmap-carto/openstreetmap-carto.style --tag-transform-script /home/openstreetmap-carto/openstreetmap-carto.lua -C 2000 -p china -r pbf /home/CN

5. 执行各种脚本

进入 clone 下来的openstreetmap-carto文件夹

5.1 索引

首先是建立数据库索引，可以加快渲染访问的速度，这步是可选的

psql -d gis -f indexes.sql

5.2 下载 shapefile

样式中用到了海岸线、水域等 shp 文件，需要手动下载，文件较大，openstreetmap-carto已经提供了下载脚本

scripts/get-shapefiles.py

如果下载出错，加上-s关闭 shapeindex

scripts/get-shapefiles.py -s

如果实在网络不行，可以根据安装指南中说明手动下载这些文件，放在openstreetmap-carto/data目录下就好

5.3 下载字体

如果是用了 Ubuntu/Debian 服务器，可以直接安装

sudo apt-get install fonts-noto-cjk fonts-noto-hinted fonts-noto-unhinted fonts-hanazono ttf-unifont

其他系统也可以手动下载字体文件并安装

6. 渲染

准备好nodejs环境，渲染工具使用 tilestrata 这个服务端工具，配合 tilestrata-mapnik 插件就可以生成供地图调用的瓦片。

具体的 demo 项目可以参考tilestrata-sample-code

对应的文章可以看一下这篇tilestrata-mapnik 使用

6.1 准备 mapnik 配置文件

因为使用了 mapnik，要将openstreetmap-carto的project.mml转换成 mapnik 可识别的 xml 文件

打开文件夹下面的project.mml文件，找到如下字段，修改成你数据库的相关配置信息

安装carto工具包进行转换

sudo npm install -g carto
carto project.mml > osm.xml

6.2 准备服务端

clone 项目tilestrata-sample-code，将项目里面/src/mapnik/目录下index.js增加以下内容

server
  .layer('osm')
  .route('tile.png')
  .use(
    mapnik({
      pathname: 'style/osm.xml'
    })
  )

将openstreetmap-carto文件夹下面的data，symbols，osm.xml（刚生成的）三个文件（夹）拷贝到tilestrata-sample-code的style文件夹下，拷贝完成的目录结构如下所示：

安装相关依赖并启动项目

npm install
npm start

将/example/mapnik.html文件里的 tileLayer 地址换成"http://127.0.0.1:9527/osm/{z}/{x}/{y}/tile.png",，打开文件即可看到效果

7 对比结果

官网
官网效果

我们自己生成的