Get the children propertie of a LayersControl object to add a new layer

Dash Python
1

Firstly, thanks to this amazing library, I really enjoy the way it is implemented.

In a dash application with a Map component containing a LayersControl object initialized in a previous callback with different layers, I wan’t to add another layer from a second callback but when I am passing the children property of the LayersControl I got a cyclic object value error.

Here is the way I declare my map component and the LayerControl object

dl.Map(
    id="maps",
    children = [dl.LayersControl(id = 'layers', children = [])],
    zoom=4, preferCanvas=True, zoomControl = False,
    style={
        'width': '1200px',
        'height': '720px'
    },
),

Then in a first callback I add several layers

@app.callback(
    Output('layers', 'children'),

)
my_first_callback() :

maps =  [
    dl.BaseLayer(
            dl.TileLayer(
                url = tileProvider.url.format(x="{x}", y="{y}", z="{z}", s="{s}", r=tileProvider.get("r", ""), **tileProvider),
                attribution="IGN"),
            name = 'fond de carte', checked = True
    ),
    dl.Overlay(dl.LayerGroup(layer1), name = 'layer1', checked = True),
    dl.Overlay(dl.LayerGroup(layer2), name = 'layer2', checked = True),
    dl.Overlay(dl.LayerGroup(layer3), name = 'layer3', checked = False),
]

return maps

Then I’m trying to update my LayersControl in a second callback

@app.callback(
    Output('layers', 'children'),
    State('layers', 'children'),
)
my_second_callback(layer_to_update) :
        # some code
        return layer_to_update

The app can’t enter the callback cause line State('layers','children') rise cyclic object value error. I was previously using only a LayerGroup in the map children property to add different layers. It was working perfectly but I wanted the possibility to hide/show layers and I don’t understand why it is not working anymore, or maybe I am not using the correct workflow to do this.

Thanks !

2

Hello @jahairforce,

Welcome to the community!

Have you considered my good pal Patch for this, you don’t need to include the state to just add, remove, update components anymore, as long as you know what you are updating.

Also, all callbacks need an input, not sure what your trigger is.

1 Like
3

wow looks amazing ! Seems to be the way to go.

For the input, it’s all my bad, I simplified a bit too much my example, but I do have an input in my app, just it was not relevant for the problem I was facing.

Thanks for your advice, I will update my post as soon as I succeed (or fail ?) with Patch object.

EDIT : this works perfectly, I just had a small problem with the MultiplexerTransform package in dash_extension.enrich, which I was using to enable duplicated output since I wasn’t on Dash v 2.9. But after updating Dash, it works perfectly. Thanks a lot.

1 Like
4

If you aren’t using a bunch of DashExtensions, you can swap over to Dash vanilla completely, but it’s up to you.