Binding GraphicsLayer to a TimeSlider by code

yonatanrubinstein — Sat, 11 Dec 2021 14:44:02 GMT

Hello,

I'm using Arcgis SDK for WPF version 2.4. In my application I create a dynamic, on-the-fly simple GraphicsLayer - each graphic in the GraphicsLayer has a timeextent attribute that is given at the time of its creation. I'm trying to bind the GraphicsLayer to a TimeSlider control by code (like this example, but in wpf and using a graphicsLayer) - I'm setting a timeextent for the map and going through all the steps, but the Graphics aren't binded to the slider. Am I doing something wrong? How can I get it to work? any advice will be welcomed.

Thanks in advance.

Enclosed is my source code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using ESRI.ArcGIS.Client;
using ESRI.ArcGIS.Client.Geometry;
using ESRI.ArcGIS.Client.Symbols;

namespace timeSlider_FeatureLayer_09092013
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

        }

        private void btnGo_Click(object sender, RoutedEventArgs e)
        {
            var intervals = new List<DateTime>();

            Graphic g = new Graphic()
            {
                Geometry = new MapPoint(200000, 600000),
                Symbol = LayoutRoot.Resources["MySmallMarkerSymbol"] as Symbol

            };
            var dt = Convert.ToDateTime("01/01/2011 11:11:11");
            g.Attributes.Add("myDt", dt);
            g.TimeExtent = new TimeExtent(dt);
            intervals.Add(dt);

            eventGL.Graphics.Add(g);


            g = new Graphic()
            {
                Geometry = new MapPoint(180000, 600000),
                Symbol = LayoutRoot.Resources["MySmallMarkerSymbol"] as Symbol

            };
            dt = Convert.ToDateTime("02/02/2012 12:22:22");
            g.Attributes.Add("myDt", dt);
            g.TimeExtent = new TimeExtent(dt);
            intervals.Add(dt);

            eventGL.Graphics.Add(g);



            g = new Graphic()
            {
                Geometry = new MapPoint(200000, 580000),
                Symbol = LayoutRoot.Resources["MySmallMarkerSymbol"] as Symbol

            };
            dt = Convert.ToDateTime("03/03/2013 13:33:33");
            g.Attributes.Add("myDt", dt);
            g.TimeExtent = new TimeExtent(dt);
            intervals.Add(dt);

            eventGL.Graphics.Add(g);

            testTS.Intervals = intervals;

            DateTime dtMin = Convert.ToDateTime("01/01/2011 08:00:00");
            DateTime dtMax = Convert.ToDateTime("03/03/2013 17:00:00");
            testTS.MinimumValue = dtMin;
            testTS.MaximumValue = dtMax;
            testTS.Value = new TimeExtent(testTS.MinimumValue, testTS.MaximumValue);//MinimumValue.AddYears(3));
            testTS.DataContext = eventGL;

            testTS.Loop = true;


            TimeExtent te = new TimeExtent();
            te.Start = dtMin;
            te.End = dtMax;
            g.TimeExtent = te;

        }
    }
}

<Window x:Class="timeSlider_FeatureLayer_09092013.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:MY="clr-namespace:timeSlider_FeatureLayer_09092013"
        xmlns:esri="http://schemas.esri.com/arcgis/client/2009"
        xmlns:esriToolkitPrimitives="clr-namespace:ESRI.ArcGIS.Client.Toolkit.Primitives;assembly=ESRI.ArcGIS.Client.Toolkit"
        Title="MainWindow" Height="350" Width="525">
       
   
    
<Grid x:Name="LayoutRoot">

            <Grid.Resources>
            <esri:SimpleMarkerSymbol x:Key="MySmallMarkerSymbol">
                <esri:SimpleMarkerSymbol.ControlTemplate>
                    <ControlTemplate>
                        <StackPanel>
                            <Ellipse Width="50" Height="50" Fill="Red"/>
                            <TextBlock Text="{Binding Attributes[myDt]}"/>
                        </StackPanel>
                    </ControlTemplate>
                </esri:SimpleMarkerSymbol.ControlTemplate>
            </esri:SimpleMarkerSymbol>
                <!--<esri:SimpleMarkerSymbol x:Key="MyMediumMarkerSymbol" Color="#FFFCEC01" Size="8" Style="Circle" />
                <esri:SimpleMarkerSymbol x:Key="MyLargeMarkerSymbol" Color="#FFF60D0B" Size="12" Style="Circle" />-->
            <MY:timeStrConverter x:Key="timeStrConvert"/>
            </Grid.Resources>
        
            
            <esri:Map x:Name="MyMap" WrapAround="True"
                  TimeExtent="{Binding ElementName=eventGL, Path=Value}">

                <esri:ArcGISTiledMapServiceLayer ID="BaseLayer"
                    Url="http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer" />

               
            <esri:GraphicsLayer x:Name="eventGL">
                <esri:GraphicsLayer.MapTip>
                    <Border Height="80" Background="White">
                        <StackPanel>
                            <TextBlock>�?�?�?ק�?</TextBlock>
                            <Rectangle Width="20" Height="20" Fill="Blue"/>

                            <TextBlock Text="{Binding Attributes[myDt], Converter={StaticResource timeStrConvert}}" Foreground="Black"/>
                        </StackPanel>                            
                    </Border>
                </esri:GraphicsLayer.MapTip>
            </esri:GraphicsLayer>
            </esri:Map>
<Button x:Name="btnGo" Width="100" Height="20" VerticalAlignment="Top" Click="btnGo_Click"  >Go</Button>
        <esri:TimeSlider Name="testTS" Height="20" VerticalAlignment="Bottom" TimeMode="TimeInstant" Value="{Binding ElementName=eventGL, Path=TimeExtent}"/>
        
    <Grid>
            <!--<Rectangle Fill="Transparent" RadiusX="2" RadiusY="2" Margin="0,223,287,5">
                
            </Rectangle>-->
            <!--<StackPanel Margin="5">
                <TextBlock Text="{Binding Start.Year}" FontSize="12" />
                <TextBlock Text="-&gt;" FontSize="12" />
                <TextBlock Text="{Binding End.Year}" FontSize="12" />
            </StackPanel>-->


            <!--<esri:TimeSlider x:Name="MyTimeSlider" Height="20" TimeMode="TimeExtent" MinimumValue="{Binding ElementName=MyMap, Path=g, Mode=OneWay}" MaximumValue="{Binding ElementName=MyMap, Path=g, Mode=OneWay}" Value="{Binding ElementName=MyMap, Path=g, Mode=OneWay}" Margin="0,0,265,291"></esri:TimeSlider>-->
        <!--<esri:TimeSlider x:Name="MyTimeSlider" Height="20" TimeMode="TimeExtent" MinimumValue="{Binding ElementName=MyMap, Path=Layers[EarthquakesLayer].TimeExtent.Start, Mode=OneWay}" MaximumValue="{Binding ElementName=MyMap, Path=Layers[EarthquakesLayer].TimeExtent.End, Mode=OneWay}" Value="{Binding ElementName=MyMap, Path=Layers[EarthquakesLayer].TimeExtent, Mode=OneWay}" Margin="0,0,265,291"></esri:TimeSlider>-->
        
        </Grid>
</Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows.Data;

namespace timeSlider_FeatureLayer_09092013
{
    public class timeStrConverter : IValueConverter

    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            DateTime dt;
            if(DateTime.TryParse(value.ToString(), out dt))
            {
                return dt.ToShortDateString();
            }
            return null;

        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

Re: Binding GraphicsLayer to a TimeSlider by code

MichaelBranscomb — Sat, 11 Dec 2021 14:44:05 GMT

Hi,

I think you just need to change the part where you set the TimeExtent of the Map - to bind to the Value of the TimeSlider e.g.:

<esri:Map x:Name="MyMap" UseAcceleratedDisplay="True" TimeExtent="{Binding ElementName=MyTimeSlider, Path=Value}" WrapAround="True">
<esri:ArcGISTiledMapServiceLayer ID="BaseLayer" Url="http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer" />
<esri:FeatureLayer ID="EarthquakesLayer" Initialized="FeatureLayer_Initialized" Url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Earthquakes/Since_1970/MapServer/0" OutFields="*">
</esri:FeatureLayer>
</esri:Map>

...

<esri:TimeSlider x:Name="MyTimeSlider" Height="20" TimeMode="TimeExtent" 
MinimumValue="{Binding ElementName=MyMap, Path=Layers[EarthquakesLayer].TimeExtent.Start, Mode=OneWay}" 
MaximumValue="{Binding ElementName=MyMap, Path=Layers[EarthquakesLayer].TimeExtent.End, Mode=OneWay}" 
Value="{Binding ElementName=MyMap, Path=Layers[EarthquakesLayer].TimeExtent, Mode=OneWay}" >
</esri:TimeSlider>

Cheers

Mike

topic Re: Binding GraphicsLayer to a TimeSlider by code in ArcGIS Runtime SDK for WPF (Retired) Questions

Binding GraphicsLayer to a TimeSlider by code

Re: Binding GraphicsLayer to a TimeSlider by code