BarSeries as Custom Rectangle

8 posts, 0 answers
  1. Valentin
    Valentin avatar
    89 posts
    Member since:
    Mar 2016

    Posted 15 Nov 2016 Link to this post

    Hello Telerik,

     

    In my char, i'm using Cartesian & Bar Series. For the BarSeries, I'm using a "Custom Rectangle". My code :

    BarSeries seriePluvio = new BarSeries();
     
    //set attributs...
    //....
    //-------------
     
    //Create a template for for custom bar
    DataTemplate dt1 = new DataTemplate { DataType = typeof(System.Windows.Shapes.Rectangle) };
    FrameworkElementFactory dt1Factory = new FrameworkElementFactory { Type = typeof(System.Windows.Shapes.Rectangle) };
     
    //Set color for the bar --> IS OK
    dt1Factory.SetValue(System.Windows.Shapes.Rectangle.FillProperty, new SolidColorBrush(param.CouleurMesuresValides));
     
    //Set the width of the bar --> IS OK
    double d = new double();
    d = (Convert.ToDouble(param.EpaisseurTraitMesuresValides));
    dt1Factory.SetValue(System.Windows.Shapes.Rectangle.WidthProperty, d);
     
    //Set the line style of the bar --> IS NOK
    dt1Factory.SetValue(System.Windows.Shapes.Rectangle.StrokeDashArrayProperty, new DoubleCollection { 2, 2, 2, 2 });
     
    //The end of the code...
    dt1.VisualTree = dt1Factory;
    seriePluvio.PointTemplates.Add(dt1);
    //...............

     

    So, my problem is that the LineStyle is not applied. I tried with differents values/parameters for the DoubleCollection but this is always the same result. No visual changement.

     

    I'm using StrokeDashArrayProperty because this is the used property for the CartesianSeries.

    Can you help me ?

     

    Thank you very much !

  2. Tanya
    Admin
    Tanya avatar
    506 posts

    Posted 16 Nov 2016 Link to this post

    Hello Valentin,

    In order to render the stroke, you should apply a color to it:
    dt1Factory.SetValue(System.Windows.Shapes.Rectangle.StrokeProperty, Brushes.Black);

    And to make the lines easily visible, you could apply a bigger thickness to the stroke lines:
    dt1Factory.SetValue(System.Windows.Shapes.Rectangle.StrokeThicknessProperty, 6d);

    Regards,
    Tanya
    Telerik by Progress
    Telerik UI for WPF is ready for Visual Studio 2017 RC! Learn more.
  3. Valentin
    Valentin avatar
    89 posts
    Member since:
    Mar 2016

    Posted 17 Nov 2016 in reply to Tanya Link to this post

    Hello Tanya,

     

    Thank you for your answer, but this is not exactly what i'm searching.

    On this link, you can fin a directory : https://1drv.ms/f/s!AnmDloRrXmCkhSLOQ_AZ3mfh_OsV

    Inside, there are screens of what I've got and what I wand to do, and there is a file text to explain you what is each picture.

     

    So (after that you had seen pictures) : I need to have the picture '7' result (for BarSerie).

     

    To do that for StepLineSerie (I'm sorry, I said CartesianSerie but it is StepLineSerie, I'm using this code :

    StepLineSeries serieValide = new StepLineSeries();
    //...............
    serieValide.StrokeThickness = param.EpaisseurTraitMesuresValides;
    serieValide.Stroke = new SolidColorBrush(param.CouleurMesuresValides);
    serieValide.DashArray = this.GetDashArray(param.StyleTraitMesuresValides);

    And the GetDashArray()) method :

    private DoubleCollection GetDashArray(StyleTraitCourbe style)
            {
                if (style == StyleTraitCourbe.Plein)
                {
                    return new DoubleCollection { };
                }
                else if (style == StyleTraitCourbe.Tiret)
                {
                    return new DoubleCollection { 10, 5 };
                }
                else if (style == StyleTraitCourbe.Point)
                {
                    return new DoubleCollection { 2 };
                }
                else
                {
                    return new DoubleCollection { };
                }
            }

    StyleTraitCourbe is a EnumClass.

     

    It working find for StepLineSerie but it doesn't work for BarSerie.

     

    I hope I'm understandable.

     

    Thank you very much.

  4. Tanya
    Admin
    Tanya avatar
    506 posts

    Posted 22 Nov 2016 Link to this post

    Hi Valentin,

    I am still not sure I properly understand your scenario. From your last post, I suggest that you would like to visualize the bar series as a dashed line. If so, you can achieve that using the following approaches:

    1. If you are using CategoricalAxis, you can set the GapLength property to 1. This way, the space available for the series to render will decrease and only the border will be visualized.

    2. In case the axis is of another type that doesn't support GapLength, you can set the fill of the rectangle to a LinearGradientBrush with SpreadMethod = Repeat. Doing this, you will need to declare several gradient stops for the "dashes", which will be continuously repeated.

    Hope this helps.

    Regards,
    Tanya
    Telerik by Progress
    Telerik UI for WPF is ready for Visual Studio 2017 RC! Learn more.
  5. Valentin
    Valentin avatar
    89 posts
    Member since:
    Mar 2016

    Posted 30 Dec 2016 Link to this post

    Hello,

     

    I've got an other question about BarSeries :

    - Axis of my chart : y = value, x = datetime

     

    => When I have 2 points on a same datetime, the BarSeries are not superimposed but are next to them.

    I found a solution for 2 bars (I can superimposed them), but when there are 3 bars or more, all of the bars is not superimposed.

     

    You'll see on attached pictures the 'problem', my 'solution' for 2 bars, and the 'problem2' for 3 bars or more.

     

    This is my code for the solution (that is working find for 2 bars)

    if (this.viewModel.ParamGraphVariables.Any(p => p.Variable.IsPluvio))
    {
        int nbPluvio = this.viewModel.ParamGraphVariables.Where(p => p.Variable.IsPluvio).Count();
     
        if (nbPluvio == 1)
            dt1Factory.SetValue(System.Windows.Shapes.Rectangle.HorizontalAlignmentProperty, HorizontalAlignment.Center);
        else if (nbPluvio > 1)
        {
             int idxPluvio = this.viewModel.ParamGraphVariables.IndexOf(param);
     
              //Chiffre pair, alignement à droite & Chiffre impair, alignement à gauche
             //1 Pluvio OK | 2 pluvios OK | A partir de trois pluvio, décalage
     
              if (idxPluvio % 2 == 0)
                  dt1Factory.SetValue(System.Windows.Shapes.Rectangle.HorizontalAlignmentProperty, HorizontalAlignment.Right);
              else
                  dt1Factory.SetValue(System.Windows.Shapes.Rectangle.HorizontalAlignmentProperty, HorizontalAlignment.Left);
        }
    }

     

     

    I'm searching a solution which can working find for every time.

     

    Thank you.

  6. Tanya
    Admin
    Tanya avatar
    506 posts

    Posted 03 Jan Link to this post

    Hello Valentin,

    The CombineMode property of the series allows you to change the strategy used for drawing them. You can change its value to the one that best fits your needs.

    Regards,
    Tanya
    Telerik by Progress
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
  7. Valentin
    Valentin avatar
    89 posts
    Member since:
    Mar 2016

    Posted 11 Jan in reply to Tanya Link to this post

    Hello Tanya,

    Thank you for your answer.

     

    The CombineMode is working but the series are not coherents with the Y (value) axis. I attached screenshot to illustrate it.

    I have 3 values :

    0.2, 0.6 & 0.2. I think the value are added because de series up to 1.

     

    Any idea ?

     

    Thank you.

  8. Tanya
    Admin
    Tanya avatar
    506 posts

    Posted 16 Jan Link to this post

    Hello Valentin,

    Looking at the image you shared, seems like the CombineMode value is set to Stack. If so, the result you are observing is expected. When in Stack combine mode, the points in a particular category are stacked one over the other, as in a stack panel. In the current scenario, the 0.2 point is plotted on the range 0 to 0.2, the second point with value 0.6 starts rendering from 0.2 to 0.8 and the last point is drawn from 0.8 to 1.

    Another value of the ChartSeriesCombineMode enumeration you can try is None. 

    Regards,
    Tanya
    Telerik by Progress
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top