Please send me an example of 2.5D Chart for BarSeries.

4 posts, 1 answers
  1. Yaroslav
    Yaroslav avatar
    122 posts
    Member since:
    Jan 2016

    Posted 28 Oct Link to this post

    I bag your pardon. I'm in need of 2.5D Chart for BarSeries. I've tryed reproduce it as it done in your 2.5D_Chart example but as a result I get 'System.Windows.Markup.XamlParseException' in WpfXamlLoader.Load method because your 2.5D_Chart example is some dodgy. The exception snapshot you can see in 'Snapshot.PNG' file attached.

    So, what do I need. I need Bar chart with 2._5D BarSeries with fixed color (green color, for example, or magneta...it doesn't matter).

    Below is XAML of single Bar Chart. In my application I have 8 instances of such Bar Charts. All of them changing in real-time.

    <telerik:RadCartesianChart  Visibility="{Binding IsAbsoluteBarChartVisible}">
        <!--Annotation line-->
        <telerik:RadCartesianChart.Annotations>
            <telerik:CartesianGridLineAnnotation Axis="{Binding ElementName=verticalAxis}" Value="{Binding AnnotationValue}" Label="{Binding AnnotationLabel}"
                                                 Stroke="Red" StrokeThickness="2" DashArray="8 2">
                <!--Annotation line definition-->
                <telerik:CartesianGridLineAnnotation.LabelDefinition>
                    <telerik:ChartAnnotationLabelDefinition Location="Inside"  VerticalAlignment="Bottom"  HorizontalAlignment="Center">
                        <!--Установить стиль для аннотационной метки-->
                        <telerik:ChartAnnotationLabelDefinition.DefaultVisualStyle>
                            <Style TargetType="TextBlock">
                                <Setter Property="FontSize" Value="14"/>
                                <Setter Property="FontWeight" Value="DemiBold"/>
                                <Setter Property="Foreground" Value="Red" />
                            </Style>
                        </telerik:ChartAnnotationLabelDefinition.DefaultVisualStyle>
                    </telerik:ChartAnnotationLabelDefinition>
                </telerik:CartesianGridLineAnnotation.LabelDefinition>
            </telerik:CartesianGridLineAnnotation>
        </telerik:RadCartesianChart.Annotations>
        <!-- X-axis -->
        <telerik:RadCartesianChart.HorizontalAxis>
            <telerik:CategoricalAxis/>
        </telerik:RadCartesianChart.HorizontalAxis>
        <!-- Y-axis -->
        <telerik:RadCartesianChart.VerticalAxis>
            <telerik:LinearAxis x:Name="verticalAxis" Title="Проценты [%]" Minimum="{Binding ChartMinimum}" Maximum="{Binding ChartMaximum}" MajorStep="{Binding CurrentStep}"/>
        </telerik:RadCartesianChart.VerticalAxis>
        <!--Bar chart itself-->
        <telerik:RadCartesianChart.Series>
            <telerik:BarSeries ShowLabels="True" CategoryBinding="Category" ValueBinding="Value" ItemsSource="{Binding Data}"/>
        </telerik:RadCartesianChart.Series>
    </telerik:RadCartesianChart>
    Each such real-time Bar Chart has from 2 to 16 bars. All bars in one Bar Chart mast have the same color. Therefore, it would be nice if there was a common resource that defines the shape and color of the 2.5D Bar. I would be very grateful if you send me an example of such an application if this is possible ofcource.
  2. Yaroslav
    Yaroslav avatar
    122 posts
    Member since:
    Jan 2016

    Posted 28 Oct in reply to Yaroslav Link to this post

    For clarity: my application is WPF MVVM Prism multimodule application that has Shell and some Prism Modules. All the charts are collected in a specially-designed for this Prism Module. Lets it be called 'DisplayOutputModule'.
  3. UI for WPF is Visual Studio 2017 Ready
  4. Answer
    Lance | Tech Support Engineer, Sr.
    Admin
    Lance | Tech Support Engineer, Sr. avatar
    135 posts

    Posted 01 Nov Link to this post

    Hi Yaroslav,

    I've reviewed your code and do not see a problem with your ChartView configuration. However, I do see a potential problem with your first binding:

    <telerik:RadCartesianChart Visibility="{Binding IsAbsoluteBarChartVisible}"


    Going on only by what you've named your IsAbsoluteBarChartVisible property, it appears to be a boolean. This cannot be bound directly to a property of type UIElement.Visibility.

    To fix this, you can use a IValueConverter,  here's an example of a simple converter:

    public class BoolToVisibilityConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return (bool) value ? Visibility.Visible : Visibility.Collapsed;
        }
     
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return (Visibility)value == Visibility.Visible;
        }
    }


    Once that issue is fixed, your ChartView code works as expected. See the attached screenshot and I've also attached my demo app.


    Styling

    To answer your second question about styling, you can see how to style the BarSeries here. Here's an example:

    <telerik:BarSeries.DefaultVisualStyle>
      <Style TargetType="Border">
          <Setter Property="Background" Value="LightBlue"/>
          <Setter Property="BorderBrush" Value="Blue"/>
          <Setter Property="BorderThickness" Value="2"/>
      </Style>
    </telerik:BarSeries.DefaultVisualStyle>

    Note: If you want to change your bar series styling dynamically, you can use the DefaultVisualStyleSelector and return different styles from the selector as they fit your needs.

    Please let us know if you have any further questions.

    Regards,
    Lance | Tech Support Engineer, Sr.
    Telerik by Progress
    Do you need help with upgrading your WPF project? Try the Telerik API Analyzer and share your thoughts!
  5. Yaroslav
    Yaroslav avatar
    122 posts
    Member since:
    Jan 2016

    Posted 02 Nov in reply to Lance | Tech Support Engineer, Sr. Link to this post

    Thank you very much, Lance, for your helping. I'll see your code example. But 'IsAbsoluteBarChartVisible' property has 'Visibility' type in the ViewModel not 'bool' and about this property I'm correct. (So you make me redden.) I'll again try to set the required Style (2.5D) of BarSeries. I had some difficulty with the analysis of the source text of your 2.5D_Chart example because I don't have enough time unfortunately for the careful analysis of it. Thank you very much again.
Back to Top