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

[Solved] Legend Colors do not match chart colors

1 Answer 235 Views

Chart (Obsolete)

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

Tad asked on 01 Nov 2010, 08:20 PM

chartimage.png

I'm trying to use a custom color pallette with stacked bar charts and can't seem to get the legend colors to match the chart. I can't find any other threads related to this issue.

Test.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="BorrowSmartReporting.test" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<div>

<asp:Panel ID="TestArea" runat="server" />

</div>

</form>

</body>

</html>

Test.aspx.cs

using System;

using System.Collections.Generic;

using System.Drawing;

using System.Data;

using System.IO;

using System.Linq;

using System.Web;

using Telerik.Web.UI;

using Telerik.Charting;

namespace BorrowSmartReporting

{

public partial class test : System.Web.UI.Page

{

public System.Drawing.Color[] ChartColors = new System.Drawing.Color[13]

{

System.Drawing.Color.Black, //Total Liabilities

System.Drawing.Color.DarkOrange, //Spent

System.Drawing.Color.YellowGreen, //Saved

System.Drawing.Color.LightBlue,

System.Drawing.Color.BurlyWood,

System.Drawing.Color.DarkKhaki,

System.Drawing.Color.DarkSeaGreen,

System.Drawing.Color.Goldenrod,

System.Drawing.Color.LightSteelBlue,

System.Drawing.Color.LightSalmon,

System.Drawing.Color.Silver,

System.Drawing.Color.Thistle,

System.Drawing.Color.Gold

};

protected void Page_Load(object sender, EventArgs e)

{

DataTable LiabilityTable = new DataTable();

LiabilityTable.Columns.Add("Balance", System.Type.GetType("System.Double"));

LiabilityTable.Columns.Add("LiabilityType", System.Type.GetType("System.String"));

DataRow Test1 = LiabilityTable.NewRow();

Test1["Balance"] = 21000;

Test1["LiabilityType"] = "Auto";

LiabilityTable.Rows.Add(Test1);

DataRow Test2 = LiabilityTable.NewRow();

Test2["Balance"] = 10000;

Test2["LiabilityType"] = "Credit Card";

LiabilityTable.Rows.Add(Test2);

DataRow Test3 = LiabilityTable.NewRow();

Test3["Balance"] = 210000;

Test3["LiabilityType"] = "Mortgage";

LiabilityTable.Rows.Add(Test3);

DataView Liabilities = new DataView(LiabilityTable);

RadChart CurrentLiabilitiesPageChart2 = new RadChart();

double total = 0;

for (int i = 0; i < Liabilities.Count; i++)

{

ChartSeries stackedBarSeries = new ChartSeries();

stackedBarSeries.Type = ChartSeriesType.StackedBar;

double balance = 0;

double.TryParse(Liabilities[i]["Balance"].ToString(), out balance);

total += balance;

stackedBarSeries.AddItem(balance);

stackedBarSeries.Name = Liabilities[i]["LiabilityType"].ToString() + " (" + balance.ToString("C0") + ")";

stackedBarSeries.Items[0].Label.TextBlock.Visible = false;

stackedBarSeries.Items[0].Appearance.FillStyle.FillType = Telerik.Charting.Styles.FillType.Gradient;

stackedBarSeries.Items[0].Appearance.FillStyle.MainColor = ChartColors[i + 3];

CurrentLiabilitiesPageChart2.Series.Add(stackedBarSeries);

}

CurrentLiabilitiesPageChart2.ChartTitle.TextBlock.Text = "Balances";

CurrentLiabilitiesPageChart2.Width = 400;

CurrentLiabilitiesPageChart2.Height = 300;

CurrentLiabilitiesPageChart2.Appearance.Border.Visible = false;

CurrentLiabilitiesPageChart2.PlotArea.Appearance.Border.Visible = false;

CurrentLiabilitiesPageChart2.Legend.Appearance.Border.Visible = false;

CurrentLiabilitiesPageChart2.PlotArea.XAxis.Appearance.TextAppearance.Visible = false;

CurrentLiabilitiesPageChart2.Legend.Appearance.ItemMarkerAppearance.Figure = "Rectange";

CurrentLiabilitiesPageChart2.PlotArea.Appearance.FillStyle.FillType = Telerik.Charting.Styles.FillType.Solid;

CurrentLiabilitiesPageChart2.PlotArea.Appearance.FillStyle.MainColor = Color.White;

CurrentLiabilitiesPageChart2.PlotArea.XAxis.AxisLabel.TextBlock.Appearance.TextProperties.Color = Color.Black;

CurrentLiabilitiesPageChart2.PlotArea.YAxis.Appearance.CustomFormat = "C0";

CurrentLiabilitiesPageChart2.Legend.Appearance.Location = Telerik.Charting.Styles.LabelLocation.OutsidePlotArea;

CurrentLiabilitiesPageChart2.AutoLayout = true;

TestArea.Controls.Add(CurrentLiabilitiesPageChart2);

}

Enclosed is the resulting Chart.

Help?!

Thanks,

--Tad Richard

1 Answer, 1 is accepted

answered on 04 Nov 2010, 01:48 PM

Hi Tad,

To be able to show same colors for Legend items Markers as for StackedBar series items you should create a Custom Palette and apply it for your Chart. Here is how you can achieve this:

Color[] seriesColors = new[]

{

Color.Red,

Color.Yellow,

Color.Black,

Color.Blue,

Color.White,

Color.Green,

};

Palette seriesPalette = new Palette("seriesPalette", seriesColors, true);

CurrentLiabilitiesPageChart2.CustomPalettes.Add(seriesPalette);

CurrentLiabilitiesPageChart2.SeriesPalette = "seriesPalette";

Add those code snippet after the line where you create new instance of RadChart :

RadChart CurrentLiabilitiesPageChart2 = new RadChart();

This will ensure that the legend items match the ChartSeriesItems colors and you will not need to set the color for each individual ChartSeriesItem.

Sincerely yours,
Evgenia
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items