画像




指定位置にズームするメモ。


オプションとして指定。

Option Description
center 移動先の経緯度
zoom 移動時のズームレベル
speed 移動時の速度




画像




script.js


// MIERUNE MONO読み込み
var map = new mapboxgl.Map({
container: "map",
style: {
"version": 8,
"sources": {
"MIERUNEMAP": {
"type": "raster",
"tiles": ['https://tile.mierune.co.jp/mierune_mono/{z}/{x}/{y}.png'],
"tileSize": 256
}
},
"layers": [{
"id": "MIERUNEMAP",
"type": "raster",
"source": "MIERUNEMAP",
"minzoom": 0,
"maxzoom": 18
}]
},
center: [139.767, 35.681],
zoom: 11
});

map.on('load', function () {

// 指定位置にズーム
map.flyTo({
center: [140.9, 36.9],
zoom: 10,
speed: 0.3
});

});

// コントロール関係表示
map.addControl(new mapboxgl.NavigationControl());






Mapbox GL JSを手軽に始めるビルド環境公開しています。
mapboxgljs-starter







Q&A