dayjournal memo

Total 974 articles!!

OpenLayers #026 – MapTilerのベクトルタイル表示

Yasunori Kirimoto's avatar


画像



MapTilerのベクトルタイルを表示するメモ。



画像



パッケージインストール

npm install ol-mapbox-style

script.js

import Map from "ol/Map";
import View from "ol/View";
import { fromLonLat } from "ol/proj";
import olms from "ol-mapbox-style";

// MIERUNE Streets読み込み
const styleJson =
  "https://api.maptiler.com/maps/jp-mierune-streets/style.json?key=[APIキー]";
const map = new Map({
  target: "map",
  view: new View({
    center: fromLonLat([139.767, 35.681]),
    zoom: 14,
  }),
});
olms(map, styleJson);



OpenLayersを手軽に始めるビルド環境公開しています。
openlayers-starter



book

Q&A