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

LineSeries Color setting combined with labels

7 Answers 461 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
Holger
Top achievements
Rank 1
Holger asked on 17 May 2018, 12:07 PM

     To set the Color of a Line in a Lineseries, we are supposed to set

 lineSeries.BorderColor = Color.Black;

But if I have Labels Enabled

(lineSeries.ShowLabels = true)

the labels get a Border, just by setting the Color of the LineSeries itself.

Screenshot attached.

I just want a single line black on white Chart.

 

 

 

7 Answers, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 17 May 2018, 12:50 PM
Hi Holger,

Yes, this is expected when the BorderColor of the labels is not explicitly set. You can set the labels BorderColor in the LabelFormatting event handler:
private void RadChartView1_LabelFormatting(object sender, ChartViewLabelFormattingEventArgs e)
{
    e.LabelElement.BorderColor = Color.Transparent;
}

I hope this will be useful. Let me know if you have additional questions.

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Holger
Top achievements
Rank 1
answered on 17 May 2018, 01:25 PM

Yes it works, thank you.

This inheritance might be useful for something like a Font, for the LineColor this inheritance is never wanted. I consider this a workaround.

However, a related Question, when I draw the line on top of something else, I have a RangeSeries here,

the color seems to be modified or combined, or there might be some transparency added, or it's the AntiAliasing maybe.

How come my black line appears gray, when drawn on another background ?

0
Dimitar
Telerik team
answered on 18 May 2018, 09:49 AM
Hello Holger,

Thank you for the feedback we will consider improving this if possible. 

The series painting depend on their adding order. In this case, you should add the line series after the range and the line will be painted over the area. You may need to change the color of the range series after that as well. For example:
rangeSeries.BackColor = Color.Gray;
rangeSeries.BorderColor = Color.DarkGray;

I hope this will be useful.

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Holger
Top achievements
Rank 1
answered on 18 May 2018, 10:09 AM

Well, in reverse order, the line is invisible/completly hidden, this is conclusive.

But the Color of the Line ist set to black, and then drawn on this gray 'background' the line is not black anymore.

You can compare the axis-Line is in correct black, the Lineseries is not.

If this is not done by purpose, maybe Telerik added some automatic transparency features, if ChartSeries cover each other,

than it must be some AntiAliasing effect.

By having a look into the source-code, I found out the Lineseries is drawn as a Series of Rectangles, 

that's why we have to set the BorderColor, and maybe DrawRectangle has some different Antialiasing-Behaviour than DrawLine.

However, this is not so important, more a curiosity.

0
Accepted
Dimitar
Telerik team
answered on 18 May 2018, 11:35 AM
Hi Holger,

The line is visible in both cases on my side. I have attached my test project. Could you please check it and let me know how it differs from your real setup? 

I have attached a couple of screenshots that show the result on my side as well. Please note that a transparent color is used for the area by default. If you are using a custom one you could set its transparency. This is demonstrated in the sample project. You can test by adding the line series first. 

I am looking forward to your reply.

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Holger
Top achievements
Rank 1
answered on 18 May 2018, 02:34 PM

You really put a lot of effort in this, thank you.

Well, I found out, the series use reverse order, they are painted from Last to First.

A programmer always paints the background first, and everything else on top.

But when adding series to the chart, I have to Add the "background" series Last.
That's against my intuition.
And also against yours, since you wrote:
"you should add the line series after the range and the line will be painted over the area"
That's wrong. Your screenshots are the proof.

Second thing:
I hadn't set the color of the RangeSeries,
As you confirmed just now, and what I explicitly asked for, is "the default colors are transparent".

(this is not so simple to find out, since the Default Colors are applied later, at no point in your code, you can set a breakpoint and just inspect Series.BackColor, it's always Color.Transparent)

So what I had, was my black line, behind a (coincidently) grey area.

 

With all Colors being transparent by default,

the order of Adding things to the SeriesCollection, has actually only little influence to the result. You always see everything.

So the counter-intuitive Adding Order is just pointing out, when handling colors manually.

We finally clearified this, maybe you find a good place to document this.

 

 

 

 

 

 


0
Dimitar
Telerik team
answered on 21 May 2018, 06:44 AM
Hi Holger,

Yes, you are correct and the series are indeed painted in reverse order. I am glad that you have found a solution for your case. We will add this to the documentation when possible. 

Do not hesitate to contact us if you have other questions.
 
Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
ChartView
Asked by
Holger
Top achievements
Rank 1
Answers by
Dimitar
Telerik team
Holger
Top achievements
Rank 1
Share this question
or