Hello,
I'm desperately trying to change the color of the background of my chart (inside of the axis = plot area in Excel - see attached). I tried the background property for the area, the grid... I also tried to alternate the same color in my grid.
How should I do that?
Thanks,
Mathias
9 Answers, 1 is accepted
If you want to change the BackColor of the chart, you can use the following code snippet:
this
.radChartView1.ChartElement.BackColor = Color.Aquamarine;
If you want to change the BackColor of the area when the series are pained, please refer to the following code snippet:
CartesianArea area =
this
.radChartView2.GetArea<CartesianArea>();
area.ShowGrid =
true
;
CartesianGrid grid = area.GetGrid<CartesianGrid>();
grid.DrawHorizontalFills =
true
;
grid.DrawVerticalFills =
true
;
grid.DrawHorizontalStripes =
false
;
grid.DrawVerticalStripes =
false
;
area.Grid.BackColor = Color.Aquamarine;
area.Grid.BackColor2 = Color.Aquamarine;
area.Grid.AlternatingBackColor = Color.Aquamarine;
area.Grid.AlternatingBackColor2 = Color.Aquamarine;
In the attachments you can find the image and the sample demo project how to achieved it.
Should you have further questions, I would be glad to help.
Regards,
Ralitsa
Telerik
See What's Next in App Development. Register for TelerikNEXT.
Thanks Ralitsa,
it's working fine now!
Best,
Mathias
A question regarding this, is it possible to do the opposite (i.e paint only the area outside of the area where the series are being painted)?
Thank you for contacting us.
Yes, you can change that BackColor of area. Please refer to the code snippet below how to achieve it:
this
.radChartView1.ChartElement.BackColor = Color.Aquamarine;
CartesianArea area1 =
this
.radChartView1.GetArea<CartesianArea>();
area1.ShowGrid =
true
;
CartesianGrid grid1 = area1.GetGrid<CartesianGrid>();
grid1.DrawHorizontalFills =
true
;
grid1.DrawVerticalFills =
true
;
grid1.DrawHorizontalStripes =
false
;
grid1.DrawVerticalStripes =
false
;
area1.Grid.BackColor = Color.White;
area1.Grid.BackColor2 = Color.White;
area1.Grid.AlternatingBackColor = Color.White;
area1.Grid.AlternatingBackColor2 = Color.White;
In the attachments you can find an image demonstrating the appearance of RadChartVeiw.
Hope this will help you. Let me know if you have any other questions.
Regards,
Ralitsa
Telerik
i am using radchartview and i am using areaseries to plot areachart in windows form.i need to add opacity to the plot area chart , i searched a lot but not able to find it, can you please help me on this. Please find the image attached.
Below is the code i am using.
List<AreaSeries> _areaseries = new List<AreaSeries>();
foreach (DataRow row in table.Rows)
{
AreaSeries areaseries = new AreaSeries();
foreach (DataColumn column in table.Columns)
{
if (!_allowedcolumns.Contains(column.ColumnName))
{
areaseries.DataPoints.Add(new CategoricalDataPoint(Convert.ToDouble(row[column]), column.ColumnName.Replace("h", "").Trim()));
}
}
areaseries.LegendTitle = Convert.ToString(row["Week"]);
_areaseries.Add(areaseries);
}
foreach (AreaSeries series in _areaseries)
{
//series.ShowLabels = true;
if (series.LegendTitle == "This Week")
series.ImageOpacity = 30;
this.radChartView1.Series.Add(series);
}
this.radChartView1.ShowTitle = true;
this.radChartView1.ShowLegend = true;
this.radChartView1.ShowGrid = true;
this.radChartView1.Title = "CUSTOMERS PER DAY vs CUSTOMERS PER DAY LAST WEEK";
this.radChartView1.ChartElement.TitleElement.Font = new Font("Arial", 8, FontStyle.Regular);
this.radChartView1.ChartElement.TitlePosition = TitlePosition.Bottom;
this.radChartView1.ChartElement.TitleElement.TextAlignment = ContentAlignment.TopCenter;
this.radChartView1.Area.View.Palette = KnownPalette.Metro;
//this.radChartView1.Axes[0].Title = "TIME OF DAY";
//this.radChartView1.Axes[1].Title = "NUMBER OF CUSTOMERS PER HOUR";
something this below link but dynamically,
https://docs.telerik.com/devtools/winforms/controls/chart/how-to/how-do-i-make-colors-display-with-partial-transparency#how-do-i-make-colors-display-with-partial-transparency
The referred link is relevant to RadChart which has been obsolete for years and replaced by RadChartView.
If you need to make the series transparent with a specific opacity, you can iterate the RadChartView.Series collection after the palette is applied and specify the alpha for each color in order to obtain a semi-transparent color. Please refer to the following code snippet:
foreach
(AreaSeries s
in
this
.radChartView1.Series)
{
s.BackColor = Color.FromArgb(125, s.BackColor.R, s.BackColor.G, s.BackColor.B);
}
I hope this information helps. If you need any further assistance please don't hesitate to contact me.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
i have to do that very day, so i got some concept of custom pallete and i used it like this, as many series i have i assigned that much of pallete like shown below and after that i assigned the pallete to the chart like shown in attached file . Please let me know if this approach works if the series increases.
public class CustomPalette : ChartPalette
{
public CustomPalette()
{
this.GlobalEntries.Add(Color.FromArgb(80, 33, 92, 122), Color.FromArgb(33, 92, 122));
this.GlobalEntries.Add(Color.FromArgb(75, 191, 217, 122), Color.FromArgb(191, 217, 122));
}
}
Creating a custom palette and adding a collection of palette entries seems to be a suitable solution for your case. The following help article also demonstrates how to add a custom palette: https://docs.telerik.com/devtools/winforms/controls/chartview/customization/palettes
Thus, you can add as many colors as series you have in RadChartView.
Should you have further questions please let me know.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik