visualizationlayer's objects zindex seems to change with zoomin zoomout

[Sayyed Hossein]

hi dear telerik team

i have two MapLineViews in a visualization layer on the map (like a blue one and a red one). these two lines are exactly (or partly) on eachother.

at first we assume the red one is on top when we zoom out and zoom in sometimes this order changes! and the blue one comes on top.

i know the visualizationlayer redraws the items when the zoom changes but why does it change the order and how can i stop this from happening

 

thank you very much in advance for your help

 

[Dinko | Tech Support Engineer]

Hello Sayyed Hossein,

We weren't able to reproduce the described behavior in your post. You can give us more information about your implementation which could help us to better understand it. It will be great if you can send us sample project reproducing this behavior so that we can directly test it on our side.

Regards,
Dinko
Telerik by Progress

[Sayyed Hossein]

hi dear dinko
well i wil try to describe the implementation in more detail and i hope it helps:
1- i have a view model named pathsegmentviewmodel with a couple of properties 3 of which are:
    a) Location StartPoint
    b) Location EndPoint
    c) Brush Color
    d) MapShapeFill MSF
2- i have an observablecollection of the pathsegmentviewmodel in my mainviewmodel. 2 of the path segments in the collection have the same Startpoint and Endpoint but have different colors assume one is blue and the other is red
3- i have a radmap in view. which has a visualizationlayer called "linelayer". "linelayer"'s item source is set to the observable collection of pasthsegmentviewmodel i mentioned in #2
4- the itemtemplate of the visualizationlayer is set to "LineItemTemplate" Which is:
   <DataTemplate x:key="LineItemTemplate">
      <telerik:MapLineView Point1="{Binding Path=StartPoint}" Point2="{Binding Path=EndPoint}" local:MapUtilities.ShapeFill="{Binding MSF}"/>
</DataTemplate>
5- this is MapUtilities Class:

public class MapUtilities
    {
        public static MapShapeFill GetShapeFill(DependencyObject obj)
        {
            return (MapShapeFill)obj.GetValue(ShapeFillProperty);
        }

        public static void SetShapeFill(DependencyObject obj, MapShapeFill value)
        {
            obj.SetValue(ShapeFillProperty, value);
        }

        public static readonly DependencyProperty ShapeFillProperty =
            DependencyProperty.RegisterAttached("ShapeFill", typeof(MapShapeFill), typeof(MapUtilities), new PropertyMetadata(null, OnShapeFillChanged));

        private static void OnShapeFillChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var wrapper = (MapShapeBindableWrapper)d;
            if (e.NewValue != null)
            {
                wrapper.ShapeFill = (MapShapeFill)e.NewValue;
                var shapeData = wrapper.ShapeData;
                shapeData.UseRegularFill();
            }
        }
    }

6- this is pathsegmentviewmodels class:
public class PathSegmentViewModel : ViewModelBase
    {
        public PathSegmentViewModel(Location start, Location end,Brush color)
        {
            StartPoint = start;
            EndPoint = end;

            Color = color;
            MSF = new MapShapeFill() { StrokeThickness = 3, Stroke = Color,Fill=Color };
        }

        private static MercatorProjection projection = new MercatorProjection();


        private Brush color
        public Brush Color
        {
            get { return color}
            set { color= value; RaisePropertyChanged("Color"); RaisePropertyChanged("MSF"); }
        }


        private MapShapeFill msf;
        public MapShapeFill MSF
        {
            get
            {
                return msf;
            }
            set
            {
                msf = value;
                RaisePropertyChanged("MSF");
            }
        }

        private Location startPoint;
        public Location StartPoint
        {
            get { return startPoint; }
            set { startPoint = value; RaisePropertyChanged("StartPoint"); }
        }

        private Location endPoint;
        public Location EndPoint
        {
            get { return endPoint; }
            set { endPoint = value; RaisePropertyChanged("EndPoint"); }
        }

    }

[Sayyed Hossein]

sorry for not formatting the code . the code formatting menu of your site doesnt seem to work with my chrome

[Sayyed Hossein]

now the code formatting is done:

hi dear dinko
well i wil try to describe the implementation in more detail and i hope it helps:
1- i have a view model named pathsegmentviewmodel with a couple of properties 3 of which are:
    a) Location StartPoint
    b) Location EndPoint
    c) Brush Color
    d) MapShapeFill MSF
2- i have an observablecollection of the pathsegmentviewmodel in my mainviewmodel. 2 of the path segments in the collection have the same Startpoint and Endpoint but have different colors assume one is blue and the other is red
3- i have a radmap in view. which has a visualizationlayer called "linelayer". "linelayer"'s item source is set to the observable collection of pasthsegmentviewmodel i mentioned in #2
4- the itemtemplate of the visualizationlayer is set to "LineItemTemplate" Which is:

   

<DataTemplate x:key="LineItemTemplate">
<telerik:MapLineView Point1="{Binding Path=StartPoint}" Point2="{Binding Path=EndPoint}" local:MapUtilities.ShapeFill="{Binding MSF}"/>
</DataTemplate>

5- this is MapUtilities Class:

public class MapUtilities
    {
        public static MapShapeFill GetShapeFill(DependencyObject obj)
        {
            return (MapShapeFill)obj.GetValue(ShapeFillProperty);
        }

        public static void SetShapeFill(DependencyObject obj, MapShapeFill value)
        {
            obj.SetValue(ShapeFillProperty, value);
        }

        public static readonly DependencyProperty ShapeFillProperty =
            DependencyProperty.RegisterAttached("ShapeFill", typeof(MapShapeFill), typeof(MapUtilities), new PropertyMetadata(null, OnShapeFillChanged));

        private static void OnShapeFillChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var wrapper = (MapShapeBindableWrapper)d;
            if (e.NewValue != null)
            {
                wrapper.ShapeFill = (MapShapeFill)e.NewValue;
                var shapeData = wrapper.ShapeData;
                shapeData.UseRegularFill();
            }
        }
    }

6- this is pathsegmentviewmodels class:

public class PathSegmentViewModel : ViewModelBase
    {

public PathSegmentViewModel(Location start, Location end,Brush color)
        {
            StartPoint = start;
            EndPoint = end;

            Color = color;
            MSF = new MapShapeFill() { StrokeThickness = 3, Stroke = Color,Fill=Color };
        }

        private static MercatorProjection projection = new MercatorProjection();


        private Brush color
        public Brush Color
        {
            get { return color}
            set { color= value; RaisePropertyChanged("Color"); RaisePropertyChanged("MSF"); }
        }


        private MapShapeFill msf;
        public MapShapeFill MSF
        {
            get
            {
                return msf;
            }
            set
            {
                msf = value;
                RaisePropertyChanged("MSF");
            }
        }

        private Location startPoint;
        public Location StartPoint
        {
            get { return startPoint; }
            set { startPoint = value; RaisePropertyChanged("StartPoint"); }
        }

        private Location endPoint;
        public Location EndPoint
        {
            get { return endPoint; }
            set { endPoint = value; RaisePropertyChanged("EndPoint"); }
        }

    }

[Dinko | Tech Support Engineer]

Hello Sayyed Hossein,

We weren't able to reproduce the described behavior. We have created a sample project using the code snippets in your last reply. We have added two objects to the VisualizationLayer with the same StartPoint and EndPoint but with a different color. When we zoom in or zoom out the red one is always on top. You can check this project and modified it to reproduce the behavior mentioned in your first post and send it back to us so we can further test it on our side. 

We are looking forward to your answer.

Regards,
Dinko
Telerik by Progress

[Sayyed Hossein]

hi dear Dinko

thank you very much for your time

well about the projects i was actually able to reproduce the issue on the project with few tweaks:

1-the mainviewmodel has changed so that to define two smaller lines that actually dont cover eachother completely! and one is half the other one and therfore covering half the other one

public class MainViewModel
{
    public ObservableCollection<PathSegmentViewModel> Data { get; set; }

    public MainViewModel()
    {
        Data = new ObservableCollection<PathSegmentViewModel>();
        GetData();
    }
    private void GetData()
    {
        Location startPoint1 = new Location(42.700, 23.300);
        Location endPoint1 = new Location(42.720, 23.320);
        Brush color1 = new SolidColorBrush(Colors.Green);
        PathSegmentViewModel path1 = new PathSegmentViewModel(startPoint1, endPoint1, color1);
        Location startPoint2 = new Location(42.710, 23.310);
        Location endPoint2 = new Location(42.720, 23.320);
        Brush color2 = new SolidColorBrush(Colors.Red);
        PathSegmentViewModel path2 = new PathSegmentViewModel(startPoint2, endPoint2, color2);
        Data.Add(path1);
        Data.Add(path2);
    }
}

2- the main window is change to zoom on the location and defines a zoom range to make it easier too zoom in and out to reproduce the issue

<Window x:Class="VisualizationObjects_ZIndex.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:local="clr-namespace:VisualizationObjects_ZIndex"
        Title="MainWindow" >
    <Window.Resources>
        <DataTemplate x:Key="LineItemTemplate">
            <telerik:MapLineView Point1="{Binding StartPoint}"
                                 Point2="{Binding EndPoint}"
                                 local:MapUtilities.ShapeFill="{Binding MSF}"
                                 BorderThickness="6"/>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <telerik:RadMap x:Name="radMap"
                        ZoomLevel="13" MinZoomLevel="13" MaxZoomLevel="19"
                        Center="42.710, 23.310">
            <telerik:RadMap.Provider>
                <telerik:OpenStreetMapProvider />
            </telerik:RadMap.Provider>
            <telerik:VisualizationLayer x:Name="visualizationLayer" ItemsSource="{Binding Data}"  ItemTemplate="{StaticResource LineItemTemplate}"/>
        </telerik:RadMap>
    </Grid>
</Window>

3- now the issue doesnt happen on every zoom in and out i had to do it a couple of times and hover over and off the the red line while zooming in and out. after a couple of times the redline goes green like the one under it and with another zoom in and out it goes back to red. and after it happens once it seems to happen more often from then

although it  happens easier in my project but it does happen in your's too

 

i hope you can reproduce it

thank you in advance for your help

 

 

 

[Dinko | Tech Support Engineer]

Hi Sayyed Hossein,

I am looking into this right now and will let you know once I have more information.

Regards,
Dinko
Telerik by Progress

[Dinko | Tech Support Engineer]

Hi Sayyed Hossein,

Thank for the provided additional information. We modified the project but we weren't able to reproduce the described behavior on our side. That is why we would ask to give us more details like:

• Which version of our assemblies are you using in your application?
• Can you send us images, video on the reported issue?
• Which version of Visual Studio are you using?

Regards,
Dinko
Telerik by Progress