This is a migrated thread and some comments may be shown as answers.

BarSeries as Custom Rectangle

7 Answers 124 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Valentin
Top achievements
Rank 1
Iron
Iron
Valentin asked on 15 Nov 2016, 09:16 AM

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 !

7 Answers, 1 is accepted

Sort by
0
Tanya
Telerik team
answered on 16 Nov 2016, 05:29 PM
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.
0
Valentin
Top achievements
Rank 1
Iron
Iron
answered on 17 Nov 2016, 10:12 AM

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.

0
Tanya
Telerik team
answered on 22 Nov 2016, 09:47 AM
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.
0
Valentin
Top achievements
Rank 1
Iron
Iron
answered on 30 Dec 2016, 08:43 AM

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.

0
Tanya
Telerik team
answered on 03 Jan 2017, 04:09 PM
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 you to write beautiful native mobile apps using a single shared C# codebase.
0
Valentin
Top achievements
Rank 1
Iron
Iron
answered on 11 Jan 2017, 02:17 PM

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.

0
Tanya
Telerik team
answered on 16 Jan 2017, 01:44 PM
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 you to write beautiful native mobile apps using a single shared C# codebase.
Tags
Chart
Asked by
Valentin
Top achievements
Rank 1
Iron
Iron
Answers by
Tanya
Telerik team
Valentin
Top achievements
Rank 1
Iron
Iron
Share this question
or