title: Assigning real coordinates to Image map in Leaflet
body: <p>I am working on a floor map which is an Image, where I want to assign real coordinates to the map, So when I click anywhere on map I should get the real coordinates. I have completed almost everything but don't know how can I assign real coordinates to map. </p>
  
  <p>I am new to Leaflet.</p>
  
  <pre><code>var map = L.map('image-map', {
    minZoom: 1,
    maxZoom: 4,
    center: [0, 0],
    zoom: 1,
    crs: L.CRS.Simple
  });
  
  // dimensions of the image
  var w = 2000,
      h = 1500,
      url = 'http://kempe.net/images/image-of-a-floor.jpg';
  
  // calculate the edges of the image, in coordinate space
  var southWest = map.unproject([0, h], map.getMaxZoom()-1);
  var northEast = map.unproject([w, 0], map.getMaxZoom()-1);
  var bounds = new L.LatLngBounds(southWest, northEast);
  
  // add the image overlay, 
  // so that it covers the entire map
  L.imageOverlay(url, bounds).addTo(map);
  </code></pre>