<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>写真撮影位置</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@0.7.3/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet@0.7.3/dist/leaflet.js"></script>

<!-- plugin -->
    <script src='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/Leaflet.fullscreen.min.js'></script>
    <link href='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/leaflet.fullscreen.css' rel='stylesheet' />
<!-- plugin -->


<style>
  body {padding: 0; margin: 0}
  html, body, #mapdiv {height: 100%; width: 100%;}
  .leaflet-container {background: #fff;}
  .leaflet-div-icon {background: none;white-space: nowrap;border:none;}
</style>
</head>


<body>
<div id="mapdiv">

<script>
function geojson_style(prop) {
  var s = {};
  for(name in prop) {
    if(name.match(/^_/) && !name.match(/_markerType/)){
      if( prop['_markerType']=='Circle' && name =='_radius'){continue;}
      s[name.substr(1)]=prop[name];
    }
  }
  return s;
}

function popup_properties(prop) {
  var s = ''
  for(name in prop) {
    if(!name.match(/^_/)){
      s += name + "：" + prop[name] + "<br>";
    }
  }
  return s;
}



//背景地図設定
var std = L.tileLayer(
  'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png',
  {
    attribution: "<a href='http://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル（標準地図）</a>", 
    maxNativeZoom: 18,
    maxZoom: 20,
    opacity:1
  }
);



var map = L.map('mapdiv', {
  center: [*--センター緯度、経度--*], zoom: 12, layers: [std]
});


L.control.scale({imperial: false}).addTo(map);

var baseLayers = {"地理院タイル（標準地図）": std};


map.addControl(new L.Control.Fullscreen({
  title: {
    'false': '最大化',
    'true': '元に戻す'
  }
}));


</script>
</body>

</html>

