如何在.NET 7 MAUI应用中显示GPS定位的地图位置？

以下是几种避开谷歌地图API密钥、无需付费的替代方法，适配你的简易MAUI应用需求：

1. 集成开源跨平台地图库Mapsui #

Mapsui是免费开源的跨平台地图组件，支持MAUI，可加载离线/在线地图瓦片，无需依赖商业地图服务。

• 安装NuGet包：Mapsui.Maui
• XAML中添加控件：

  <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
               xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
               xmlns:mapsui="clr-namespace:Mapsui.Maui;assembly=Mapsui.Maui"
               x:Class="YourApp.MapPage">
      <mapsui:MapView x:Name="mapView" />
  </ContentPage>
  

• 代码中绑定GPS位置：

  // 假设已通过MAUI Geolocation获取到位置
  var gpsPosition = new Position(latitude, longitude);
  
  // 添加位置标记
  var locationMarker = new Marker
  {
      Position = gpsPosition,
      Style = new MarkerStyle { Symbol = BitmapImage.FromFile("pin_icon.png") }
  };
  mapView.Map.Layers.Add(new MarkerLayer { Markers = new List<Marker> { locationMarker } });
  
  // 自动定位到该位置
  mapView.Map.NavigateTo(gpsPosition, mapView.Map.Resolutions[12]);
  

• 可选：下载OpenStreetMap的离线瓦片包，配置Mapsui离线加载，完全脱离网络使用。

2. 用WebView加载OpenStreetMap #

OpenStreetMap是免费开源的在线地图服务，无需API密钥即可直接使用，通过WebView嵌入并传递GPS位置：

• XAML添加WebView：

  <WebView x:Name="osmWebView" WidthRequest="400" HeightRequest="600" Navigated="OsmWebView_Navigated" />
  

• 代码中加载地图并定位：

  double lat = 39.9042; // 示例纬度
  double lon = 116.4074; // 示例经度
  // 构造OpenStreetMap定位URL
  string mapUrl = $"https://www.openstreetmap.org/#map=15/{lat}/{lon}";
  osmWebView.Source = new UrlWebViewSource { Url = mapUrl };
  

• 可选：页面加载完成后添加自定义标记（需执行JS）：

  private void OsmWebView_Navigated(object sender, WebNavigatedEventArgs e)
  {
      double lat = 39.9042;
      double lon = 116.4074;
      // 执行OpenStreetMap的Leaflet JS API添加标记
      string jsCode = $"L.marker([{lat}, {lon}]).addTo(map).bindPopup('当前位置');";
      osmWebView.Eval(jsCode);
  }
  

3. 自定义简易位置绘制（极简场景） #

如果不需要完整地图细节，仅需展示位置标记，可直接用MAUI的GraphicsView自定义绘制：

• XAML添加GraphicsView：

  <GraphicsView x:Name="simpleMapView" WidthRequest="400" HeightRequest="600" />
  

• 实现绘制逻辑：

  public class SimpleMapDrawable : IDrawable
  {
      public Position CurrentLocation { get; set; }
  
      public void Draw(ICanvas canvas, RectF dirtyRect)
      {
          // 可选：绘制静态地图背景图
          // var background = ImageSource.FromFile("map_background.png").Value;
          // canvas.DrawImage(background, dirtyRect);
  
          // 绘制红色位置标记（示例：居中显示，实际可根据坐标转换调整）
          float markerX = dirtyRect.Center.X;
          float markerY = dirtyRect.Center.Y;
          canvas.FillColor = Colors.Red;
          canvas.FillCircle(markerX, markerY, 12);
          canvas.StrokeColor = Colors.White;
          canvas.StrokeSize = 2;
          canvas.DrawCircle(markerX, markerY, 12);
      }
  }
  
  // 在页面中设置
  simpleMapView.Drawable = new SimpleMapDrawable { CurrentLocation = yourGpsPosition };
  

内容的提问来源于stack exchange，提问作者Álvaro García