MapsNavigationLine with arrow?

[Miticoval]

Hi!

Is there a way to add an arrow to MapsNavigationLine?

I'm trying to show travel destinations and I would need to show the direction of the connection.

Thanks!

[Indumathi Ravi]

Hi Valerio,

The arrow in the navigation line of the Maps component can be added by setting the “ShowArrow” property as “true” in the “MapsArrow” tag. Please find the code snippet for the same below.

Code Snippet:

<SfMaps>

    <MapsLayers>

        <MapsLayer ShapeData='new {dataOptions =https://cdn.syncfusion.com/maps/map-data/world-map.json}' TValue="string">

          //..

         //..

            <MapsNavigationLines>

                <MapsNavigationLine Visible="true" Color="black" Angle="-0.1" Width="2" DashArray="4"

                                    Latitude="new double[]{ 65.931163, 39.864171 }" Longitude="new double[]{ -45.812820, -100.854833 }">

                    <MapsArrow ShowArrow="true" Color="black" Size="10"></MapsArrow>

                </MapsNavigationLine>

             //..

            </MapsNavigationLines>

        </MapsLayer>

    </MapsLayers>

</SfMaps>

You can find the sample from the below link.

https://www.syncfusion.com/downloads/support/directtrac/general/ze/MapsBlazor1392954674

 

Please refer the below UG documentation link to learn more about the customization of the arrow in the navigation line.

https://blazor.syncfusion.com/documentation/maps/navigation-line#enabling-the-arrows

Please let us know if you need any further assistance.