Add Polygons, polylines and circles on the map

[DmitrikSerhiy]

Is there an existing issue for this?

• I have searched the existing issues

Did you read the "Reporting a bug" section on Contributing file?

• I have read the "Reporting a bug" section on Contributing file: https://github.com/CommunityToolkit/Maui/blob/main/CONTRIBUTING.md#reporting-a-bug

Current Behavior

The map never shows any map elements.

Expected Behavior

When MapElement is added to the MapElements collection, it should be rendered on the map.

Steps To Reproduce

1. Create a map element (circle, polygon or polyline)
2. Add it to the MapElements collection

Link to public reproduction project repository

https://github.com/CommunityToolkit/Maui/tree/main/samples/CommunityToolkit.Maui.Sample/Pages/Views/Maps

Environment

- CommunityToolkit.Maui: 7.0.1
- CommunityToolkit.Maui.Maps: 2.0.0
- CommunityToolkit.Mvvm: 8.2.2
- OS: Windows 10 Build 10.0.19041.0
- .NET MAUI: 8.0

Anything else?

I have a strong feeling that it's not supported. I have yet to find a working example with a map having any element in your repository or any other.

    // initialize map from xaml.cs file
    var map = new Microsoft.Maui.Controls.Maps.Map
    {
        IsZoomEnabled = true,
        IsShowingUser = false,
        IsScrollEnabled = true,
        IsTrafficEnabled = false,
    };

    //Create a circle element
    var circle = new Circle
    {
        Center = new Location(50.450971, 30.522604),
        Radius = Distance.FromKilometers(100),
        StrokeColor = Color.FromArgb("#88FF0000"),
        StrokeWidth = 8,
        FillColor = Color.FromArgb("#88FFC0CB")
    };

    //Add circle to the map
map.MapElements.Add(circle);

[bijington]

@jfversluis do you know what the state of maps is in .NET MAUI? This package was only intended to be a stop gap until .NET MAUI supported maps on Windows. I thought the team had announced supporting it at some point however, I see the docs still states that it isn't supported https://learn.microsoft.com/dotnet/maui/user-interface/controls/map?view=net-maui-8.0

[jfversluis]

We're waiting until the WinUI team finished their work on 1.5 and then we can hook it up for .NET MAUI.

Work is being tracked here: dotnet/maui#20356

[DmitrikSerhiy]

@bijington It's clear the map from MAUI is not supported for Windows. This issue is regarding the map from CommunityToolkit.Maui.Maps package. The map itself works. Webview contains a map from Bing. But It seems it does not support rendering map elements on it. Am I right?

[bijington]

I am unable to verify the issue right now as my Windows setup is a complete mess. I was mostly trying to see if this was something we could pass over to the .NET MAUI team but I guess we cannot.

[jfversluis]

From looking at the code this was indeed never implemented on our side for Windows.

Depending on how easy/hard it is to do we should consider if it's worth it seeing that this should be supported by .NET MAUI directly in the foreseeable future.

[vector-perfect]

@DmitrikSerhiy Try to add elements on Loaded, like this:

private readonly Circle _circle;

public CustomMap()
{
    _circle = new Circle
    {
        // any properties
    }
    
    Loaded += OnLoaded;
}

private void OnLoaded(object? sender, EventArgs e)
{
    MapElements.Add(_circle);
}

[DmitrikSerhiy]

I've tried this approach. It has no difference.

I am setting the map in the OnAppering method of the page. Then I add map element to the collection in Loaded event.
Map does not reflect MapElements collection.
Debug shows that collection is populated. But it simply does not mean anything. Nothing renders in the map.

If that would be the case, then pins wouldn't work as well. But pins are rendered no matter when you add them to the Pins collection.

According to @jfversluis it's just not implemented for windows. And we have to wait for WinUI team Map control implementation and THEN wait a bit more for the MAUI team to implement appropriate Map handler and THEN wait just a little bit more for the CommunityToolkit.Maui.Maps package maintainers to hook it up and actually implement it.

The bottom line is don't expect it within this year (IMHO)

I can't afford to wait so long.
I am switching to ArcGIS maps for MAUI.

[autoprog]

Hello,
in 2024, I have the same problem using Maui Maps on Windows.
The map works, I can place the pins perfectly.
Polygons and Polylines write but do not appear on top of the maps.

added all libraries
using CommunityToolkit.Maui;
using CommunityToolkit.Maui.Maps;
using Microsoft.Extensions.Logging;
using CommunityToolkit.Maui.Core;
using CommunityToolkit.Maui.Markup; xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

Location location = new Location(-23.3108, -51.160321);//BB map.IsShowingUser = true;
MapSpan mapSpan = MapSpan.FromCenterAndRadius(location, Distance.FromMeters(2000)); //(0.444)
map.MoveToRegion(mapSpan);

Pin boardwalkPin1 = new Pin
{
   Location = new Location(-23.3108, -51.160321),
   Label = "Banco do Brasil",
   Address = "Centro de Londrina - Brazil",
   Type = PinType.Place
};

boardwalkPin1.MarkerClicked += Pin_MarkerClicked;
map.Pins.Add(boardwalkPin1); ok




pline = new Polyline();
pline.Geopath.Clear();
pline.StrokeColor = Color.FromRgb(0, 0, 179);
pline.StrokeWidth = 12;

double lat = -23.3108;
double log = -51.160321;

for (int e = 0; e < 10; e++)
{
   Location myloc = new Location(lat, log);
   pline.Geopath.Add(myloc);
   log += 1.1000;
}
map.MapElements.Add(pline);

polygon = new Polygon
{
   StrokeWidth = 8,
   StrokeColor = Color.FromArgb("#1BA1E2"),
   FillColor = Color.FromArgb("#881BA1E2"),
   Geopath =
  {
          new Location(-23.3108, -122.137305),
          new Location(-23.3208, -51.160421),

  }
};
map.MapElements.Add(polygon);

thanks.