javascript - How to prevent leaflet from loading tiles outside map area? -
i have map 8576x8576, , keep getting console errors:
failed load resource: net::err_file_not_found
because leaflet trying load tiles doesn't exists. have bounds set , maxbounds prevent panning outside map area (to keep map on center of screen).
var map = l.map('map', { maxzoom: mapmaxzoom, minzoom: mapminzoom, zoomcontrol: false, crs: l.crs.mysimple }).setview([0, 0], 3); l.tilelayer('assets/map/{z}_{x}_{y}.jpg', { minzoom: mapminzoom, maxzoom: mapmaxzoom, tilesize: 268, nowrap: true, reusetiles: true, tms: false, bounds: mybounds, errortileurl: "assets/map/404.jpg", continuousworld: true }).addto(map); new l.control.zoom({position: 'topright'}).addto(map); var sidebar = l.control.sidebar('sidebar').addto(map); var mybounds = [[-8576 / 2, -8576 / 2],[8576 / 2, 8576 / 2]]; map.setmaxbounds([[-5600, -5600], [5600, 5600]]);
what doing wrong? why leaflet keeps trying load tiles?
i tried set maxbounds this:
map.setmaxbounds([[-8576 / 2, -8576 / 2],[8576 / 2, 8576 / 2]]);
and still errors.
you need define mybounds
before creating tilelayer
. if bounds lie on edges of tiles, may need bring bounds in tiny amount keep map trying load adjoining tiles. here example osm tiles:
Comments
Post a Comment