Node.js + osm-static-maps에서 OpenStreetMap 또는 지리원지도 이미지 얻기

개요

osm-static-maps 설치

$ npm install osm-static-maps

OpenStreetMap의지도 이미지 얻기

'use strict'

const osmsm = require('osm-static-maps');
const fs = require('fs');

(async () => {

  try {

    // 地図画像の Buffer オブジェクトを取得
    const imageBinaryBuffer = await osmsm({
      width:  800, // 画像の横幅(ピクセル)
      height: 600, // 画像の縦幅(ピクセル)
      center: '136.882090,35.170560', // 経度,緯度
      zoom: 20, // ズームレベル
      type: 'png' // PNG 画像フォーマット
    })

    // 地図画像データをファイルに出力
    await fs.promises.writeFile('osm.png', imageBinaryBuffer)
    process.exit(0);

  } catch (err) {
    console.error(err);
    process.exit(1);
  }
})();

지리원 지도의 지도 이미지 가져오기

'use strict'

const osmsm = require('osm-static-maps');
const fs = require('fs');

(async () => {

  try {
    // 国土地理院の地理院タイルを使う
    const tileserverUrl = 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png'
    const attribution = 'osm-static-maps / 出典: 地理院タイル'

    // 地図画像の Buffer オブジェクトを取得
    const imageBinaryBuffer = await osmsm({
      tileserverUrl: tileserverUrl,
      attribution: attribution,
      width:  800, // 画像の横幅(ピクセル)
      height: 600, // 画像の縦幅(ピクセル)
      center: '136.882090,35.170560', // 経度,緯度
      zoom: 14, // ズームレベル
      type: 'png' // PNG 画像フォーマット
    })

    // 地図画像データをファイルに出力
    await fs.promises.writeFile('chiriin.png', imageBinaryBuffer)
    process.exit(0);

  } catch (err) {
    console.error(err);
    process.exit(1);
  }
})();

참고 자료