To show the stroke in middle of lineseries in the graph

5 posts, 1 answers
  1. Ramya
    Ramya avatar
    15 posts
    Member since:
    Dec 2013

    Posted 14 Jan 2014 Link to this post


        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
  2. Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1182 posts

    Posted 16 Jan 2014 Link to this post

    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
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Ramya
    Ramya avatar
    15 posts
    Member since:
    Dec 2013

    Posted 06 Feb 2014 in reply to Pavel R. Pavlov Link to this post

    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
  5. Ramya
    Ramya avatar
    15 posts
    Member since:
    Dec 2013

    Posted 06 Feb 2014 Link to this post

    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
  6. Answer
    Pavel R. Pavlov
    Admin
    Pavel R. Pavlov avatar
    1182 posts

    Posted 10 Feb 2014 Link to this post

    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 HorizontalFromHorizontalToVerticalFrom 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

    Check out the new Telerik Platform - the only modular platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native apps. Register for the free online keynote and webinar to learn more about the Platform on Wednesday, February 12, 2014 at 11:00 a.m. ET (8:00 a.m. PT).

Back to Top
UI for WPF is Visual Studio 2017 Ready