We Keep Coding

MSChart: line chart UI does not look proper

I was trying to generate winform line chart from data table but UI does not look good.
see the UI
also see my full sample code. I believe I am missing something in code for which chart UI does not look good. I do not understand for what reason a white box is coming in chart?
please see my full code and tell me what I need to add or rectify in my code.
code
private void show()
{
DataRow dr = null;
DataTable dt = new DataTable();
dt.Columns.Add("Date", typeof(DateTime));
dt.Columns.Add("data", typeof(Int32));
dt.Columns.Add("CountryCode", typeof(string));
dr = dt.NewRow();
dr[0] = DateTime.Parse("01/01/2017");
dr[1] = 03;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("02/01/2017");
dr[1] = 09;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("03/01/2017");
dr[1] = 15;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("04/01/2017");
dr[1] = 22;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("05/01/2017");
dr[1] = 13;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("06/01/2017");
dr[1] = 22;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("07/01/2017");
dr[1] = 07;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("08/01/2017");
dr[1] = 11;
dr[2] = "GB";
dt.Rows.Add(dr);
Chart1.BorderSkin.SkinStyle = System.Windows.Forms.DataVisualization.Charting.BorderSkinStyle.Emboss;
//Chart1.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
Chart1.BorderlineColor = System.Drawing.Color.FromArgb(26, 59, 105);
Chart1.BorderlineWidth = 3;
Chart1.BackColor = Color.NavajoWhite;
Chart1.ChartAreas.Add("chtArea");
Chart1.ChartAreas[0].AxisX.Title = "Category Name";
Chart1.ChartAreas[0].AxisX.TitleFont = new System.Drawing.Font("Verdana", 11, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisY.Title = "UnitPrice";
Chart1.ChartAreas[0].AxisY.TitleFont = new System.Drawing.Font("Verdana", 11, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].BorderDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.Solid;
Chart1.ChartAreas[0].BorderWidth = 2;
Chart1.Legends.Add("UnitPrice");
Chart1.Series.Add("UnitPrice");
//Chart1.Series[0].Palette = ChartColorPalette.Bright;
Chart1.Series[0].ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Line;
Chart1.Series[0].Points.DataBindXY(dt.DefaultView, "Date", dt.DefaultView, "Data");
//Chart1.Series[0].IsVisibleInLegend = true;
Chart1.Series[0].IsValueShownAsLabel = true;
Chart1.Series[0].ToolTip = "Data Point Y Value: #VALY{G}";
// Setting Line Width
Chart1.Series[0].BorderWidth = 3;
Chart1.Series[0].Color = Color.Red;
// Setting Line Shadow
//Chart1.Series[0].ShadowOffset = 5;
//Legend Properties
Chart1.Legends[0].LegendStyle = System.Windows.Forms.DataVisualization.Charting.LegendStyle.Table;
Chart1.Legends[0].TableStyle = System.Windows.Forms.DataVisualization.Charting.LegendTableStyle.Wide;
Chart1.Legends[0].Docking = System.Windows.Forms.DataVisualization.Charting.Docking.Bottom;
Chart1.Width = 488;
Chart1.Height = 345;
}
Thanks

A Chart comes with a few default elements, like a ChartArea, a Series and a Legend.
If you want to create a ChartArea of your own, why not clear the default ChartArea first? Chart1.ChartAreas.Clear(); Then (and only then) your will actually access your newly created one with the Chart1.ChartAreas[0] references.
I also suggest to use short and nicely named references to Series, ChartAreas etc..:
ChartArea chtArea = Chart1.ChartAreas.Add("chtArea");
Series unitPrice = Chart1.Series.Add("UnitPrice");
This makes the code more compact and clearer..

issue solved. this line causing problem Chart1.ChartAreas.Add("chtArea"); so i removed this line.
my fresh code
private void show()
{
DataRow dr = null;
DataTable dt = new DataTable();
dt.Columns.Add("Date", typeof(DateTime));
dt.Columns.Add("data", typeof(Int32));
dt.Columns.Add("CountryCode", typeof(string));
dr = dt.NewRow();
dr[0] = DateTime.Parse("01/01/2017");
dr[1] = 30;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("02/01/2017");
dr[1] = 09;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("03/01/2017");
dr[1] = 15;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("04/01/2017");
dr[1] = 22;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("05/01/2017");
dr[1] = 13;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("06/01/2017");
dr[1] = 22;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("07/01/2017");
dr[1] = 07;
dr[2] = "GB";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr[0] = DateTime.Parse("08/01/2017");
dr[1] = 11;
dr[2] = "GB";
dt.Rows.Add(dr);
//Chart1.BorderSkin.SkinStyle = System.Windows.Forms.DataVisualization.Charting.BorderSkinStyle.Emboss;
////Chart1.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
//Chart1.BorderlineColor = System.Drawing.Color.FromArgb(26, 59, 105);
//Chart1.BorderlineWidth = 3;
//Chart1.BackColor = Color.NavajoWhite;
//Chart1.ChartAreas.Add("chtArea");
Chart1.ChartAreas[0].AxisX.Title = "NPS Dates";
Chart1.ChartAreas[0].AxisX.LabelStyle.Angle = -60;
Chart1.ChartAreas[0].AxisX.TitleFont = new System.Drawing.Font("Verdana", 11, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].AxisY.Title = "NPS Values";
Chart1.ChartAreas[0].AxisY.TitleFont = new System.Drawing.Font("Verdana", 11, System.Drawing.FontStyle.Bold);
Chart1.ChartAreas[0].BorderDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.Solid;
Chart1.ChartAreas[0].BorderWidth = 2;
//Chart1.Legends.Add("UnitPrice");
//Chart1.Series.Add("UnitPricexxx");
//Chart1.Series[0].Palette = ChartColorPalette.Bright;
Chart1.Series[0].ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Line;
Chart1.Series[0].Points.DataBindXY(dt.DefaultView, "Date", dt.DefaultView, "Data");
//Chart1.Series[0].IsVisibleInLegend = true;
Chart1.Series[0].IsValueShownAsLabel = true;
Chart1.Series[0].ToolTip = "Data Point Y Value: #VALY{G}";
// Setting Line Width
Chart1.Series[0].BorderWidth = 3;
Chart1.Series[0].Color = Color.Red;
// Setting Line Shadow
//Chart1.Series[0].ShadowOffset = 5;
//Legend Properties
Chart1.Legends[0].LegendStyle = System.Windows.Forms.DataVisualization.Charting.LegendStyle.Table;
Chart1.Legends[0].TableStyle = System.Windows.Forms.DataVisualization.Charting.LegendTableStyle.Wide;
Chart1.Legends[0].Docking = System.Windows.Forms.DataVisualization.Charting.Docking.Bottom;
Chart1.Width = 488;
Chart1.Height = 345;
}

How to merge two datarow cells into one?

I am trying to merge two datarow cells into one. Here is my initializing code:
DataTable dt = new DataTable();
DataColumn dc;
DataRow dr;
dc = new DataColumn();
dc.DataType = System.Type.GetType("System.String");
dc.ColumnName = "Col1";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.DataType = System.Type.GetType("System.String");
dc.ColumnName = "Col2";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.DataType = System.Type.GetType("System.String");
dc.ColumnName = "Col3";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.DataType = System.Type.GetType("System.String");
dc.ColumnName = "Col4";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.DataType = System.Type.GetType("System.String");
dc.ColumnName = "Col5";
dt.Columns.Add(dc);
This is the code I have for each column in Excel:
dr = dt.NewRow();
dr["Col1"] = "";
dr["Col2"] = "Quarter 1";
dr["Col3"] = "";
dr["Col4"] = "";
dr["Col5"] = "";
dt.Rows.Add(dr);
And it will look like this:
But I want it to look like this:
Any thoughts or ideas on how I can do this? I found it to be rather hard to merge the cells.

How to create datatable in C#?

I tried create and fill a simple DataTable
Result of this code :
Order Driver
1
1
But I want to show on same row like this :
Order Driver
1 1
Where is my wrong in this code ?
public DataTable MethodName(string Param)
{
DataRow dr;
DataTable dt= new DataTable();
dt.Columns.Add("Order", Type.GetType("System.Int32"));
dt.Columns.Add("Driver", Type.GetType("System.Int32"));
if(AnotherMethod1(Param))
{ dr = dt.NewRow();
dr["Order"] = 1;
dt.Rows.Add(dr);
}
else
{ dr = dt.NewRow();
dr["Order"] = 0;
dt.Rows.Add(dr);
}
if(AnotherMethod2(Param))
{ dr = dt.NewRow();
dr["Driver"] = 1;
dt.Rows.Add(dr);
}
else
{ dr = dt.NewRow();
dr["Driver"] = 0;
dt.Rows.Add(dr);
}
return dt;
}

You're adding a row every time you set value to a different column.
Try this:
public DataTable MethodName(string Param)
{
DataTable dt = new DataTable();
dt.Columns.Add("Order", typeof(Int32));
dt.Columns.Add("Driver", typeof(Int32));
DataRow dr = dt.NewRow();
dr["Order"] = AnotherMethod1(Param) ? 1 : 0;
dr["Driver"] = AnotherMethod2(Param) ? 1 : 0;
dt.Rows.Add(dr);
return dt;
}

public DataTable MethodName(string Param)
{
DataRow dr;
DataTable dt= new DataTable();
dt.Columns.Add("Order", Type.GetType("System.Int32"));
dt.Columns.Add("Driver", Type.GetType("System.Int32"));
dr = dt.NewRow();
if(AnotherMethod1(Param))
{
dr["Order"] = 1;
}
else
{
dr["Order"] = 0;
}
if(AnotherMethod2(Param))
{
dr["Driver"] = 1;
}
else
{
dr["Driver"] = 0;
}
dt.Rows.Add(dr);
return dt;
}

MSChart : How to add custom label in bar chart

I want to add custom label something like that ( Category 1 and Category 2 ) but not getting idea whether I need to add new series or using custom label function.. Any help would be much appreciated.
Here is my Data Table,
DataTable dt = new DataTable();
DataColumn dc;
dc = new DataColumn();
dc.ColumnName = "Question";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "Section";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User1";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User2";
dt.Columns.Add(dc);
DataRow dr;
dr = dt.NewRow();
dr["Question"] = "A";
dr["Section"] = "Category 1";
dr["User1"] = "1";
dr["User2"] = "2";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "B";
dr["Section"] = "Category 1";
dr["User1"] = "4";
dr["User2"] = "5";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "C";
dr["Section"] = "Category 1";
dr["User1"] = "2";
dr["User2"] = "5";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "X";
dr["Section"] = "Category 2";
dr["User1"] = "3";
dr["User2"] = "5";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "Y";
dr["Section"] = "Category 2";
dr["User1"] = "5";
dr["User2"] = "1";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "Z";
dr["Section"] = "Category 2";
dr["User1"] = "6";
dr["User2"] = "5";
dt.Rows.Add(dr);
My Chart plotting code,
Series Series = new Series("Series1");
Chart4.Series.Add("Series1");
Chart4.Series.Add("Series2");
Chart4.ChartAreas.Add("ChartArea1");
// Set series chart type
Chart4.Series["Series1"].ChartType = SeriesChartType.Bar;
Chart4.Series["Series2"].ChartType = SeriesChartType.Bar;
// Draw as 3D Cylinder
Chart4.Series["Series1"]["DrawingStyle"] = "Cylinder";
Chart4.Series["Series2"]["DrawingStyle"] = "Cylinder";
Chart4.DataSource = dt.DefaultView;
Chart4.ChartAreas["ChartArea1"].AxisX.Interval = 1;
Chart4.Series["Series1"].XValueMember = "Question";
Chart4.Series["Series1"].YValueMembers = "User1";
Chart4.Series["Series2"].YValueMembers = "User2";
Chart4.DataBind();
Solution
DataTable dt = new DataTable();
DataColumn dc;
dt.Columns.Add("Id", typeof(int));
dc = new DataColumn();
dc.ColumnName = "Question";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "Section";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User1";
dt.Columns.Add(dc);
DataRow dr;
dr = dt.NewRow();
dr["Question"] = "AA";
dr["Id"] = 1;
dr["Section"] = "Category1";
dr["User1"] = "6";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "BB";
dr["Id"] = 2;
dr["Section"] = "Category1";
dr["User1"] = "1";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "XX";
dr["Id"] = 3;
dr["Section"] = "Category2";
dr["User1"] = "3";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "YY";
dr["Id"] = 4;
dr["Section"] = "Category2";
dr["User1"] = "4";
dt.Rows.Add(dr);
dr = dt.NewRow();
dr["Question"] = "ZZ";
dr["Id"] = 5;
dr["Section"] = "Category2";
dr["User1"] = "2";
dt.Rows.Add(dr);
Series Series = new Series("Series1");
Chart4.Series.Add("Series1");
Chart4.ChartAreas.Add("ChartArea1");
Chart4.Series["Series1"].ChartType = SeriesChartType.Bar;
Chart4.Series["Series1"]["BarLabelStyle"] = "Center";
Chart4.Series["Series1"]["DrawingStyle"] = "Cylinder";
Chart4.Series["Series1"].XValueMember = "Question";
Chart4.Series["Series1"].YValueMembers = "User1";
Chart4.DataSource = dt;
Chart4.DataBind();
foreach (var g in dt.AsEnumerable().GroupBy(x => x.Field<string>("Section")))
{
string section = g.Key;
var questions = g.Select(r => new { Id = r.Field<int>("Id"), Question = r.Field<string>("Question") });
int min = questions.Min(y => y.Id);
int max = questions.Max(y => y.Id);
var sectionlabel=new CustomLabel();
if (min == max)
{
sectionlabel = new CustomLabel(min - 0.5, max + 0.5, section, 1, LabelMarkStyle.LineSideMark);
}
else
{
sectionlabel = new CustomLabel(min, max, section, 1, LabelMarkStyle.LineSideMark);
}
Chart4.ChartAreas[0].AxisX.CustomLabels.Add(sectionlabel);
}
Chart4.ChartAreas["ChartArea1"].AxisX.Interval = 1;

Have you tried this? It will create a group label for items 1-3.
Chart4.ChartAreas["ChartArea1"].AxisX.CustomLabels.Add(1, 3, "Category 1", 1, LabelMarkStyle.LineSideMark);

The easiest way is to just add Annotations to your chart
TextAnnotation text = new TextAnnotation();
text.Text = 'Category 1';
text.X = 20;
text.Y = 20;
Chart4.Annotations.Add(text);
You can also draw the line using a LineAnnotation
http://msdn.microsoft.com/en-us/library/dd456725.aspx

How to arrange datatable using C#

I am building datatable dynamically and the format is like following,
DataTable dt = new DataTable();
DataColumn dc;
dc = new DataColumn();
dc.ColumnName = "Question";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User1";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User2";
dt.Columns.Add(dc);
dr["Question"] = "2D";
dr["User1"] = "1";
dr["Question"] = "3D";
dr["User1"] = "4";
dr["Question"] = "2D";
dr["User2"] = "2";
dr["Question"] = "3D";
dr["User2"] = "5";
How can I arrange is it like following,
DataTable dt = new DataTable();
DataColumn dc;
dc = new DataColumn();
dc.ColumnName = "Question";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User1";
dt.Columns.Add(dc);
dc = new DataColumn();
dc.ColumnName = "User2";
dt.Columns.Add(dc);
dr["Question"] = "2D";
dr["User1"] = "1";
dr["User2"] = "2";
dr["Question"] = "3D";
dr["User1"] = "4";
dr["User2"] = "5";

You can make linq cross join and filter it to list (you can bind list to your msChart)
var result = (from dr1 in dt.Select()
join dr2 in dt.Select() on dr1["Question"].ToString() equals dr2["Question"].ToString()
select new { q = dr1["question"], u1 = dr1["User1"], u2 = dr2["User2"] }
).Where(row => row.u1.ToString().Length > 0 && row.u2.ToString().Length > 0).ToList();

You could use code similar to this;
DataRow dr = dt.NewRow();
dr["Question"] = "2D";
dr["User1"] = "1";
dr["User2"] = "2";
dr = dt.NewRow();
dr["Question"] = "3D";
dr["User1"] = "4";
dr["User2"] = "5";

Supposing that dr is a variable of type DataRow obtained calling the DataTable method NewRow, then you can add the values to the row ItemArray property in just one line.
Of course you need to be absolutely sure of your columns order and type
DataRow dr = dt.NewRow();
dr.ItemArray = new object[] {"Q1", "1", "2"};
dt.Rows.Add(dr);
dr = dt.NewRow();
dr.ItemArray = new object[] {"Q2", "3", "4"};
dt.Rows.Add(dr);