Thanks for responding Michael.

I have verified all the different templates/styles applied for timeline control. I found that EventTitleBottomStyle is causing the issue. We are using custom user control for EventTitle ControlTemplate. If I remove this style, it is getting loading within a second.  Also there are multiple points for the specified date range (e.g. from 2004 to 2020), such that those points are overlapping each others. Hence event title(user control) is not getting displayed for all points.

Below is the xaml for user control.

<UserControl x:Class="XXX"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="../../Images/vector_blankdate.xaml"></ResourceDictionary>
                <ResourceDictionary Source="../../Images/vector_blankdate_future_visit.xaml"></ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
            <Style TargetType="{x:Type ToolTip}">
                <Setter Property="ContentTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <Border CornerRadius="5">
                                <TextBlock TextWrapping="Wrap" Text="{Binding}" />
                            </Border>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="Content" Value="">
                        <Setter Property="Visibility" Value="Collapsed" />
                    </Trigger>
                </Style.Triggers>
            </Style>

            <LinearGradientBrush x:Key="NormalVisitBrush" StartPoint="0,0" EndPoint="0,1">
                <GradientStop Color="#007d8a" Offset="0" />
                <GradientStop Color="#045360" Offset="0.8" />
            </LinearGradientBrush>
            <SolidColorBrush x:Key="CancelVisitBrush" Color="Gray"></SolidColorBrush>
            <SolidColorBrush x:Key="FutureEventColorBrush" Color="#EBF7F8"></SolidColorBrush>
            <SolidColorBrush x:Key="FutureEventForegroundColorBrush" Color="#045360"></SolidColorBrush>
        </ResourceDictionary>
    </UserControl.Resources>

    <Grid>

        <Grid.RowDefinitions>
            <RowDefinition x:Name="UpButtonRow" Height="Auto" />
            <RowDefinition x:Name="ContentRow" Height="*" />
            <RowDefinition x:Name="DownButtonRow" Height="Auto" />
        </Grid.RowDefinitions>

        <Line Name="Line1" Panel.ZIndex="0" Grid.RowSpan="3" Y1="0" 
              X1="{Binding Path=LineX2Position,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay }" 
              X2="{Binding Path=LineX2Position,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay }" 
              Y2="{Binding Path=LineY2Position,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay }" StrokeThickness="1" >
            <Line.Style>
                <Style TargetType="Line">
                    <Setter Property="Stroke" Value="{StaticResource NormalVisitBrush}"></Setter>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ElementName=VisitBubble,Path=DataContext.VisitStatus}" Value="CAN">
                            <Setter Property="Stroke" Value="{StaticResource CancelVisitBrush}"></Setter>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>

            </Line.Style>
        </Line>
        <Border Name="VisitBubble" BorderBrush="#FFAAAAAA" BorderThickness="1" CornerRadius="0,5,5,0" Margin="0,0,0,2" 
                                Background="White">
            <Border.Effect>
                <DropShadowEffect BlurRadius="8" Color="#f2f2f2"/>
            </Border.Effect>

            <Grid MouseDown="content_MouseClick">
                <Grid.RowDefinitions>
                    <RowDefinition Height="22" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>

                <Grid x:Name="PART_Header">

                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <Border CornerRadius="0,5,0,0" Grid.ColumnSpan="2" BorderThickness="1">
                        <Border.Style>
                            <Style TargetType="Border">
                                <Setter Property="Background" Value="{StaticResource NormalVisitBrush}"></Setter>
                                <Setter Property="BorderBrush" Value="{StaticResource NormalVisitBrush}"></Setter>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding IsFutureVisit}" Value="True">
                                        <Setter Property="Background" Value="{StaticResource FutureEventColorBrush}"></Setter>
                                        <Setter Property="BorderBrush" Value="{StaticResource NormalVisitBrush}"></Setter>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding VisitStatus}" Value="CAN">
                                        <Setter Property="Background" Value="{StaticResource CancelVisitBrush}"></Setter>
                                        <Setter Property="BorderBrush" Value="{StaticResource CancelVisitBrush}"></Setter>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Border.Style>
                    </Border>

                    <Grid Grid.Column="0">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid HorizontalAlignment="Center" VerticalAlignment="Center" Width="18" Height="18" Margin="6,1,4,2">
                            <Image>
                                <Image.Style>
                                    <Style TargetType="Image">
                                        <Setter Property="Source" Value="{StaticResource vector_blankdate}"></Setter>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding IsFutureVisit}" Value="True">
                                                <Setter Property="Source" Value="{StaticResource vector_blankdate_future_visit}"></Setter>
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding VisitStatus}" Value="CAN">
                                                <Setter Property="Source" Value="{StaticResource vector_blankdate}"></Setter>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Image.Style>
                            </Image>
                            <TextBlock x:Name="DayLabel" Text="{Binding Day, StringFormat=\{0:00\}}"
                                                        HorizontalAlignment="Center" 
                                       Padding="2,4,2,0" FontSize="10"
                                                        FontWeight="Bold">
                                <TextBlock.Style >
                                    <Style TargetType="TextBlock">
                                        <Setter Property="Foreground" Value="{StaticResource NormalVisitBrush}"></Setter>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding IsFutureVisit}" Value="True">
                                                <Setter Property="Foreground" Value="White"></Setter>
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding VisitStatus}" Value="CAN">
                                                <Setter Property="Foreground" Value="{StaticResource CancelVisitBrush}"></Setter>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </TextBlock.Style>
                            </TextBlock>
                        </Grid>
                    </Grid>

                    <TextBlock x:Name="TitleLabel" Text="{Binding Title}" Padding="5,0,2,0"
                                               Grid.Column="1" TextWrapping="Wrap" VerticalAlignment="Center"
                                               HorizontalAlignment="Left" FontSize="12"
                                               FontWeight="Bold" >
                        <TextBlock.Style>
                            <Style TargetType="TextBlock">
                                <Setter Property="Foreground" Value="White"></Setter>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding IsFutureVisit}" Value="True">
                                        <Setter Property="Foreground" Value="{StaticResource FutureEventForegroundColorBrush}"></Setter>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding VisitStatus}" Value="CAN">
                                        <Setter Property="Foreground" Value="White"></Setter>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </TextBlock.Style>
                    </TextBlock>
                </Grid>

                <Grid Grid.Row="1" x:Name="PART_Content">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="60" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>

                    <Grid Grid.Row="0" Margin="5">
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition />
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <TextBlock Grid.Row="0" x:Name="Label1" Text="{Binding Property1}" ToolTip="{Binding Property1}"
                                                   HorizontalAlignment="Stretch" Padding="3,0,0,0" FontSize="11"
                                                   Foreground="#FF170303" FontWeight="Normal" VerticalAlignment="Top"
                                                   TextTrimming="WordEllipsis" MaxWidth="215" />
                        <TextBlock Grid.Row="1" x:Name="Label2" Text="{Binding Property2}" ToolTip="{Binding Property2}"
                                                   HorizontalAlignment="Left" Padding="3,0,0,0" FontSize="11"
                                                   Foreground="#FF170303" FontWeight="Normal" VerticalAlignment="Top"
                                                   TextTrimming="WordEllipsis" MaxWidth="215" />
                        <TextBlock Grid.Row="2" x:Name="Label3" Text="{Binding Property3}" ToolTip="{Binding Property3}"
                                                   HorizontalAlignment="Left" Padding="3,0,0,0" FontSize="11"
                                                   Foreground="#FF170303" FontWeight="Normal" VerticalAlignment="Top"
                                                   TextTrimming="WordEllipsis" MaxWidth="215" />
                    </Grid>

                    <Border Grid.Row="1" 
                                x:Name="CancelStatusLabel" 
                                HorizontalAlignment="Right" 
                                Background="{StaticResource CancelVisitBrush}" 
                                CornerRadius="8" 
                                Padding="5,1,5,2" 
                                Margin="0,0,5,5">
                        <TextBlock Text="CANCELED" FontSize="9"
                                                   Foreground="White" FontWeight="Normal" VerticalAlignment="Center" HorizontalAlignment="Center"
                                                   />
                        <Border.Style>
                            <Style TargetType="Border">
                                <Setter Property="Visibility" Value="Collapsed"></Setter>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding VisitStatus}" Value="CAN">
                                        <Setter Property="Visibility" Value="Visible"></Setter>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Border.Style>
                    </Border>

                </Grid>
            </Grid>
        </Border>

    </Grid>

</UserControl>

Thanks Michael. I have uploaded the code to given location.

can you please check?

You can see the difference in time taken to render the control by removing EventTitleBottomStyle from below code,

Thanks and Regards,

Punam

Hello Punam,

I have run the sample project that you have uploaded, and it appears that a large part of the performance issue you are seeing is coming from a bunch of System.Windows.Data.Error instances that are occurring. These are handled, and you can see them in the Output window in Visual Studio when running your sample. They look like the following, and will cause performance issues when caught:

System.Windows.Data Error: 40 : BindingExpression path error: 'LineX2Position' property not found on 'object' ''DataPointVM' (HashCode=697829)'. BindingExpression:Path=LineX2Position; DataItem='DataPointVM' (HashCode=697829); target element is 'Line' (Name='Line1'); target property is 'X2' (type 'Double')

This is coming from the <Line> element named “Line1” in your EventTitleAccordion.xaml code and the bindings that are applied to the X1, X2, and Y2 properties of that Line. The properties that you are trying to bind to (LineX2Position and LineY2Position) do not exist on the DataContext of the Line object, as its DataContext is your underlying data point, and so this binding will fail, causing performance issues for each Line it tries to draw. It appears to be trying to draw the line for each data point in your XamTimeline, and so the more points you have, the worse this performance issue will become. I am unsure of your intent with this Line element, but if you remove it, the performance issue goes away.

Please let me know if you have any other questions or concerns on this matter.