Layer Visible doesn't work with multiple dynamic layers.

[dirk193]

When I dynamically create multiple layers from a list, only the first layer is shown or hidden.

public partial class YMobileMap { private List<FakeVM>? _fakeLayers = []; protected async override Task OnInitializedAsync() { _fakeLayers = []; for (int i = 0; i < 10; i++) { _fakeLayers.Add(new FakeVM { Longitude = 8.413 + i / 100.0 }); } } private async Task FakeVisibleAsync() { _fakeIsVisible = !_fakeIsVisible; foreach (var item in _fakeLayers) { await item.GraphicsLayerRef.SetVisibility(_fakeIsVisible); } } }

public class FakeVM { public GraphicsLayer? GraphicsLayerRef { get; set; } public double Longitude { get; set; } }

Razor File:

`

    <Map>

        @{
            foreach (var item in _fakeLayers)
            {
                <GraphicsLayer @ref="item.GraphicsLayerRef">
                    <Graphic Geometry="new Point(item.Longitude, 49.007)" >
                        @{
                            var color = new MapColor("red");
                        }
                        <SimpleMarkerSymbol Style="SimpleMarkerSymbolStyle.Circle" Color="color" Size="10" />

                    </Graphic>
                </GraphicsLayer>
            }

        <OpenStreetMapLayer />
    </Map>
</MapView>

Visible InVisible
`

[magmoe]

Hi @dirk193
This looks to be a quirk of Blazor from using @ref inside a foreach loop without a stable key.

If you need multiple layers, you'll want to add @key and capture the ref for each layer

Something along the lines of:

  @foreach (var item in _fakeLayers)
{
  var local = item; // important!
  <GraphicsLayer
      @key="local.Id"
      @ref="local.GraphicsLayerRef">

              <Graphic Geometry="new Point(local.Longitude, 49.007)">
                  @{
                      var color = new MapColor("red");
                  }
                  <SimpleMarkerSymbol Style="SimpleMarkerSymbolStyle.Circle" Color="color" Size="10" />

              </Graphic>
  </GraphicsLayer>
}

Let me know if that doesn't fix your issue!

*Update - tested the code, and this version works for me

[TimPurdum]

Sorry we didn't get back to you quicker, @dirk193. This is a common foreach issue in C# that occurs on any inner closures (lambdas, function callbacks, etc.), where it's going to go through all the loops, then try to run the code for all the loops but with the last value. Here's a SO post with a similar concept in pure C# https://stackoverflow.com/questions/271440/captured-variable-in-a-loop-in-c-sharp.

In this case, I believe the culprit is the way that blazor sets @ref within an asynchronous method, so it's waiting to actually assign that value.