public async Task OnMapLoad(MapEventArgs eventArgs)
{
Marker = new AzureMapsControl.Components.Markers.HtmlMarker(
new AzureMapsControl.Components.Markers.HtmlMarkerOptions
{
Position = new AzureMapsControl.Components.Atlas.Position(47.3769, 8.5417),
Visible = true
}, AzureMapsControl.Components.Markers.HtmlMarkerEventActivationFlags.None());
await eventArgs.Map.AddHtmlMarkersAsync(Marker);
}
public async Task OnMapClick(MapMouseEventArgs eventArgs)
{
var options = Marker.Options;
options.Visible = !options.Visible;
await eventArgs.Map.UpdateHtmlMarkersAsync(new AzureMapsControl.Components.Markers.HtmlMarkerUpdate(Marker, options));
}
}
3. Run it, browse to that page, click on the map, and notice that the marker doesn't change visibility.
4. Set a breakpoint at `options.Visible = !options.Visible;` and confirm that the code is running.
**Expected behavior**
I should be able to make an HTML marker visible or invisible using `UpdateHtmlMarkersAsync()`.
**Desktop (please complete the following information):**
- OS: Windows 10 home
- Browser: Firefox 131.0.2
- Version: AzureMapsControl.Components 1.16.1
**Additional context**
I thought it might be a bug in Azure maps, but I tried it using pure JavaScript and it works fine. I started with [this example](https://github.com/Azure-Samples/AzureMapsCodeSamples/blob/0e130d3b24d2506478fcc383aced779e599221d3/Samples/HTML%20Markers/HTML%20Marker%20with%20Custom%20SVG%20Template/HTML%20Marker%20with%20Custom%20SVG%20Template.html#L62-L65), put in my map key, changed
Describe the bug Calling
UpdateHtmlMarkersAsync()
lets me change Position and HTML but settingHtmlMarkerOptions.Visible
has no effect.To Reproduce Steps to reproduce the behavior:
AzureMapsControl.Sample\Components\Pages\Markers\HtmlMarkersRemove.razor
@using AzureMapsControl.Components.Map <AzureMap Id="map" EventActivationFlags="MapEventActivationFlags .None() .Enable(MapEventType.Click, MapEventType.Load)" OnClick="OnMapClick" OnLoad="OnMapLoad" />
@code { private AzureMapsControl.Components.Markers.HtmlMarker Marker;
}