alexander-arakelyan / leaflet-layer-tree-plugin Goto Github PK

hi,
my old map is working with evens (baselayerchange, overlayadd, overlayremove)
Is there any way to do this using your plugin?

i tryed but without success :(

Is there a way to to add a scrollbar when the layer control container height is greater than the window height?

I can't determine from the "basic example" how to add layers that are NOT described in the JS tree object.

I simply want to create "Overlays", then add some nested layer groups and layers, where those elements are previously created in JS code.

Ideally, it would be as simple as:

let marker = L.marker([lat, lng]);
let treeLayer1 = {
    name: "Dummy",
    layer: marker
};
let tree = {
    code: "overlays",
    name: "Overlays",
    active: true,
    selectedByDefault: false,
    openByDefault: true,
    childLayers: [treeLayer1] };
new L.Control.LayerTreeControl({
    layerTree: tree,
    openByDefault: true,
}).addTo(map);

The question is how to correctly define "treeLayer1", given an existing leaflet layer, e.g. "marker".

Looking at plug-in's source code, this might be as simple as having "traverseLeaf" look for a "layer" property, that is expected to contain a leaflet layer.
I would try to make that change, but I am unsure what to do with that leaflet layer.

I'm trying to get the basic example up and running but eventually am presented with a timeout error. See screenshot 1.

Right-clicking the URL in the error message, followed by Open in new tab displays an empty tab with Connecting... in the status bar for a few minutes. But then times out and displays the following message. See screenshot 2.

geoportal.sovzond.ru took too long to respond

ERR_CONNECTION_TIMED_OUT

EDIT: The Preview: link for the basic example in the README has https vs http request issues.
So basically no way to find out if this is what I'm after.

This looks like a fantastic plugin but if your leaflet map is using ajax to pull any data then this plugin can't be used because it does not support dynamic adding/removing of layers. The reason this is important is that with ajax the layer may take a while to load, if for example you are live loading from PstgreSQL and the layer may therefore not exist at the time that the layer tree is initiated. It would be great if this could be added.

hello actually the license of this plugin is only GPL3. is it possible to switch to a non-contaminant licence like the license from leaflet? https://github.com/Leaflet/Leaflet/blob/master/LICENSE

thanks

Related to my other question regarding dynamically adding layers, I am wondering if this plugin requires that all layers be defined within the tree or if it is possible to create a layer var in the usual way and then construct the tree using the layer variables? Also does this plugin support non WFS layers?

Perhaps I am not understanding the parameters correctly and you could add documentation regarding these parameters:

{ code: "osm", name: "OpenStreetMap", active: true, selectedByDefault: false, openByDefault: true, childLayers: [], selectType: "MULTIPLE", serviceType: "OSM", params: { url: "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" } },

For example if you had a layer var:

var options_gc = {'transparent': true,'tiled': true,'format': 'image/png'};
var source_gc = L.WMS.source("http://geo.weather.gc.ca/geomet/?lang=en&service=WMS&request=GetCapabilities", options_gc);
var cadWeather = source_gc.getLayer('Canadian Weather');

How would you add that to the tree referencing cadWeather?
Thanks.

Does this work within a folium python script? If so, how would you go about implementing it? Let's say I have 3 geojson layers and I want them to all be under one (collapsible) group layer called "Boundaries" with the ability to check on the group layer and the individual sublayers. Please let me know if you have any ideas.

Your links to Preview do not work but your demo from the leaflet home page does. This is the functioning link:
https://rawgit.com/bambrikii/leaflet-layer-tree-plugin/master/examples/basic-example.htm

This is the broken link:
https://htmlpreview.github.io/?https://github.com/bambrikii/leaflet-layer-tree-plugin/blob/master/examples/basic-example.htm

I want that child layers get selected when the parent layer is selected. How to do that?

Hi,

i would like to save the current layer settings (which layers are switched on?) and later enable them again by js.
Saving is not a big problem but how can i enable some layers later?

Background: in my current map (without your layerswitcher) i'll save the layersettings using cookies. Next time the user is using this map, i'll restore the old layer settings.

see: https://wambachers-osm.website/Emergency.html

Hi, i'm using code like this

...
{
                                   code: "fire_stations",
                                   name: "Fire Stations",
                                   active: true,
                                   selectedByDefault: false,
                                   openByDefault: true,
                                   childLayers: [],
                                   selectType: "MULTIPLE",
                                   serviceType: "WFS",
                                   coordinateSystem: "EPSG:4326",
                                   onPopup: function (layer) {
                                       return buildContentFromLayer(layer);
                                   },
                                   params: {
                                       request: "getFeature",
                                       service: "WFS",
                                       typeName: "osm:Fire_Stations",
                                       name: "Fire Stations",
                                       style: "{\"stroke\":true,\"fillColor\":\"red\",\"border\":\"red\",\"weight\":3,\"opacity\":0.5,\"color\":\"red\",\"dashArray\":\"5\",\"fillOpacity\":0.1}",
                                       version: "1.1.0",
                                       url: geosWMS,
                                       outputFormat: "application/json",
                                       icon: "xxx.png"
                                   },
                                },
                                {
                                   code: "fire_hydrants",
                                   name: "Hydrants",
                                   active: true,
                                   selectedByDefault: false,
                                   openByDefault: true,
                                   childLayers: [],
                                   selectType: "MULTIPLE",
                                   serviceType: "WFS",
                                   coordinateSystem: "EPSG:4326",
                                   onPopup: function (layer) {
                                       return buildContentFromLayer(layer);
                                   },
                                   params: {
                                       request: "getFeature",
                                       service: "WFS",
                                       typeNames:  "osm:Hydrants",
                                       name: "Hydrants",
                                       style: "{\"stroke\":true,\"fillColor\":\"blue\",\"border\":\"red\",\"weight\":3,\"opacity\":0.5,\"color\":\"red\",\"dashArray\":\"5\",\"fillOpacity\":0.1}",
                                       version: "1.1.0",
                                       url: geosWMS,
                                       outputFormat: "application/json",
                                       maxFeatures: "1000"
                                   },
                                },

and i'm getting results:

But allways as default markers. As you may see in my layer tree, i'm working with more that one overlay. Therefore i need to style the poi. either via CSS or better using special icons.

Any ideas how that can be done?

the old version using L.control.layers:

does this plugin run with leaflet 1.x?
tried with 1.2.0 (1.3.x would be better), but
the basic example does not work for me.

This is more of a question than an issue, but I'm trying to find a neat way of implementing popups for vector layers defined in this way. Ideally I would like to be able to define something like popupContent as a layer setting (like serviceType is defined) and then expand the addLayer function to define onEachFeature and then create the popup. Is this the correct way to proceed, or is there a better way of doing it?