2

Using the leaflet minimap plugin to build a map with locator window.

The map starts zoomed at the state level, with minimap hidden on load via this:

var miniMap = new L.Control.MiniMap(layers, { minimized: true, zoomLevelFixed: 9 });

When a user selects a site from the drop-down list, the main map pans/zooms to that site using setView, and the mimimap is unhidden via this:

miniMap._setDisplay(miniMap.options.minimized = false);

However, I'm getting a conflict on initial load, where by the minimap will not pan/zoom to proper place when called like this (main map pans and zooms correctly):

map.setView([40.22087,-74.99483], 18);

Minimap will move to the proper spot, however when initially called in this manner:

map.setZoom(18);
map.setView([39.85019,-75.43627]);

However, calling it that way causes setzoom to break when toggling between points (if map has been panned/zoomed manually before switching points).

You can see the minimap behavior in this JSBin:

https://jsbin.com/lesokutona/edit?js,output

if you select "PH-07" on load. PH-67 uses the second method of setting location/zoom for comparison purposes. (to see the odd behavior when switching points, select PH-07 and zoom/pan, then switch to PH-67.

So there's a conflict here somewhere, but I can't seem to nail it down.

I'm thinking that changing the mimimap's display option is somehow interrupting its location change initially, but I can't seem to figure out how to prevent that (nor does that really explain why calling it via the second method works). I've tried setting it off in it's own function, but that doesn't seem to address the issue.

The second method's setzoom/setview conflict is fairly obvious, but I can't see how that would allow the minimap to plan correctly initially if the other one does not.

I thought maybe it was a bounds issue... but disabling that didn't affect it either.

Anyone have any ideas?

2

Solved my own question by just changing the minimized toggle to an addTo/removeFrom:

function toggleon() {
        if (toggle == 0) {
        miniMap.addTo(map);
        toggle = 1;
        map.removeLayer(missilegroup);
        };
};

... which seems to have solved all the behavioral issues.

Don't know why I didn't think of that yesterday, but anyway.

Carry on.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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