To show the stroke in middle of lineseries in the graph

[Ramya]

    Hi ,

        Could any one please help me in showing the stroke in the middle of the line series as shown in the image.

Thanks,
Ruth

[Pavel R. Pavlov]

Hello Ramya,

I am happy to inform you that there is straightforward way to achieve your requirement. The RadChartView control allows customers to use annotations. In your case you can try using CustomLine Annotation to visualize the dashed line.

Please give this approach a try and let us know if you need any further assistance.

Regards,
Pavel R. Pavlov
Telerik

[Ramya]

Hello Pavlov,

Thank you so much for your support,but i have the issue with the line series and custom annotation am not able to achieve the scenario as in the image  Please look into following code, and please guide me asap how to achieve this.

 

<chart:RadCartesianChart
HorizontalAlignment="Left" Margin="4" Name="ChartCurve" VerticalAlignment="Top" MinHeight="251" MinWidth="550" >

           
<chart:RadCartesianChart.VerticalAxis>

               
<chartView:LinearAxis Title="Probability" Maximum="1" x:Name="verticalAxis"/>

           
</chart:RadCartesianChart.VerticalAxis>

 

           
<chart:RadCartesianChart.Series>

               
<chartView:LineSeries ItemsSource="{Binding XXX}" Stroke="#FF5AA4D4"
>

                   
<chartView:LineSeries.HorizontalAxis>

                       
<telerik:CategoricalAxis x:Name="horizontalAxis" Title="XXX" LabelRotationAngle="90"
/>

                   
</chartView:LineSeries.HorizontalAxis>

                   
<chartView:LineSeries.CategoryBinding>

                       
<chartView:PropertyNameDataPointBinding PropertyName="XValue"/>

                   
</chartView:LineSeries.CategoryBinding>

                   
<chartView:LineSeries.ValueBinding>

                       
<chartView:PropertyNameDataPointBinding PropertyName="YValue"/>

                   
</chartView:LineSeries.ValueBinding>

               
</chartView:LineSeries>

           
</chart:RadCartesianChart.Series>

 

           
<chart:RadCartesianChart.Annotations>

               
<telerik:CartesianGridLineAnnotation Value="0.75" Stroke="LightBlue" StrokeThickness="1" Axis="{Binding ElementName=verticalAxis}"/>

               
<telerik:CartesianGridLineAnnotation Value="8500000" Stroke="Red" StrokeThickness="1" Axis="{Binding ElementName=horizontalAxis}"/>

               
<telerik:CartesianGridLineAnnotation Value="9000000" Stroke="Blue" StrokeThickness="1" Axis="{Binding ElementName=horizontalAxis}"/>

               
<telerik:CartesianCustomLineAnnotation HorizontalFrom="8500000" VerticalFrom="0.2"

                                     
 HorizontalTo="8500000"  VerticalTo="0.9"

                                     
 Stroke="Orange"

                                       StrokeThickness="2"/>

           
</chart:RadCartesianChart.Annotations>

</chart:RadCartesianChart


Thanks,
Ruth

[Ramya]

Thank you so much for your support,but i have the issue with the line series and custom annotation am not able to achieve the scenario as in the image  Please look into following code, and please guide me asap how to achieve this.

 

<chart:RadCartesianChart
HorizontalAlignment="Left" Margin="4" Name="ChartCurve" VerticalAlignment="Top" MinHeight="251" MinWidth="550" >

           
<chart:RadCartesianChart.VerticalAxis>

               
<chartView:LinearAxis Title="Probability" Maximum="1" x:Name="verticalAxis"/>

           
</chart:RadCartesianChart.VerticalAxis>

 

           
<chart:RadCartesianChart.Series>

               
<chartView:LineSeries ItemsSource="{Binding XXX}" Stroke="#FF5AA4D4"
>

                   
<chartView:LineSeries.HorizontalAxis>

                       
<telerik:CategoricalAxis x:Name="horizontalAxis" Title="XXX" LabelRotationAngle="90"
/>

                   
</chartView:LineSeries.HorizontalAxis>

                   
<chartView:LineSeries.CategoryBinding>

                       
<chartView:PropertyNameDataPointBinding PropertyName="XValue"/>

                   
</chartView:LineSeries.CategoryBinding>

                   
<chartView:LineSeries.ValueBinding>

                       
<chartView:PropertyNameDataPointBinding PropertyName="YValue"/>

                   
</chartView:LineSeries.ValueBinding>

               
</chartView:LineSeries>

           
</chart:RadCartesianChart.Series>

 

           
<chart:RadCartesianChart.Annotations>

               
<telerik:CartesianGridLineAnnotation Value="0.75" Stroke="LightBlue" StrokeThickness="1" Axis="{Binding ElementName=verticalAxis}"/>

               
<telerik:CartesianGridLineAnnotation Value="8500000" Stroke="Red" StrokeThickness="1" Axis="{Binding ElementName=horizontalAxis}"/>

               
<telerik:CartesianGridLineAnnotation Value="9000000" Stroke="Blue" StrokeThickness="1" Axis="{Binding ElementName=horizontalAxis}"/>

               
<telerik:CartesianCustomLineAnnotation HorizontalFrom="8500000" VerticalFrom="0.2"

                                     
 HorizontalTo="8500000"  VerticalTo="0.9"

                                     
 Stroke="Orange" 

                                       StrokeThickness="2"/>

           
</chart:RadCartesianChart.Annotations>

</chart:RadCartesianChart


Thanks,
Ruth

[Pavel R. Pavlov]

Hi,

For your convenience I prepared a solution demonstrating how you can use the CartesianCustomLineAnnotation. You need to have in mind that if the points specified by the HorizontalFrom, HorizontalTo, VerticalFrom and VerticalTo properties is not present in the charting component, the annotations will not be  visualized.

Please take a look at the attached project and let me know if you need any further assistance.

Regards,
Pavel R. Pavlov
Telerik