Setting Custom Color Palette in Pie Chart

MS Chart control provide a good collection of predefined color palettes to set colors of your series but in case you would like to define your own color pattern then you can use Palette Custom Color method to define your own set of colors.

In this demo I have used pie chart but you can choose whichever type of chart you want and it will work just fine.

to get started let's setup basic chart control as below:

<asp:Chart ID="Chart1" runat="server" onclick="Chart1_Click" Height="340px"

Palette="SemiTransparent" Width="528px">

<Series>

<asp:Series ChartType="Pie"

CustomProperties="PieLineColor=BlanchedAlmond, PieDrawingStyle=SoftEdge"

Legend="Legend1" Name="Series1">

</asp:Series>

</Series>

<ChartAreas>

<asp:ChartArea Name="ChartArea1">

<Area3DStyle Enable3D="True" />

</asp:ChartArea>

</ChartAreas>

<Legends>

<asp:Legend Alignment="Far" Docking="Top" Name="Legend1">

</asp:Legend>

</Legends>

<BorderSkin BackColor="BurlyWood" BackGradientStyle="HorizontalCenter"

BackSecondaryColor="Blue" SkinStyle="Emboss" />

</asp:Chart>

 

Once this is ready we will load our sample data into the chart:

     Dictionary<string, int> chartData = new Dictionary<string, int>();

chartData.Add("FireFox",25);

chartData.Add("IE", 42);

chartData.Add("Safari", 10);

chartData.Add("Chrome", 23);

Chart1.Series[0].Points.DataBindXY(chartData.Keys, chartData.Values);

 

After this, let's create a color array(for this add using System.Drawing in using section of code behind file) and define our custom colors that we need to include in our palette :

Color[] myGreenColorPalette = new Color[4]{Color.FromKnownColor(KnownColor.Green),

Color.FromKnownColor(KnownColor.GreenYellow),Color.FromKnownColor(KnownColor.LawnGreen),

Color.FromKnownColor(KnownColor.LightGreen)};

 

so in above code, we have created color array and set its values from known color enumeration.

Now let's set our chart's color default palette to none and set our custom palette to newly created green color palette as shown below:

Chart1.Palette = ChartColorPalette.None;

Chart1.PaletteCustomColors = myGreenColorPalette;

 

And your new green color graph is ready:

Tags: , ,

ASP.NET | MS Chart