FontIcon on SfMap Marker

[Darwin Turingan]

Is there a way to use font icon of on mapmarker when it's set as image?

[Eswaran Thirugnanasambandam]

Hi Darwin Turingan 

Thanks for contacting Syncfusion support.  

 

You can achieve your requirement by using the MarkerTemplate support in the SfMaps.  By adding Label as a template for marker, you can achieve this as shown in the below code.  

[XAML] 

[App.Xaml] 

<OnPlatform x:Key="CustomFont" x:TypeArguments="x:String"> 

    <On Platform="Android" Value="customfont.ttf#fontello" /> 

    <On Platform="UWP" Value="Assets/customfont.ttf#customfont" /> 

    <On Platform="iOS" Value="customfont" /> 

</OnPlatform> 

[MainPage.Xaml] 

<ContentPage.Resources> 

    <Style x:Key="Icons" TargetType="Label"> 

        <Setter Property="FontFamily" Value="{StaticResource CustomFont}" /> 

        <Setter Property="Text" Value="&#xe805;"/> 

    </Style> 

</ContentPage.Resources> 

<ContentPage.Content> 

    <Grid Margin="20" x:Name="grid"> 

        <maps:SfMaps x:Name="sfmap"  BackgroundColor="White"> 

            <maps:SfMaps.Layers > 

                <maps:ShapeFileLayer Uri="world1.shp"  > 

                    <maps:ShapeFileLayer.ShapeSettings> 

                        <maps:ShapeSetting ShapeFill="Gray" /> 

                    </maps:ShapeFileLayer.ShapeSettings> 

                    <maps:ShapeFileLayer.MarkerSettings> 

                        <maps:MapMarkerSetting x:Name="markerSetting"  

                                                                        HorizontalAlignment="Center"  

                                                                        VerticalAlignment="Near" /> 

                    </maps:ShapeFileLayer.MarkerSettings> 

                    <maps:ShapeFileLayer.Markers> 

                        <maps:MapMarker  Latitude="38.8833" Longitude= "-77.0167"  /> 

                    </maps:ShapeFileLayer.Markers> 

                    <maps:ShapeFileLayer.MarkerTemplate> 

                        <DataTemplate > 

                            <Label   Style="{StaticResource Icons}" /> 

                        </DataTemplate> 

                    </maps:ShapeFileLayer.MarkerTemplate> 

                </maps:ShapeFileLayer> 

            </maps:SfMaps.Layers> 

        </maps:SfMaps> 

    </Grid> 

</ContentPage.Content> 

 

We have prepared sample for the same. Please get the sample from the below link. 

 

Sample Link:’ 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/GSMaps-2105813130  

 

Please refer to the below user guide link for more information about the MarkerTemplate. 

https://help.syncfusion.com/xamarin/maps/markers#add-custom-marker  

 

Regards, 

Eswaran