leaflet.layerscontrol-minimap icon indicating copy to clipboard operation
leaflet.layerscontrol-minimap copied to clipboard

Problem integrating this control with google mutant

Open ghost opened this issue 8 years ago • 7 comments
trafficstars

Hi I was using your control with no problems with tileLayers, but when I started using this plugin: https://gitlab.com/IvanSanchez/Leaflet.GridLayer.GoogleMutant, and try to load layers generated by that plugin, I get an error:

L.Control.Layers.Minimap.js:290 Uncaught Unknown layer, cannot clone this layer. Leaflet-version: 1.0.3

This is how I use it:


var trafficMutant = L.gridLayer.googleMutant({
			maxZoom: 24,
			type:'roadmap'
		});
trafficMutant.addGoogleLayer('TrafficLayer');
 L.control.layers.minimap({
            'Open street map': tileLayer1,
            'Stamen.Watercolor': tileLayer2,
            'OpenStreetMap.BlackAndWhite': tileLayer3,
            'OpenStreetMap.BlackAndWhite.HOT': tileLayer4,
            'Traffic':trafficMutant // This causes trouble

        }, null, {
            collapsed: true
        }).addTo(this.mymap);

Note the referenced plugin works well if I use standard control for choosing between base and tile layers. Can you help?

ghost avatar May 04 '17 08:05 ghost

Actually I think I fixed this issue, by changing something inside your js file Control.Layers.MiniMap.js:

function cloneLayer (layer) {
    ....

    if(layer instanceof L.GridLayer) // added this
        return L.gridLayer();

But can you make this update so that it is available on NPM?

NOPE: It doesn't work completely correct, I can select this new tile layer, but its preview (small version of the map) is not being shown in the control.

ghost avatar May 04 '17 09:05 ghost

That line of code is from jieter/leaflet-clonelayer, it should be fixed there.

jieter avatar May 04 '17 12:05 jieter

@jieter Do you have idea how to fix it? Like I said the solution I used above doesn't completely fix it. The minimap of the gogle mutant layer shows a gray area inside the control after I applied that fix.

Yeah strangely the cloneLayer function exists inside this plugin source and also inside clone layer plugin.

PS. Also in case of your fix, the npm package would be updated.

ghost avatar May 04 '17 16:05 ghost

@giorgim yes I know how to fix this. The question is, should leaflet-clonelayer support plugins like this?

in this line, leaflet-clonelayer is required, I think you are looking at the built version in L.Control.Layers.Minimap.js.

jieter avatar May 04 '17 19:05 jieter

@jieter OK maybe you can write here how to fix that in that case, I would at least copy locally your plugin and amend the change there. Also could be useful for others if they encounter this page.

(My solution worked partially: I could select mutant layer inside control, but minimap of mutant layer showed grey area - actually if I resized window sometimes even the minimap version would show up correctly)

ghost avatar May 04 '17 19:05 ghost

Yes, but it would be better if others can use it too. If I show you how to fix it, can you try to open a PR to contribute it to leaflet-clonelayer? I'll make sure it gets released on npm then.

Basically, what you need to do is:

  • check if L.GridLayer.GoogleMutant is defined (to make sure leaflet-clonelayer still works when not used together with Google Mutant.
  • check if the layer is a Google Mutant layer: layer instanceof L.GridLayer.GoogleMutant.
  • return a cloned version of the Google Mutant layer: return L.gridLayer.googleMutant(layer.options);

jieter avatar May 04 '17 20:05 jieter

Even with https://github.com/jieter/leaflet-clonelayer/pull/6#, this still doesn't work perfectly.

giovanism avatar Jul 10 '18 07:07 giovanism