how to create two chart in same chart area.

Tushar Goel

Hi,

I want to create 2 chart between (severity and target ) and 2nd between (severity and actual) in same samechart. I am able to create between severity and actual but unable for other. I am using follwing code for this. Can any suggest what changes needs to be done to display both charts into same area.

void SetChartAreaFeatures(Chart tmpChart, String tmpArea)
{
tmpChart.ChartAreas[tmpArea].BorderDashStyle = ChartDashStyle.Solid;
tmpChart.ChartAreas[tmpArea].BorderWidth = 2;
tmpChart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
tmpChart.BorderlineColor = System.Drawing.
Color.FromArgb(26, 59, 105);
tmpChart.BorderlineWidth = 2;
tmpChart.BackColor = Color.AliceBlue;
tmpChart.ChartAreas[tmpArea].BackColor = Color.White;
tmpChart.ChartAreas[tmpArea].BackHatchStyle = ChartHatchStyle.None;
tmpChart.ChartAreas[tmpArea].BackGradientStyle = GradientStyle.None;
tmpChart.ChartAreas[tmpArea].BorderColor = Color.Black;
tmpChart.ChartAreas[tmpArea].BorderDashStyle = ChartDashStyle.Solid;
tmpChart.ChartAreas[tmpArea].BorderWidth = 1;
}

protected void Button1_Click(object sender, EventArgs e)
{
DateTime FromDate = Convert.ToDateTime(TextBox1.Text);
DateTime ToDate = Convert.ToDateTime(TextBox2.Text);

Chart1.Legends.Clear();
Chart1.Series.Clear();
Chart1.ChartAreas.Clear();

StringBuilder sb = new StringBuilder();
sb.Append("select re.Severity ,(select tv.Target from tbl_TargetValue tv where tv.Severity=re.Severity) as 'Target' ,Present=sum(re.SLAMet)*100/(sum(re.SLAMet)+sum(re.SLANotMet)) from tbl_Report re , tbl_TargetValue tv where tv.Severity=re.Severity and re.EventStartTime between '" + FromDate + "' and '" + ToDate + "' group by re.Severity");
using (SqlDataAdapter sda = new SqlDataAdapter(sb.ToString(), System.Configuration.ConfigurationManager.ConnectionStrings[""].ToString()))
{

DataSet ds = new DataSet();
sda.Fill(ds);

if (ds.Tables[0].Rows.Count > 0)
{
Chart1.ChartAreas.Add("re.Severity");
SetChartAreaFeatures(Chart1, "re.Severity");
Chart1.ChartAreas[0].AxisX.Title = "Severity";
Chart1.ChartAreas[0].AxisY.Title = "Percentage";
// Chart1.ChartAreas[1].AxisX.Title = "Severity";
Chart1.ChartAreas[0].AxisX.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Interval = 1;
Chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
Chart1.ChartAreas[0].AxisY.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisY2.LineColor = Color.Black;
Chart1.Series.Add("re.Severity");
Chart1.Series[0].IsVisibleInLegend = false;
Chart1.Series[0].Palette = ChartColorPalette.Bright;
Chart1.Series[0].ChartType = SeriesChartType.Column;
Chart1.Series[0]["DrawingStyle"] = "Emboss";
Chart1.Series[0].Points.DataBindXY(ds.Tables[0].DefaultView, "Severity", ds.Tables[0].DefaultView, "Present");
//Chart1.Series[1].Points.DataBindXY(ds.Tables[0].DefaultView, "Severity", ds.Tables[0].DefaultView, "Actual");
Chart1.Legends.Add("re.Severity");
List<string> colorList = new List<string>();
colorList.Add("Red");
colorList.Add("Green");
colorList.Add("Yellow");
colorList.Add("Purple");
colorList.Add("Orange");
colorList.Add("Blue");
colorList.Add("Brown");
colorList.Add("Teal");
colorList.Add("SkyBlue");
colorList.Add("Flusia");
colorList.Add("Pink");
for (int i = 0; i < Chart1.Series[0].Points.Count; i++)
{
Chart1.Series[0].Points[i].Color = Color.FromName(colorList[i]);
// Chart1.Series[i+0].Points[i].Color = Color.FromName(colorList[i]);
}

Regards
Tushar Goel

8 Replies

Know the answer? Post it — somebody with the same question will find it here.

Tushar Goel15y ago
ya sure , i created 2 series . i used following code:

from sql query i am getting 3 row o/p .. severity , actual and target. i need to draw graph between severity vs actual and severity vs target.
void SetChartAreaFeatures(Chart tmpChart, String tmpArea)
{
tmpChart.ChartAreas[tmpArea].BorderDashStyle = ChartDashStyle.Solid;
tmpChart.ChartAreas[tmpArea].BorderWidth = 2;
tmpChart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
tmpChart.BorderlineColor = System.Drawing.
Color.FromArgb(26, 59, 105);
tmpChart.BorderlineWidth = 2;
tmpChart.BackColor = Color.AliceBlue;
tmpChart.ChartAreas[tmpArea].BackColor = Color.White;
tmpChart.ChartAreas[tmpArea].BackHatchStyle = ChartHatchStyle.None;
tmpChart.ChartAreas[tmpArea].BackGradientStyle = GradientStyle.None;
tmpChart.ChartAreas[tmpArea].BorderColor = Color.Black;
tmpChart.ChartAreas[tmpArea].BorderDashStyle = ChartDashStyle.Solid;
tmpChart.ChartAreas[tmpArea].BorderWidth = 1;
}
protected void Button1_Click(object sender, EventArgs e)
{
Chart1.Legends.Clear();
Chart1.Series.Clear();
Chart1.ChartAreas.Clear();

StringBuilder sb = new StringBuilder();
sb.Append(" your query");
using (SqlDataAdapter sda = new SqlDataAdapter(sb.ToString(), System.Configuration.ConfigurationManager.ConnectionStrings["xxConnectionString"].ToString()))
{

DataSet ds = new DataSet();
sda.Fill(ds);

if (ds.Tables[0].Rows.Count > 0)
{
Chart1.Width = 450;

Chart1.ChartAreas.Add("Severity");
SetChartAreaFeatures(Chart1, "Severity");
Chart1.ChartAreas[0].AxisX.Title = "Severity";
Chart1.ChartAreas[0].AxisY.Title = "Percentage(%)";
// Chart1.ChartAreas[1].AxisX.Title = "Severity";
Chart1.ChartAreas[0].AxisY.Title = "Percentage(%)";
Chart1.ChartAreas[0].AxisX.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Interval = 1;
Chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
Chart1.ChartAreas[0].AxisY.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.Series.Add("Target");
Chart1.Series.Add("Actual");

Chart1.Series[0].ChartType = SeriesChartType.Column;
// Chart1.Series[1].ChartType = SeriesChartType.Bubble;
// Chart1.Series.Add("re.Severity");
Chart1.Series[0].IsVisibleInLegend = true;
Chart1.Series[0].IsValueShownAsLabel = true;
Chart1.Series[0]["Color"]= "Blue";
Chart1.Series[0].Palette = ChartColorPalette.None;
Chart1.Series[0].ChartType = SeriesChartType.Column;
Chart1.Series[0]["DrawingStyle"] = "Emboss";
Chart1.Series[0].Points.DataBindXY(ds.Tables[0].DefaultView, "Severity", ds.Tables[0].DefaultView, "Present");
Chart1.Series[1].IsVisibleInLegend = true;
Chart1.Series[1].IsValueShownAsLabel = true;
Chart1.Series[1].Palette = ChartColorPalette.None;
Chart1.Series[1].Color = Color.Orange;
Chart1.Series[1].ChartType = SeriesChartType.Column;
// Chart1.Series[1]["DrawingStyle"] = "Emboss";
Chart1.Series[1]["Color"] = "Red";
Chart1.Series[1].Points.DataBindXY(ds.Tables[0].DefaultView, "Severity", ds.Tables[0].DefaultView, "Target");
Chart1.Series["Target"].IsVisibleInLegend = true;
Chart1.Legends.Add(new Legend("Target"));
Chart1.Legends.Add(new Legend("Actual"));
Chart1.Series[0].Legend = "Actual";
Chart1.Series[1].Legend = "Target";
// Chart1.Legends = Chart1.Series[0].Color;
Chart1.Series[0].LegendText = "Present Status";
Chart1.Series[1].LegendText = "Target Needed";
Chart1.Legends[0].LegendStyle = LegendStyle.Table;
Chart1.Legends[0].TableStyle = LegendTableStyle.Wide;
Chart1.Legends[0].Docking = Docking.Bottom;
Chart1.Legends[0].TitleAlignment = StringAlignment.Center;
Chart1.Legends[0].Alignment = StringAlignment.Far;
Chart1.Legends[1].LegendStyle = LegendStyle.Table;
Chart1.Legends[1].TableStyle = LegendTableStyle.Wide;
Chart1.Legends[1].Docking = Docking.Bottom;
Chart1.Legends[1].TitleAlignment = StringAlignment.Center;
Chart1.Legends[1].Alignment = StringAlignment.Far;
Suthish Nair15y ago
great to hear you got the solution, also share with us.
Tushar Goel15y ago
Need not worry. I am able to figure out. Thanks..
Tushar Goel15y ago
Also,if i used another method , i will not get desired. is there any other changes needs to be done. please suggest on this one too.
using (SqlDataAdapter sda = new SqlDataAdapter(sb.ToString(), System.Configuration.ConfigurationManager.ConnectionStrings["HandoverConnectionString"].ToString()))
{

DataSet ds = new DataSet();
sda.Fill(ds);

if (ds.Tables[0].Rows.Count > 0)
{
Chart1.ChartAreas.Add("Severity");
SetChartAreaFeatures(Chart1, "Severity");
Chart1.ChartAreas[0].AxisX.Title = "Severity";
Chart1.ChartAreas[0].AxisY.Title = "Percentage(%)";
// Chart1.ChartAreas[1].AxisX.Title = "Severity";
Chart1.ChartAreas[0].AxisY.Title = "Percentage(%)";
Chart1.ChartAreas[0].AxisX.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Interval = 1;
Chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
Chart1.ChartAreas[0].AxisY.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisY2.LineColor = Color.Black;
Chart1.Series.Add("re.Severity");
Chart1.Series[0].IsVisibleInLegend = false;
Chart1.Series[0].IsValueShownAsLabel = true;
Chart1.Series[0].Palette = ChartColorPalette.Bright;
Chart1.Series[0].ChartType = SeriesChartType.Column;
Chart1.Series[0]["DrawingStyle"] = "Emboss";
Chart1.Series[0].Points.DataBindXY(ds.Tables[0].DefaultView, "Severity", ds.Tables[0].DefaultView, "Present");

/** Second chart property**/
Chart1.ChartAreas[0].AxisX2.Minimum = 0;
Chart1.ChartAreas[0].AxisX2.Interval = 1;
Chart1.ChartAreas[0].AxisX2.MajorGrid.Enabled = true;
Chart1.ChartAreas[0].AxisY2.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisY2.LineColor = Color.Black;
// Chart1.Series.Add("re.Severity");
Chart1.Series[0].IsVisibleInLegend = false;
Chart1.Series[0].IsValueShownAsLabel = true;
Chart1.Series[0].Palette = ChartColorPalette.Bright;
Chart1.Series[0].ChartType = SeriesChartType.Bubble;
Chart1.Series[0]["DrawingStyle"] = "Emboss";
Chart1.Series[0].Points.DataBindXY(ds.Tables[0].DefaultView, "Severity", ds.Tables[0].DefaultView, "Target");
L
Tushar Goel15y ago
Hey sathish, i have tried all the options you have suggested to me but unable to get desired results. I am able to draw 2 different chart in same chart area but unable to create as i want. Can you please help me further. I am trying to resolve this since yesternight but not successed. any help is appreciated.

Regards
Tushar Goel
Suthish Nair15y ago
you need to a for-loop and create multiple charts. refer my article clearly. its simple but takes your time.
Tushar Goel15y ago
Yes sathish, i am refering your article but my requirement is little bit different.
I want to display chart this way. consider blue represent s vs p , orange represet s vs a. i able to generate s vs a as per ur article but unable to do for next. Please help me.
Suthish Nair15y ago
Hi Tushar,

It seems you are refering my article or not?

Multiple Charts or ChartArea on a single Chart control - MSChart

Let me know what problem your are facing.