Bring a specific map marker to the front (top of drawing order)

[Jakub]

Greetings Syncfusion!

What would you suggest I do to bring a specific map marker to the front?

I have many markers overlapping each other and I would like to bring a specific one to the front of the view order.

Here is my xaml code for the marker template:

<syncfusion:ImageryLayer.MarkerTemplate>

                            <DataTemplate>

                                <StackPanel Orientation="Horizontal">

                                    <Grid>

                                        <Ellipse Fill="{Binding Data.MarkerColor}"

                                                 Stroke="{Binding Data.SelectionStrokeColor}"

                                                 Width="35"

                                                 Height="35"

                                                 HorizontalAlignment="Center"

                                                 VerticalAlignment="Center" StrokeThickness="2" SnapsToDevicePixels="False"/>

                                        <Image Source="{Binding Data.AircraftIcon}"

                                               Width="40"

                                               Height="40"/>

                                        <Image Source="{Binding Data.StatusIcon}"

                                                Width="15"

                                                Height="15" HorizontalAlignment="Right" VerticalAlignment="Top"/>

                                    </Grid>

                                    <TextBlock Text="$"

                                               Foreground="{Binding Data.ValueColor}"

                                               Visibility="{Binding Data.ValueVisibility}"

                                               FontSize="18"

                                               FontWeight="Bold"

                                               Width="auto"

                                               Height="auto"/>

                                </StackPanel>

                            </DataTemplate>

                        </syncfusion:ImageryLayer.MarkerTemplate>

Thank you kindly in advance :-)

Jacob

[Sridevi Sivakumar]

Hi Jakub,

Greetings from Syncfusion.

We have analyzed your requirement and we can bring the selected marker to the top by setting the MarkerSelected event argument CanBringToTop to true.

[XAML]: 

   <Sync:SfMap> 

            <Sync:SfMap.Layers> 

                <Sync:ImageryLayer Markers="{Binding Models}"  MarkerSelected="ImageryLayer_MarkerSelected" > 

... 

                </Sync:ImageryLayer> 

            </Sync:SfMap.Layers> 

        </Sync:SfMap> 

[C#]: 

        private void ImageryLayer_MarkerSelected(object sender, Syncfusion.UI.Xaml.Maps.MarkerSelectedEventArgs e) 

        { 

            e.CanBringToTop = true; 

        } 

Regards,
Sridevi S. 

 

[Jakub]

Hi Sridevi,

Your suggestion does bring a marker to the top when it is selected on the map, so thank you.

However, I realize that I wasn't clear enough in my question.

In my situation, I have a DataGrid which has a list of aircraft. Next to this list is my map which displays a marker for each of the aircraft in the list. When a row in the list is clicked (selected), I would like the corresponding map marker to be brought to the top without having to click the actual marker on the map.

In the image below, you can see the marker for the aircraft that is selected in the list with a magenta outline. I would like that marker to be brought to the top by just selecting it in the list. I hope this is possible.

https://imgur.com/a/7kkrYYZ

Thank you!

[Ramya Soundar Rajan]

Hi Jakub, 

 

We have checked your reported query. We have achieved your requirement that when selecting item in the list then the corresponding data marker to bring at the top. Please refer the below code snippet. 

 

[C#] 

 

        private void DataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e) 

        { 

            if (dataGrid.SelectedIndex >= 0) 

            { 

                var index = dataGrid.SelectedIndex; 

                var item = model.Models[index]; 

                model.MapModels.Remove(item); 

                model.MapModels.Add(item); 

            } 

        } 

 

Sample Link: https://www.syncfusion.com/downloads/support/forum/165644/ze/MapsMarkerWPF_Sample134366104 

 

Regards, 

Ramya S 

[Jakub]

Thank you very much!

This worked perfectly :-)

[Sridevi Sivakumar]

Hi Jakub,

We are glad that the provided solution is work at your end. Please let us know if you would require any further assistance. 

Regards,
Sridevi S.