document.addEventListener("DOMContentLoaded", () => { var mymap = L.map("mymap").setView([38.89, 139.82], 14); var gsimap = L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', { attribution: '<a href="http://maps.gsi.go.jp/development/ichiran.html">国土地理院</a>' }).addTo(mymap); var gsiSatellite = L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/seamlessphoto/{z}/{x}/{y}.jpg', { attribution: '<a href="http://maps.gsi.go.jp/development/ichiran.html">地理院衛星画像</a>' }); var osmtopo = L.tileLayer('//{s}.tile.opentopomap.org/{z}/{x}/{y}.png', { attribution: '© OpenStreetMap contributions, SRTM | map style: © OpenTopoMap' }); L.control.scale().addTo(mymap); //ここから好きな店へのルートを足す ラーメンたろう! var ramenTaro = [ //地理院地図で右クリックして下に出る値をもらう [38.894440,139.819973], [38.896644,139.819919], [38.903913,139.816604], [38.904276,139.814882], [38.904985,139.814919] ]; var taroProp = {color: "purple", opacity: 0.6, weight: 8}; var taroRoute = L.polyline(ramenTaro, taroProp).addTo(mymap); //ルートの追加 //お店を囲む var taroPolygon = [ [38.904944,139.814946], [38.904944,139.814683], [38.905048,139.814683], [38.905048,139.814946] ]; var polyProp = { color: "black", fillColor: "orange", fillOpacity: 0.5} var taroTenpo = L.polygon(taroPolygon, polyProp).addTo(mymap); taroTenpo.bindPopup("ここが店だよーおお"); L.control.layers( {'地理院地図': gsimap, '地理院衛星画像': gsiSatellite, 'OSM Topo': osmtopo}, {'たろうへの道順': taroRoute, 'たろう店舗': taroTenpo} ).addTo(mymap); }, false);