How to set alternative color of column in asp.net chart control

In this article I am going to explain how to set alternative color of column in column chart in asp.net chart control.


Implementation:
I am using chart control to draw column chart and set alternative color of column.
I have created a table Tb_Population and insert some dummy data.

Id
int
StateName
varchar(200)
TotalPopulation
bigint

HTML Markup:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Statewise Population</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
      <asp:Chart ID="Chart1" runat="server" Width="800px">
            <Series>
                  <asp:Series Name="TotalPopulation" IsValueShownAsLabel="True" LabelFormat="F0"  Legend="Legend1"></asp:Series>
        <asp:Series ChartArea="ChartArea1" LabelFormat="F0"  IsValueShownAsLabel="True" Legend="Legend1"  Name="StateName" ></asp:Series>
            </Series>
             <Titles> 
             <asp:Title Font="Open Sans, 12pt, style=Bold" Name="title1" Text="Statewise Population"/>
        </Titles> 
            <ChartAreas>
                <asp:ChartArea Name="ChartArea1"></asp:ChartArea>
            </ChartAreas>
        </asp:Chart>
    </div>
    </form>
</body>
</html>

Import the namespace
C#:
using System.Configuration;
using System.Data.SqlClient;
using System.Data;
using System.Web.UI.DataVisualization.Charting;
using System.Drawing;

VB:
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Imports System.Web.UI.DataVisualization.Charting
Imports System.Drawing

Create Connection
C#:
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());

VB:
Private con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ToString())

Draw chart
Create function to bind chart and call it on page load event.
C#:
protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            BindChart();
        }
    }
    public void BindChart()
    {
        try
        {
            SqlDataAdapter adp = new SqlDataAdapter("Select StateName,TotalPopulation from Tb_Population", con);
            DataTable dt = new DataTable();
            adp.Fill(dt);
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                Chart1.Series["TotalPopulation"].Points.Add(new DataPoint(i, dt.Rows[i]["TotalPopulation"].ToString().Trim()));
                Chart1.Series[0].Points[i].AxisLabel = dt.Rows[i]["StateName"].ToString().Trim();
            }
            foreach (Series charts in Chart1.Series)
            {
                int i = 0;
                foreach (DataPoint point in charts.Points)
                {
                    point.Label = string.Format("{0:0}", point.YValues[0]);
                    if (i % 2 == 0)
                    {
                        Color colour = ColorTranslator.FromHtml("#CD5C5C");
                        point.Color = colour;
                    }
                    else
                    {
                        Color colour = ColorTranslator.FromHtml("#bfbfbf");
                        point.Color = colour;
                    }
                    i++;
                }
            }      
        }
        catch (Exception ex)
        {
        }
    } 

VB:
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            BindChart()
        End If
    End Sub
    Public Sub BindChart()
        Try
            Dim adp As New SqlDataAdapter("Select StateName,TotalPopulation from Tb_Population", con)
            Dim dt As New DataTable()
            adp.Fill(dt)
            For i As Integer = 0 To dt.Rows.Count - 1
                Chart1.Series("TotalPopulation").Points.Add(New DataPoint(i, dt.Rows(i)("TotalPopulation").ToString().Trim()))
                Chart1.Series(0).Points(i).AxisLabel = dt.Rows(i)("StateName").ToString().Trim()
            Next
            For Each charts As Series In Chart1.Series
                Dim i As Integer = 0
                For Each point As DataPoint In charts.Points
                    point.Label = String.Format("{0:0}", point.YValues(0))
                    If i Mod 2 = 0 Then
                        Dim colour As Color = ColorTranslator.FromHtml("#CD5C5C")
                        point.Color = colour
                    Else
                        Dim colour As Color = ColorTranslator.FromHtml("#bfbfbf")
                        point.Color = colour
                    End If
                    i += 1
                Next
            Next
        Catch ex As Exception
        End Try
    End Sub





Post a Comment

[blogger]

MKRdezign

Contact Form

Name

Email *

Message *

Powered by Blogger.
Javascript DisablePlease Enable Javascript To See All Widget