How to Use Google Maps API to Show Google Maps in the .NET MAUI Maps (SfMaps)
The Syncfusion® .NET MAUI Maps control allows you to integrate Google Maps using the Google Maps API. Follow the steps below to implement this functionality.
Step 1:
Add the SfMaps control with the MapTileLayer to your layout. Use the MarkerTemplate to define the marker style and add markers with specified latitude and longitude coordinates.
XAML:
<map:SfMaps VerticalOptions="Center" HorizontalOptions="Center">
<map:SfMaps.Layer>
<map:MapTileLayer x:Name="layer">
<map:MapTileLayer.MarkerTemplate>
<DataTemplate>
<StackLayout HorizontalOptions="Start" VerticalOptions="Center">
<Image Source="pin.png" HeightRequest="20" WidthRequest="20"/>
</StackLayout>
</DataTemplate>
</map:MapTileLayer.MarkerTemplate>
<map:MapTileLayer.Markers>
<map:MapMarkerCollection>
<map:MapMarker Latitude="37.785834" Longitude="-122.406417"/>
<map:MapMarker Latitude="38.8833" Longitude="-77.0167"/>
<map:MapMarker Latitude="-15.7833" Longitude="-47.8667"/>
<map:MapMarker Latitude="21.0000" Longitude="78.0000"/>
<map:MapMarker Latitude="35.0000" Longitude="103.0000"/>
<map:MapMarker Latitude="-4.0383" Longitude="21.7586"/>
</map:MapMarkerCollection>
</map:MapTileLayer.Markers>
</map:MapTileLayer>
</map:SfMaps.Layer>
</map:SfMaps>
Step 2:
Set the URL template to the MapTileLayer using the URLTemplate property.
C#:
public MainPage()
{
InitializeComponent();
this.layer.UrlTemplate = "https://mt0.google.com/vt/lyrs=y&x={x}&y={y}&z={z}";
}
Download the complete sample from GitHub.
Output:
Conclusion:
I hope you enjoyed learning how to use the Google Maps API to show Google Maps in the .NET MAUI Maps (SfMaps).
Refer to our .NET MAUI Maps feature tour page to learn about its other groundbreaking feature representations. You can explore our .NET MAUI Maps documentation to understand how to present and manipulate data.
For current customers, check out our .NET MAUI components from the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI Maps and other .NET MAUI components.
Please let us know in the comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!