osm-static-maps

授权协议 GPL-2.0 License
开发语言 SHELL
所属分类 应用工具、 终端/远程登录
软件类型 开源软件
地区 不详
投 递 者 乜清野
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

osm-static-maps

Openstreetmap static maps is a nodejs lib, CLI and server open source inspired on google static map service

Here you have a demo. Also a dynamic version of the demo, for testing purposes.

(heroku demo might be unstable because of too many requests being made to it, a real server costs money and we are not collecting any for this project yet)

How to use

1. CLI

sudo npm i -g osm-static-maps
osmsm --help
osmsm -g '{"type":"Point","coordinates":[-105.01621,39.57422]}' > map.png
  • note: if you have this error trying to install globally Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/osm-static-maps/node_modules/puppeteer/.local-chromium', it's caused by this pupeteer issue https://github.com/puppeteer/puppeteer/issues/367, you can workaround by installing globally with the unsafe-perm flag:
sudo npm i -g osm-static-maps --unsafe-perm=true

2. nodejs library

npm install osm-static-maps
// index.js old school
osmsm = require('osm-static-maps');
osmsm({geojson: geojson})
  .then(function(imageBinaryBuffer) { ... })
  .catch(function(error) { ... })

// index.js modern style (also supports typescript)
import osmsm from 'osm-static-maps'
const imageBinaryBuffer = await osmsm({geojson})

3. Standalone sample server

sudo npm i -g osm-static-maps
osmsm serve

Or you can use docker-compose

git clone git@github.com:jperelli/osm-static-maps.git
cd osm-static-maps
docker-compose up

4. Cloud service

You can use the heroku-hosted alternative directly here

heroku server might be unstable because of too many requests being made to it, a real server costs money and we are not collecting any for this project yet.

API Reference

All parameters have a short and long version. The short version can be used only with the shell CLI. The long version can be used with the library and can be passed to the app server as GET query params, or POST json body (remember to set the header Content-Type: application/json)

Parameter Description Default Value
g geojson geojson object to be rendered in the map undefined
f geojsonfile filename or url to read geojson data from (use '-' to read from stdin on CLI) undefined
H height height in pixels of the returned img 600
W width height in pixels of the returned img 800
c center center of the map lon,lat floats string (center of the geojson) or '-57.9524339,-34.921779'
z zoom zoomlevel of the leaflet map if vectorserverUrl available, use 12 else 20
Z maxZoom max zoomlevel of the leaflet map 17
A attribution attribution legend 'osm-static-maps / © OpenStreetMap contributors'
t tileserverUrl url of a tileserver 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
m vectorserverUrl url of a vector tile server (MVT style.json) undefined
M vectorserverToken token of the vector tile server (MVT) 'no-token'
D renderToHtml returns html of the webpage containing the map (instead of a binary image) false
F type format of the image returned ('jpeg'/'png') 'png'
q quality quality of the image returned (0-100, only for jpg) 100
x imagemin enable lossless compression with optipng / jpegtran false
X oxipng enable losslsess compression with oxipng false
a arrows render arrows to show the direction of linestrings false
s scale enable render a scale ruler (boolean or a json options object) false
T timeout miliseconds until page load throws timeout 20000
k markerIconOptions set marker icon options (a json options object) *see note undefined (leaflet's default marker)
S style style to apply to each feature (a json options object) *see note undefined (leaflet's default)
e haltOnConsoleError throw error if there is any console.error(...) when rendering the map image false
  • Note on markerIconOptions: it's also accepted a markerIconOptions attribute in the geojson feature, for example {"type":"Point","coordinates":[-105.01621,39.57422],"markerIconOptions":{"iconUrl":"https://leafletjs.com/examples/custom-icons/leaf-red.png"}}

  • Note on style: it's also accepted a pathOptions attribute in the geojson feature, for example {"type":"Polygon","coordinates":[[[-56.698,-36.413],[-56.716,-36.348],[-56.739,-36.311]]],"pathOptions":{"color":"#FF5555"}} (also remember that the # char needs to be passed as %23 if you are using GET params)

Design considerations & architecture

Read the blogpost on the creation of this library and how it works internally

LICENSE

  • GPLv2

Credits

Specially to the contributors of

  • OpenStreetMap
  • Leaflet
  • Puppeteer
  • ExpressJS
  • Handlebars
  • This article from:http://wiki.openstreetmap.org/wiki/OpenLayers_Simple_Example Deploy an OpenStreetMap slippymap on my own website This simple example may help if you are Deploying your own Slippy Map

 相关资料
  • osm

    Open Service Mesh (OSM) Open Service Mesh (OSM) is a lightweight, extensible, Cloud Native service mesh that allows users to uniformly manage, secure, and get out-of-the-box observability features for

  • OSM Player是一个基于jQuery开发、开源的HTML5多媒体播放器。当浏览器不支持HTML5时,可以转成Flash。提供播放列表,播放列表可以隐藏,支持视频全屏播放。

  • 在我的Java应用程序中,我使用的是JMapViewer;地图绘制在JPanel上。是否可能获得与当前缩放级别相对应的地图比例尺?该地图基于著名的墨卡托投影: 投影是共形的,因此局部线性尺度与方向无关。我的想法使用了两个相同的平行点: 改进:初始点p1可以是视图的中心。 像素坐标“以米为单位”进行评估;公式缺少像素大小...

  • 描述: 记录一个静态成员。 概述 @static标签标明一个在父类中的标识符不需实例即可使用。 使用@static标签将重写标识符的默认作用域,但有一个例外:在全局作用域下的标识符将保持他的全局性。 例子 下面的例子可以写成 "@function MyNamespace.myFunction" 并省略@memberof和@static标签,他们的效果是一样的: 例如,在一个虚拟注释中使用@stat

  • 我一直在尝试从OSM文件导出边界信息。我的过程就快完成了,但是我对生成的多边形有一个问题,我正在绘制随机线。 我希望能对我可能出错的地方有一些了解。 步骤1:将OSM数据导出为XML 第2步:运行一个脚本来处理XML。 这会产生一系列的lat/lon,当我将它们构建为多边形时,它们会给出我想要的正确的整体形状。但是,我认为连接线存在问题。。 我的多边形输出 我其实在寻找这个,这是类似的,但我显然错

  • 我想用多边形类和一组lat/lng坐标在谷歌地图上画一个城区区域。 OpenStreetMap为我提供了所需的所有数据——如果我键入一些地区名称,我可以获得OSM XML格式的有用数据,例如拉脱维亚里加“Vecmilgravis”地区的OSM绘制多边形,以及OSM XML格式的数据。 问题是所有这些节点都是按某种奇怪的顺序排序的,因此如果我只提取所有和对,并为Google Maps多边形类创建一个