mcpField
M
maui-maps

maui-maps

github.com/davidortinauDevelopment17645 installsUpdated 16w ago
Repository

About maui-maps

A troubleshooting and implementation guide for maps in .NET MAUI apps. It covers platform setup, map controls and shapes, geocoding, dynamic pins, and performance considerations.

Key features

  1. 01Map control and shape guidance
  2. 02Platform-specific setup checks
  3. 03Data-bound pins for dynamic maps
  4. 04Address and coordinate conversion
  5. 05Map performance recommendations

Use cases

  1. 01Diagnosing a blank or crashing map
  2. 02Displaying dynamic pins and map shapes
  3. 03Converting addresses and coordinates

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/davidortinau/maui-skills --skill maui-maps

After installing, type/maui-mapsin Claude Code to confirm it loaded.

Bundled filesreferences/maps-api.md

Details

From the project README

.NET MAUI Maps

Common gotchas

IssueFix
Map is blank on AndroidGoogle Maps API key missing or wrong in AndroidManifest.xml
Map crashes on startup.UseMauiMaps() not called in MauiProgram.cs
Map type ambiguousConflicts with Microsoft.Maui.ApplicationModel.Map — add namespace alias
Map doesn't show on WindowsWindows has no native support — must use CommunityToolkit.Maui.Maps
User location dot missingIsShowingUser="True" set but location permission not granted
Android 11+ can't launch external map appMissing <queries> for geo scheme in manifest

⚠️ Name conflict — always alias

Microsoft.Maui.Controls.Maps.Map conflicts with Microsoft.Maui.ApplicationModel.Map. This causes confusing compile errors.

// ✅ Correct — explicit alias
using Map = Microsoft.Maui.Controls.Maps.Map;
<!-- ✅ Correct — namespace prefix in XAML -->
xmlns:maps="clr-namespace:Microsoft.Maui.Controls.Maps;assembly=Microsoft.Maui.Controls.Maps"
<maps:Map ... />

<!-- ❌ Wrong — bare <Map> is ambiguous -->
<Map ... />

Platform setup pitfalls

Android — API key must be inside <application>
<!-- ✅ Correct -->
<application ...>
  <meta-data android:name="com.google.android.geo.API_KEY"
             android:value="YOUR_GOOGLE_MAPS_KEY" />
</application>

<!-- ❌ Outside <application> — key is silently ignored -->

⚠️ Also required: Google Play Services version meta-data and <queries> for geo scheme on API 30+ (see references/maps-api.md).

iOS / Mac Catalyst

⚠️ Without NSLocationWhenInUseUsageDescription in Info.plist, location permission is denied without prompt.

Windows — no native support

Must add CommunityToolkit.Maui.Maps + Bing key. Use conditional package reference and #if WINDOWS for setup.

MauiProgram.cs — don't forget UseMauiMaps

// ✅ Required — without this, Map control throws at runtime
builder.UseMauiMaps();

// ❌ Forgetting this causes "No registered handler for Map" crash

Performance tips

  • ⚠️ Don't add hundreds of pins directly — use ItemsSource with data binding for large pin sets.
  • Set initial region with MoveToRegion() to avoid the default world view zoom animation.
  • Avoid frequent MoveToRegion() calls — each triggers a map animation; debounce if driven by data changes.

Data-bound pins — do this for dynamic data

<!-- ✅ Correct — data-bound pins for dynamic collections -->
<maps:Map ItemsSource="{Binding Locations}">
    <maps:Map.ItemTemplate>
        <DataTemplate>
            <maps:Pin Label="{Binding Name}"
                      Address="{Binding Description}"
                      Location="{Binding Position}" />
        </DataTemplate>
    </maps:Map.ItemTemplate>
</maps:Map>

<!-- ❌ Wrong — manually adding pins in code-behind for data-driven scenarios -->

Decision framework

NeedApproach
Basic map with pinsMap control + Pins.Add() or ItemsSource binding
Map with shapesMapElements — Polygon, Polyline, Circle
Address → coordinatesGeocoding.Default.GetLocationsAsync(address)
Coordinates → addressGeocoding.Default.GetPlacemarksAsync(lat, lon)
Custom map overlaysUse handlers to access native map APIs
Windows supportMust add CommunityToolkit.Maui.Maps + Bing key

Quick checklist

  • NuGet: Microsoft.Maui.Controls.Maps added
  • .UseMauiMaps() called in MauiProgram.cs
  • Android: Google Maps API key inside <application> in AndroidManifest.xml
  • Android: Google Play Services version meta-data present
  • Android 11+: <queries> for geo scheme added
  • iOS/Mac: NSLocationWhenInUseUsageDescription in Info.plist
  • Windows: CommunityToolkit.Maui.Maps + Bing Maps key (conditional)
  • Namespace alias added to avoid Map type conflict

Comments

Markdown supported