2019-Onodera/kanappe.html at master - HiroseLabo./2019-Onodera

Fork: 0

HiroseLabo. / 2019-Onodera

Find file

Newer

Older

2019-Onodera / kanappe.html

Stellercaigyuu on 17 Oct 2019 1 KB ddd

Raw Blame History

<!DOCTYPE html>
<html>
  <head>
    <title>Leaflet Demo5</title>
  	<meta charset="utf-8">
  	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin="">
    <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>
    <style type="text/css">
     <!--
      #mapid { height: 400px; width: 600px}
    -->
    </style>
  </head>
  <body>
    <div id="mapid"></div>
 
    <script>
 
      var mymap = L.map('mapid');
 
      L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    		maxZoom: 18,
    		attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, '
    	}).addTo(mymap);
 
      function onLocationFound(e) {
          L.marker(e.latlng).addTo(mymap).bindPopup("現在地").openPopup();
      }
 
      function onLocationError(e) {
          alert("現在地を取得できませんでした。" + e.message);
      }
 
      mymap.on('locationfound', onLocationFound);
      mymap.on('locationerror', onLocationError);
 
      mymap.locate({setView: true, maxZoom: 16, timeout: 20000});
 
    </script>
  </body>
</html>