Develop Reference

Divide data into datagridview C#

I have a query that reurns me a result of 3500 rows. Each row is a 15 minute time record period of a day:
DATE VALUE
--------------------|-------
1 |2016-10-21 10:00:00| 0
2 |2016-10-21 10:15:00| 0
3 |2016-10-21 10:30:00| 6
4 |2016-10-21 10:45:00| 9
5 |2016-10-21 11:00:00| 18
6 |2016-10-21 11:15:00| 15
.
.
.
3500|2016-11-30 00:15:00| 0
I want to insert this query in a c# datagridview but i dont want an unique column, i want a column for each day.For example, in this query i get 40 day result, and i want a datagridview with a column for each day.
¿Anyone knows which is the fastest way to do this?

Something like that :
var query = new[] { new { Date = new DateTime(2016,10,21,10,0,0), Value = 6 },
new { Date = new DateTime(2016,10,21,10,15,0), Value = 9 },
new { Date = new DateTime(2016,10,30,10,0,0), Value = 18 }};
var groupedQuery = query.GroupBy(p => p.Date.Date, p => p.Value, (key, g) => new { Date = key, Value = g.Sum() });
var grid = new DataGridView();
var bs = new BindingSource();
bs.DataSource = groupedQuery;
grid.AutoGenerateColumns = false;
grid.DataSource = bs;
foreach (var item in groupedQuery)
{
DataGridViewColumn column = new DataGridViewColumn { HeaderText = item.Date.Date.ToString() };
grid.Columns.Add(column);
}

MS Chart X Axis label repeated - showing multiple points for a single item [Range Bar]

I have created a RangeBar MS Chart control that binds with a datatable. This datatable is created based on the below list data.
The problem is that x axis is showing multiple points for same item with different range.
List
MS Chart
X axis represents the 1st column of the list and Y axis values are 3rd and 4th columns. "dt" is the datatable name
Code
chChart.Series["Series1"].ChartType = SeriesChartType.RangeBar;
chChart.Series["Series1"].Points.DataBind(dt.DefaultView, "Number", "Start Time,Stop Time","ToolTip=Name,Label=Name");
Tried binding as different series but still not working.
var IETable = (dt as System.ComponentModel.IListSource).GetList();
chChart.DataBindCrossTable(IETable, "Number", "Number", "Start Time,Stop Time","");
foreach (Series sr in chChart.Series)
{
sr.ChartType = SeriesChartType.RangeBar;
sr.YValueType = ChartValueType.Time;
sr.XValueType = ChartValueType.String;
}
Is there a way to group x axis value for same item so that the bars are in same line?
Note - When using custom labels, only one value is shown for each x axis label.

Add 1 Series into the chart. Then for the Series, make sure YValuesPerPoint = 2.
Add new DataPoints so that the XValue represents the line (in the example for line ABC1, XValue = 1 and line ABC2, XValue = 2. For the DataPoint.AxisLabel you can set the label of that axis (in this case 'ABC1' and 'ABC2'). Then for the YValues, you specify values comma separated, for example 1,2 or 7,20.
Example:
chChart.Series["Series1"].Points.Add(new DataPoint() { AxisLabel = "ABC1", XValue = 1, YValues = new double[] { 2,5 } });
chChart.Series["Series1"].Points.Add(new DataPoint() { AxisLabel = "ABC1", XValue = 1, YValues = new double[] { 6,7 } });
chChart.Series["Series1"].Points.Add(new DataPoint() { AxisLabel = "ABC1", XValue = 1, YValues = new double[] { 9,10 } });
chChart.Series["Series1"].Points.Add(new DataPoint() { AxisLabel = "ABC2", XValue = 2, YValues = new double[] { 3,6 } });
chChart.Series["Series1"].Points.Add(new DataPoint() { AxisLabel = "ABC2", XValue = 2, YValues = new double[] { 7,8 } });
So the key is that the XValue must be same (double?) for all the bars on same line.

Manipulating datapoints individually for each series did the trick. Based on the index of the custom label, i modified the Xvalue of the datapoint. "vn" is a string array that has custom label names.
var IETable = (dt as System.ComponentModel.IListSource).GetList();
chChart.DataBindCrossTable(IETable, "Number","","Start Time,StopTime","");
foreach (Series sr in chChart.Series)
{
sr.ChartType = SeriesChartType.RangeBar;
sr.XValueType = ChartValueType.String;
foreach (DataPoint p in sr.Points)
{
int dpIndex=0;
// foreach unique x axis value, increment dpIndex
//ToDoCode
//aligning the datapoint's X axis value in the middle
p.XValue = dpIndex + 0.5;
}
}

How to create area range chart

I want to create area range chart as given in the following link
I want to add data to ranges using loop on my data. What should be the type of the ranges to create chart?
Please suggest. Thanks in advance. Here's the JSFiddle code:
HTML:
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JS:
$(function () {
var ranges = [[1246406400000,33,22],[1246492800000,24,12],[1246579200000,15,1],[1246665600000,28,17],[1246752000000,22,12],[1246838400000,34,22],[1246924800000,30,19],[1247011200000,27,15],[1247097600000,35,24],[1247184000000,29,14],[1247270400000,32,20],[1247356800000,32,21],[1247443200000,34,23],[1247529600000,19,9],[1247616000000,31,21],[1247702400000,22,7],[1247788800000,25,11],[1247875200000,19,6],[1247961600000,33,18],[1248048000000,33,18],[1248134400000,21,7],[1248220800000,31,19],[1248307200000,25,15],[1248393600000,29,19],[1248480000000,34,23],[1248566400000,21,9],[1248652800000,27,12],[1248739200000,19,4],[1248825600000,32,19],[1248912000000,32,20],[1248998400000,16,1]], ranges2 = [[1246406400000,22,-22],[1246492800000,12,-12],[1246579200000,1,-1],[1246665600000,17,-17],[1246752000000,12,-12],[1246838400000,22,-22],[1246924800000,19,-19],[1247011200000,15,-15],[1247097600000,24,-24],[1247184000000,14,-14],[1247270400000,20,-20],[1247356800000,21,-21],[1247443200000,23,-23],[1247529600000,9,-9],[1247616000000,21,-21],[1247702400000,7,-7],[1247788800000,11,-11],[1247875200000,6,-6],[1247961600000,18,-18],[1248048000000,18,-18],[1248134400000,7,-7],[1248220800000,19,-19],[1248307200000,15,-15],[1248393600000,19,-19],[1248480000000,23,-23],[1248566400000,9,-9],[1248652800000,12,-12],[1248739200000,4,-4],[1248825600000,19,-19],[1248912000000,20,-20],[1248998400000,1,-1]], ranges3 = [[1246406400000,-22,-45],[1246492800000,-12,-30],[1246579200000,-1,-17],[1246665600000,-17,-43],[1246752000000,-12,-40],[1246838400000,-22,-45],[1246924800000,-19,-43],[1247011200000,-15,-45],[1247097600000,-24,-50],[1247184000000,-14,-37],[1247270400000,-20,-44],[1247356800000,-21,-42],[1247443200000,-23,-42],[1247529600000,-9,-37],[1247616000000,-21,-40],[1247702400000,-7,-24],[1247788800000,-11,-27],[1247875200000,-6,-27],[1247961600000,-18,-34],[1248048000000,-18,-46],[1248134400000,-7,-36],[1248220800000,-19,-48],[1248307200000,-15,-30],[1248393600000,-19,-49],[1248480000000,-23,-50],[1248566400000,-9,-38],[1248652800000,-12,-27],[1248739200000,-4,-26],[1248825600000,-19,-45],[1248912000000,-20,-40],[1248998400000,-1,-17]];
$('#container').highcharts({
title: {
text: 'Sentiment Flood Map'
},
xAxis: {
type: 'datetime'
},
yAxis: {
title: {
text: null
}
},
tooltip: {
crosshairs: true,
shared: true,
valueSuffix: ''
},
legend: {
},
series: [ {
name: 'Positive',
data: ranges,
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[2],
fillOpacity: 0.8,
zIndex: 0
}
, {
name: 'Neutral',
data: ranges2,
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[1],
fillOpacity: 0.8,
zIndex: 0
}
, {
name: 'Negative',
data: ranges3,
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[3],
fillOpacity: 0.8,
zIndex: 0
}
]
});
});

Here is an example the produces a Chart graphic just like the one in the linked image.
Note: After I have created a few testdata I calculate a dummy series with a transparent color that will make the whole data stack up so that the median of the "neutral" series sits nicely on one horizontal line.
int numPoints = 30; // create some test data
List<int> neutralData = new List<int>();
List<int> negativeData = new List<int>();
List<int> positiveData = new List<int>();
List<int> dummyData = new List<int>();
for (int i = 0; i < numPoints; i++)
{
// the real data series, using a Random R:
positiveData.Add(R.Next(i + 22));
neutralData .Add(R.Next(i + 33));
negativeData.Add(R.Next(i + 44));
// calculate the transparent bottom series:
dummyData.Add( - neutralData[i] / 2 - negativeData[i]);
}
// set up the Chart:
chart1.ChartAreas.Add("StackedArea"); // if necessary
Series s0 = chart1.Series.Add(" ");
Series s1 = chart1.Series.Add("negative");
Series s2 = chart1.Series.Add("neutral");
Series s3 = chart1.Series.Add("positive");
foreach (Series s in chart1.Series) s.ChartType = SeriesChartType.StackedArea;
s0.Color = Color.Transparent;
s1.Color = Color.FromArgb(200, Color.Red);
s2.Color = Color.FromArgb(200, Color.LightSlateGray);
s3.Color = Color.FromArgb(200, Color.Green)
// now add the data points:
for (int i = 0; i < numPoints; i++)
{
s0.Points.AddXY(i, dummyData[i]);
s1.Points.AddXY(i, negativeData[i] );
s2.Points.AddXY(i, neutralData [i]);
s3.Points.AddXY(i, positiveData[i]);
}
If you want to show a tooltip similar to the one from your example you can add this to the AddXY loop:
int a2 = dummyData[i] + negativeData[i];
int a3 = a2 + neutralData[i];
int a4 = a3 + positiveData[i];
string tt = string.Format( "Data Point {0}\r\nPositive: {1} - {2}\r\n"
+ "Neutral: {2} - {3}\r\nNegative: {3} - {4}", i, a4, a3, a2, dummyData[i]);
s1.Points[i].ToolTip = tt;
s2.Points[i].ToolTip = tt;
s3.Points[i].ToolTip = tt;
Here is an example image:

You can not create a chart exactly like the one shown in link but you can use different series on your chart. I am posting the code that creates a chart and populates it with 2 series, you can add as many series as you want.
DataSet dataSet;
ConnectionClass.GetInstance().connection_string = Properties.Settings.Default.MindMuscleConnectionString;
ConnectionClass.GetInstance().Sql = "Select Count(MemberInfo.memberName) as 'Members', CompetitionName as 'Competition' FROM MemberInfo, MemberBodyInfo, Competition WHERE MemberInfo.memberID = MemberBodyInfo.memberID AND MemberBodyInfo.weight >= Competition.CompetitionCategory and MemberBodyInfo.weight <= Competition.CompetitionCategory + 5 group by CompetitionName;";
dataSet = ConnectionClass.GetInstance().GetConnection;
chart1.Series["Series1"].Name = "Members";
chart1.Series["Members"].YValueMembers = "Members";
chart1.Series["Members"].XValueMember = "Competition";
chart1.Series.Add("Members2");
chart1.Series["Members2"].ChartType = SeriesChartType.StackedArea;
chart1.Series["Members2"].IsValueShownAsLabel = true;
chart1.Series["Members2"].YValueMembers = "Members";
chart1.Series["Members2"].XValueMember = "Competition";
this.chart1.Titles.Add("Competition Participants"); // Set the chart title
chart1.Series["Members"].ChartType = SeriesChartType.StackedArea;
chart1.Series["Members"].IsValueShownAsLabel = true; // To show chart value
chart1.DataSource = dataSet;
chart1.DataBind();
I have not actually created a new series from some different data... Both series are same here but I have just showed you an example.

Asp.Net chart with multiple series and multiple values on the y axis

I have a datatable that looks like this:
Data Value 1 Value 2 Value 3
series1 32 -2 46
series2 -62 99
series3 19 23 98
On the chart I will need it to look like this:
32 -2 46 -62 99 19 23 98
series1 series2 series3
and the legend : value 1, value 2, value 3
the codes I have tried:
private void LoadChartCurrencyTotal(DataTable initialDataSource)
{
DataTable pivotedDt = Pivot(initialDataSource);
chart1.DataSource = pivotedDt;
foreach (DataRow dr in pivotedDt.Rows)
{
Series series = new Series(dr["Data"].ToString());
List<string> colNames = (from DataColumn col in pivotedDt.Columns where col.ColumnName != "Data" select col.ColumnName).ToList();
series.XValueMember = "Data";
series.YValueMembers = string.Join(",", colNames);
chart1.Series.Add(series);
}
chart1.DataBind();
FormatChart(chart1);
}
this returns Data points insertion error. Only 1 Y values can be set for this data series. because of the joined column names.
Also tried:
private void LoadChartCurrencyTotal(DataTable initialDataSource)
{
DataTable pivotedDt = Pivot(initialDataSource);
foreach (DataRow pivotDr in pivotedDt.Rows)
{
Series serie = new Series(pivotDr["Data"].ToString());
List<decimal?> colValues = new List<decimal?>();
foreach (DataColumn col in pivotedDt.Columns)
{
if (col.ColumnName != "Data")
{
//colValues.Add(pivotDr[col.ColumnName] != DBNull.Value
// ? decimal.Parse(pivotDr[col.ColumnName].ToString())
// : new decimal?());
decimal? colValue = pivotDr[col.ColumnName] != DBNull.Value
? decimal.Parse(pivotDr[col.ColumnName].ToString())
: new decimal?();
serie.Points.AddXY(pivotDr["Data"], colValue);
}
}
//serie.Points.AddXY(pivotDr["Data"], string.Join(",", colValues));
chart1.Series.Add(serie);
}
FormatChart(chart1);
}
This compiles but the result is completly messed up: The legend sais series1, series2, series3 and the result is:
32 -62 19 -2 23 46 99 98
series1 series2 series3
I get the results per column not per row.
And the last I have tried is:
DataView pivotedDv = pivotedDt.AsDataView();
chart1.DataBindTable(pivotedDv, pivotedDt.Columns[0].ColumnName);
but this only returns:
0.00 0.00 0.00
series1 series2 series3
and the legend: 0.00
Hope someone has a clue how this should be acomplished. but please, no drag and drop and click solutions, but code.
Thanks

I think I have got this working how you like using the following code. Hope this helps:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
DataTable dt = GetTestData();
LoadChartCurrencyTotal(dt);
}
}
private void LoadChartCurrencyTotal(DataTable initialDataSource)
{
for (int i = 1; i < initialDataSource.Columns.Count; i++)
{
Series series = new Series();
foreach (DataRow dr in initialDataSource.Rows)
{
int y = (int)dr[i];
series.Points.AddXY(dr["Data"].ToString(), y);
}
Chart1.Series.Add(series);
}
}
private DataTable GetTestData()
{
DataTable dt = new DataTable();
dt.Columns.Add("Data", Type.GetType("System.String"));
dt.Columns.Add("Value1", Type.GetType("System.Int32"));
dt.Columns.Add("Value2", Type.GetType("System.Int32"));
dt.Columns.Add("Value3", Type.GetType("System.Int32"));
DataRow dr1 = dt.NewRow();
dr1["Data"] = "series1";
dr1["Value1"] = 32;
dr1["Value2"] = -2;
dr1["Value3"] = 46;
dt.Rows.Add(dr1);
DataRow dr2 = dt.NewRow();
dr2["Data"] = "series2";
dr2["Value1"] = -62;
dr2["Value2"] = 0;
dr2["Value3"] = 99;
dt.Rows.Add(dr2);
DataRow dr3 = dt.NewRow();
dr3["Data"] = "series3";
dr3["Value1"] = 19;
dr3["Value2"] = 23;
dr3["Value3"] = 98;
dt.Rows.Add(dr3);
return dt;
}

piechart using devexpress, pass values from variables

I'm using DevExpress for WinForms (the free one) and I'm using a 3D pie chart.
I already have a chart using the Windows version and all I do is pass four variables as the values the chart needs in the series.
Here's the code I use currently.
double[] yValues = { bottom, bmid, tmid, top};
string[] xNames = { "Greater than 200", "Between 200-100", "Between 100-50", "Below 50" };
chart1.Series[0].Points.DataBindXY(xNames, yValues);
Now, I've made a DevExpress chart and tried to use:
Devchart1.series[0].points
but points.databind does not exist.
Does anyone know how I bind the data like I have using WinForms?
UPDATE
Here's some more things I tried (commented out).
double[] yValues = { bottom, bmid, tmid, top};
string[] xNames = { "Greater than 200", "Between 200-100", "Between 100-50", "Below 50" };
chart1.Series[0].Points.DataBindXY(xNames, yValues);
DataTable chartTable = new DataTable("Table1");
// Add two columns to the table.
chartTable.Columns.Add("Names", typeof(string));
chartTable.Columns.Add("Value", typeof(Int32));
chartTable.Rows.Add("Below 50", top);
chartTable.Rows.Add("Between 50-100", tmid);
chartTable.Rows.Add("Between 100-200", bmid);
chartTable.Rows.Add("Greater than 200", top);
Series series1 = new Series("Series1", ViewType.Pie3D);
chartControl2.Series.Add(series1);
series1.DataSource = chartTable;
series1.ArgumentScaleType = ScaleType.Qualitative;
series1.ArgumentDataMember = "names";
series1.ValueScaleType = ScaleType.Numerical;
series1.ValueDataMembers.AddRange(new string[] { "Value" });
//((Pie3DSeriesView)series1.View). = true;
//((pie)chartControl2.Diagram).AxisY.Visible = false;
chartControl2.Legend.Visible = false;
// Dock the chart into its parent and add it to the current form.
chart1.Dock = DockStyle.Fill;
::UPDATE2::
heres what happens with this code with values 101, 22, 20 and 15.

DevExpress Series has DataSource property for binding.
Check this article. Hope it helps
UPDATE:
I use your code and it seems to work fine
DataTable chartTable = new DataTable("Table1");
// Add two columns to the table.
chartTable.Columns.Add("Names", typeof(string));
chartTable.Columns.Add("Value", typeof(Int32));
chartTable.Rows.Add("Below 50", 10);
chartTable.Rows.Add("Between 50-100", 10);
chartTable.Rows.Add("Between 100-200", 10);
chartTable.Rows.Add("Greater than 200", 10);
Series series1 = new Series("Series1", ViewType.Pie3D);
//chartControl1.Series.Clear();
chartControl2.Series.Add(series1);
series1.DataSource = chartTable;
series1.ArgumentScaleType = ScaleType.Qualitative;
series1.ArgumentDataMember = "names";
series1.ValueScaleType = ScaleType.Numerical;
series1.ValueDataMembers.AddRange(new string[] { "Value" });
//((Pie3DSeriesView)series1.View). = true;
//((pie)chartControl2.Diagram).AxisY.Visible = false;
chartControl2.Legend.Visible = false;