Open
Description
Describe the bug
Calling UpdateHtmlMarkersAsync()
lets me change Position and HTML but setting HtmlMarkerOptions.Visible
has no effect.
To Reproduce
Steps to reproduce the behavior:
- Open your samples project and go to
AzureMapsControl.Sample\Components\Pages\Markers\HtmlMarkersRemove.razor
- Replace the file source with:
@page "/Markers/HtmlMarkersRemove"
@rendermode InteractiveServer
@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;
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));
}
}
- Run it, browse to that page, click on the map, and notice that the marker doesn't change visibility.
- 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, put in my map key, changed
marker.setOptions({
color: 'rgb(' + (Math.random() * 255) + ',' + (Math.random() * 255) + ',' + (Math.random() * 255) + ')',
text: Math.round(Math.random() * 100) + ''
});
TO
marker.setOptions({
color: 'rgb(' + (Math.random() * 255) + ',' + (Math.random() * 255) + ',' + (Math.random() * 255) + ')',
text: Math.round(Math.random() * 100) + '',
visible: Math.random() > 0.5
});
I debugged through your code and couldn't find what caused this problem. I didn't see any related errors in the console.
Metadata
Metadata
Assignees
Labels
No labels