Norkart / Leaflet-MiniMap

A minimap control plugin for Leaflet
BSD 2-Clause "Simplified" License
395 stars 125 forks source link

Functional Tiles? #33

Closed DrYSG closed 11 years ago

DrYSG commented 11 years ago

I am not quite sure what the issue is. I see the mini-map control in the lower right. I have the toggle working. But the MiniMap content is not showing (only the outline).

I suspect it has to do with the fact that my tiles are coming from an PouchDB IDB DB (Chrome 26) and not a url.

I have a list of base layers kept in MAP.baseLayers (they are tile layers): I add the control as follows

var globe = MAP.baseLayers["BigBlueMarble"];

MAP.map.addControl(new L.Control.MiniMap(globe, { toggleDisplay: true }));

The Functional Tile Layer is a leaflet plugin

I am not seeing warnings about tiles not found (at least not at the zoom of the minimap).

Or, maybe the error is that I am also have a layer control where I can switch Map.baseLayers?

My variant adds this:

function makeLayer(Class, Type, settings) { var label = {}; DB[Type] = Pouch(Type); var layer = new L.TileLayer.Functional(function (view) { var deferred = $.Deferred(); var id = view.zoom + "-" + view.tile.column + "-" + view.tile.row; DB[Type].getAttachment(id + "/pic", function (err, response) { if (err) { console.warn("Could find blob id: ", Type + "." + id, " error: ", err.error, " reason: ", err.reason, " status: ", err.status); } else { var blob = response; var imgURL = URL.createObjectURL(blob); deferred.resolve(imgURL); // let leaflet know we're done, and give it the URL URL.revokeObjectURL(imgURL); // not sure if we're revoking it too soon here } }); return deferred; }, settings); MAP.map.addLayer(layer); label[Type] = layer; if (Class == "BASE") { $.extend(MAP.baseLayers, label); } else { $.extend(MAP.overlays, label); } }

DrYSG commented 11 years ago

There is something really odd happening here (I probably need to create a CodePen to demo properly). But that will take a little work, The enclosed screen shot might help. What I see is that instead of the minimap having its content int he lower right, it is actually in the top left????? The gray base area is not correct, since there is zoom+5 data for that area, also, when I enable the minimap, the zoom controls for leaflet stop working. This is very odd (running leaflet 0.6).

image

DrYSG commented 11 years ago

A little light bulb went off, I am using L.CRS.EPSG4326, for the map projection, which might well account for the displacement of the map.

What do you think?

robpvn commented 11 years ago

I think you really need a CodePen/JSFiddle to reproduce a minimal test case for this. As it stands, there are three possible things I can think of straight away: It might be to do with the projection, it might be that you have reused the same layer object for the map and the minimap, or it might be that one of the other plugins you have is breaking it. (Could be the funcional tiles plugin.)

You should try to deactivate other plugins one by one until you have something that works, that would tell us what's wrong.

DrYSG commented 11 years ago

I have a CodePen demo of the bug.

  1. use CHROME (PouchDB has issues with FireFox and IE right now)
  2. Run http://codepen.io/DrYSG/pen/kdzft and press [Download], which will fill your IndexedDB with map tiles
  3. Run http://codepen.io/DrYSG/pen/ICzro and the map will display

I see two problems, one is that the mini-map breaks the zoom out control (compare this with http://codepen.io/DrYSG/pen/mcdCq which disables the minimap)

Also, I cannot use the minimap to scroll the window to the right place.

robpvn commented 11 years ago

Regarding CRS'es, I believe that following pull request #26 they shouldn't present an issue. I think what is happening here is that the functional tile layers use of deferred methods is creating trouble for the event listeners the minimap uses to keep track of the map.

I think this case is too special to try to fix in the minimap plug-in, as we've never guaranteed that it will work with every other kind of plug-in. (Trying to fix it here might break lots of other stuff...) In your case I'm afraid the best solution is to simply not use the minimap, sorry. :-/

DrYSG commented 11 years ago

Would not the FunctionalTiles (deferred) cause the same problems for the main map? (I have not problem with the drawing plug-in, GPS, or other plug-ins with FunctionalTiles).

I am just thinking that I did something stupid in the way I am using the MiniMap.

DrYSG commented 11 years ago

I might look into your source (pretty short) since I really need this for my offline map app, which cannot have full base maps for the world, and minimaps help a lot in figuring things out.

robpvn commented 11 years ago

You're welcome to take a look, and if you find a fix that works for everyone I'd be happy to include it! What I think is happening is that the minimap is listening for movement events that get fired on user movement, but gets map state from the map. So when the map state changes are deferred, the minimap recognises a user action and gets the map state, but the map state hasn't changed yet which causes it to ask the map to do the wrong thing.

Not totally sure though, but it doesn't really look like anything is obviously wrong in your example.