Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!doctype html>
<html>
  <head>
    <title>WMS And Nomatim geocoding</title>
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
    <style>
      html, body, #map {
        margin: 0px;
        height: 100%;
        width: 100%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
      var map = L.map('map', {
        center: [46.28,4.32],
        zoom: 5,
        doubleClickZoom: false
      });
      L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
      map.on({
        'dblclick': function(e) {
          $.getJSON('http://nominatim.openstreetmap.org/reverse?',
            {format: 'json',lat: e.latlng.lat, lon: e.latlng.lng,
             zoom: e._zoom, polygon_geojson: 1}, function(data) {
              console.log(data);
              L.geoJSON(data.geojson, {
                'onEachFeature': function (feature, layer) {
                    layer.bindPopup(data.display_name);
                }
              }).addTo(map);
            });
          }
      });
    </script>
  </body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers