1

I am trying to make a custom map with leafletjs, and i've figured it out for the version 0.6.x but when it comes to the latest version (0.7.x) it does not work.

This is the code that works with 0.6.x

Anyone has had this issue before?

var mapMinZoom = 0;
    var mapMaxZoom = 5;
    var map = L.map('wu-map', {
      maxZoom: mapMaxZoom,
      minZoom: mapMinZoom,
      crs: L.CRS.Simple
    }).setView([0, 0], mapMaxZoom);

    var mapBounds = new L.LatLngBounds(
      map.unproject([0, 3072], mapMaxZoom),
      map.unproject([4352, 0], mapMaxZoom));

    map.fitBounds(mapBounds);

    L.tileLayer('images/map/{z}/{x}/{y}.png', {
      minZoom: mapMinZoom, maxZoom: mapMaxZoom,
      bounds: mapBounds,
      attribution: 'Rendered with <a href="http://www.maptiler.com/">MapTiler</a>',
      noWrap: true,
      tms: false
    }).addTo(map);
4
  • What error do you get? Commented Dec 10, 2015 at 9:51
  • No error, the map just does not get displayed, though it works perfectly with the version 0.6.x
    – sadiqevani
    Commented Dec 10, 2015 at 9:59
  • Do you mean that map is not shown at all (even zoomIn and zoomOut buttons) or tile layer is not being loaded? Commented Dec 10, 2015 at 10:13
  • only the map is not being shown, the other elements zoomin buttons work.
    – sadiqevani
    Commented Dec 10, 2015 at 12:33

1 Answer 1

1

There is a bug in leaflet.js 0.7 version that appears when crs option is set to L.CRS.Simple value (and not only). Leaflet 0.7 introduced L.CRS.getSize (a function which returns the size of the world in pixels for a particular zoom for particular coordinate reference system), which by default calls and returns the same value as L.CRS.scale. It works great for the default CRS and fails for others.

All I can suggest is to remove crs: L.CRS.Simple from your options object, it will be set to default value (L.CRS.EPSG3857):

var map = L.map('wu-map', {
  maxZoom: mapMaxZoom,
  minZoom: mapMinZoom
}).setView([0, 0], mapMaxZoom);
0

Not the answer you're looking for? Browse other questions tagged or ask your own question.