Legend Colors do not match chart colors

Thread is closed for posting
2 posts, 0 answers
  1. Tad
    Tad avatar
    15 posts
    Member since:
    Jul 2007

    Posted 01 Nov 2010 Link to this post

    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.


    <%@ 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">
    <head runat="server">
        <form id="form1" runat="server">
            <asp:Panel ID="TestArea" runat="server" />


    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
            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";
                DataRow Test2 = LiabilityTable.NewRow();
                Test2["Balance"] = 10000;
                Test2["LiabilityType"] = "Credit Card";
                DataRow Test3 = LiabilityTable.NewRow();
                Test3["Balance"] = 210000;
                Test3["LiabilityType"] = "Mortgage";
                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.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.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;

    Enclosed is the resulting Chart.



    --Tad Richard

  2. Evgenia
    Evgenia avatar
    1396 posts

    Posted 04 Nov 2010 Link to this post

    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[]  
            Palette seriesPalette = new Palette("seriesPalette", seriesColors, true);
            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,
    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
  3. DevCraft R3 2016 release webinar banner
Back to Top