I am struggling (I am a beginner in C#) to: 1 put some space between the columns, define a size for the Y axis and display Ancillary in the label. I post my code, any help is largely appreciate.
Overall.SelectCommand = ToChart1;
Overall.Fill(ds, "TblChart1");
chart1.DataSource = ds.Tables["TblChart1"];
chart1.Series.Add("Series2");
chart1.Series.Add("Series3");
//chart1.Series["Series1"].XValueMember = "Ancillary";
chart1.Series["Series1"].YValueMembers = "Ancillary";
//chart1.Series["Series2"].XValueMember = "NonCommodity";
chart1.Series["Series2"].YValueMembers = "NonCommodity";
//chart1.Series["Series3"].XValueMember = "Totale";
chart1.Series["Series3"].YValueMembers = "Totale";
chart1.DataBind();
chart1.ChartAreas[0].AxisX.LabelStyle.Font = new Font("Calibri", 5);
chart1.ChartAreas[0].AxisX.Interval = 1;
//chart1.ChartAreas[0].AxisY.Maximum = 800000;
chart1.ChartAreas[0].AxisY.Minimum = 0;
chart1.Series[0].LegendText = "Ancillary";
chart1.Series[1].LegendText = "NonCommodity";
chart1.Series[2].LegendText = "Total";
I have a robot that outputs x,y,z position in space. My problem is that I can only find 2D plot in windows forms using chart.
I want to plot my robot in 3D space. Any tools I can use??
Something similar to this:
I need a free software solution for this
EDIT:
My 2D graph atm:
chart1.ChartAreas[0].AxisX.Minimum = 0;
chart1.ChartAreas[0].AxisX.Maximum = 12;
chart1.ChartAreas[0].AxisX.Interval = 1;
chart1.ChartAreas[0].AxisY.Minimum = 0;
chart1.ChartAreas[0].AxisY.Maximum = 7;
chart1.ChartAreas[0].AxisY.Interval = 1;
//example
posicao_atual_master.X = 10;
posicao_atual_master.Y = 5;
chart1.Series[0].Points.Clear();
chart1.Series[0].Points.AddXY(posicao_atual_master.X, posicao_atual_master.Y);
DESIGNER:
// chart1
//
chartArea1.AxisX.MajorGrid.Enabled = false;
chartArea1.AxisX.MajorTickMark.Enabled = false;
chartArea1.AxisY.MajorGrid.Enabled = false;
chartArea1.AxisY.MajorTickMark.Enabled = false;
chartArea1.Name = "ChartArea1";
chartArea1.Position.Auto = false;
chartArea1.Position.Height = 100F;
chartArea1.Position.Width = 90F;
this.chart1.ChartAreas.Add(chartArea1);
legend1.BackColor = System.Drawing.Color.Transparent;
legend1.BorderColor = System.Drawing.Color.Transparent;
legend1.Font = new System.Drawing.Font("Microsoft Sans Serif", 4F, System.Drawing.FontStyle.Bold, System.Drawing.GraphicsUnit.Millimeter, ((byte)(1)), true);
legend1.IsTextAutoFit = false;
legend1.Name = "legen";
legend1.TableStyle = System.Windows.Forms.DataVisualization.Charting.LegendTableStyle.Tall;
this.chart1.Legends.Add(legend1);
this.chart1.Location = new System.Drawing.Point(543, 49);
this.chart1.Name = "chart1";
series1.ChartArea = "ChartArea1";
series1.ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Point;
series1.Color = System.Drawing.Color.Transparent;
series1.Legend = "legen";
series1.MarkerBorderColor = System.Drawing.Color.Black;
series1.MarkerImage = "C:\\Users\\Tiago\\Desktop\\CODIGO_TESE_FINAL_BACKUP1408_BOM\\C# - AR.Drone SDK\\AR.Dron" +
"e\\icone_drone_verde.png";
series1.MarkerImageTransparentColor = System.Drawing.Color.Red;
series1.Name = "Master";
series2.ChartArea = "ChartArea1";
series2.ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Point;
series2.Legend = "legen";
series2.MarkerImage = "C:\\Users\\Tiago\\Desktop\\CODIGO_TESE_FINAL_BACKUP1408_BOM\\Fotos dos Relatórios\\icon" +
"e_drone_vermelho.png";
series2.Name = "Slave";
this.chart1.Series.Add(series1);
this.chart1.Series.Add(series2);
this.chart1.Size = new System.Drawing.Size(1159, 359);
this.chart1.TabIndex = 7;
this.chart1.Text = "chart1";
this.chart1.MouseDown += new System.Windows.Forms.MouseEventHandler(this.chart1_MouseDown);
this.chart1.MouseMove += new System.Windows.Forms.MouseEventHandler(this.chart1_MouseMove);
this.chart1.MouseUp += new System.Windows.Forms.MouseEventHandler(this.chart1_MouseUp);
EDIT: IMAGE
You are correct, there is no proper way to use a real z-axis in the Chart control.
It does have a 3D style though, which can be used for a reasonably nice ChartArea.
You will have to do the painting of the graph in code though, as the built-in z-axis only support as many, or rather as few discret values as you have Series in the chart.
This is ok for some things, like a color cube, but when you need arbitryry data values it just won't do.
Instead you can do this:
Store the z-value of each DataPoint along with the Y-value in the YValues array.
For this you need a ChartType that supports several YValues
Code one of the xxxPaint events to draw the graphics
For this you need a conversion from values to pixels
First we prepare the chart. Many details are up to your needs;
void prepare3dChart(Chart chart, ChartArea ca)
{
ca.Area3DStyle.Enable3D = true; // set the chartarea to 3D!
ca.AxisX.Minimum = -250;
ca.AxisY.Minimum = -250;
ca.AxisX.Maximum = 250;
ca.AxisY.Maximum = 250;
ca.AxisX.Interval = 50;
ca.AxisY.Interval = 50;
ca.AxisX.Title = "X-Achse";
ca.AxisY.Title = "Y-Achse";
ca.AxisX.MajorGrid.Interval = 250;
ca.AxisY.MajorGrid.Interval = 250;
ca.AxisX.MinorGrid.Enabled = true;
ca.AxisY.MinorGrid.Enabled = true;
ca.AxisX.MinorGrid.Interval = 50;
ca.AxisY.MinorGrid.Interval = 50;
ca.AxisX.MinorGrid.LineColor = Color.LightSlateGray;
ca.AxisY.MinorGrid.LineColor = Color.LightSlateGray;
// we add two series:
chart.Series.Clear();
for (int i = 0; i < 2; i++)
{
Series s = chart.Series.Add("S" + i.ToString("00"));
s.ChartType = SeriesChartType.Bubble; // this ChartType has a YValue array
s.MarkerStyle = MarkerStyle.Circle;
s["PixelPointWidth"] = "100";
s["PixelPointGapDepth"] = "1";
}
chart.ApplyPaletteColors();
addTestData(chart);
}
Here we add some test data:
void addTestData(Chart chart)
{
Random rnd = new Random(9);
for (int i = 0; i < 100; i++)
{
double x = Math.Cos(i/10f )*88 + rnd.Next(5);
double y = Math.Sin(i/11f)*88 + rnd.Next(5);
double z = Math.Sqrt(i*2f)*88 + rnd.Next(5);
AddXY3d( chart.Series[0], x, y, z);
AddXY3d( chart.Series[1], x-111, y-222, z);
}
}
The DataPoints are added with this routine:
int AddXY3d(Series s, double xVal, double yVal, double zVal)
{
int p = s.Points.AddXY(xVal, yVal, zVal);
// the DataPoint are transparent to the regular chart drawing:
s.Points[p].Color = Color.Transparent;
return p;
}
If this Paint event we draw the data as we like it. Here are either Lines or Points:
private void chart1_PostPaint(object sender, ChartPaintEventArgs e)
{
Chart chart = sender as Chart;
if (chart .Series.Count < 1) return;
if (chart .Series[0].Points.Count < 1) return;
ChartArea ca = chart .ChartAreas[0];
e.ChartGraphics.Graphics.SmoothingMode = SmoothingMode.AntiAlias;
List<List<PointF>> data = new List<List<PointF>>();
foreach (Series s in chart .Series)
data.Add(GetPointsFrom3D(ca, s, s.Points.ToList(), e.ChartGraphics));
renderLines(data, e.ChartGraphics.Graphics, chart , true); // pick one!
renderPoints(data, e.ChartGraphics.Graphics, chart , 6); // pick one!
}
The coodinates are calculated using axis methods:
List<PointF> GetPointsFrom3D(ChartArea ca, Series s,
List<DataPoint> dPoints, ChartGraphics cg)
{
var p3t = dPoints.Select(x => new Point3D((float)ca.AxisX.ValueToPosition(x.XValue),
(float)ca.AxisY.ValueToPosition(x.YValues[0]),
(float)ca.AxisY.ValueToPosition(x.YValues[1]))).ToArray();
ca.TransformPoints(p3t.ToArray());
return p3t.Select(x => cg.GetAbsolutePoint(new PointF(x.X, x.Y))).ToList();
}
The actual drawing happens in these routines; one draws lines the other dots:
void renderLines(List<List<PointF>> data, Graphics graphics, Chart chart, bool curves)
{
for (int i = 0; i < chart.Series.Count; i++)
{
if (data[i].Count > 1)
using (Pen pen = new Pen(Color.FromArgb(64, chart.Series[i].Color), 2.5f))
if (curves) graphics.DrawCurve(pen, data[i].ToArray());
else graphics.DrawLines(pen, data[i].ToArray());
}
}
void renderPoints(List<List<PointF>> data, Graphics graphics, Chart chart, float width)
{
for (int s = 0; s < chart.Series.Count; s++)
{
Series S = chart.Series[s];
for (int p = 0; p < S.Points.Count; p++)
using (SolidBrush brush = new SolidBrush(Color.FromArgb(64, S.Color)))
graphics.FillEllipse(brush, data[s][p].X-width/2,
data[s][p].Y-width/2,width, width);
}
}
Other drawing routines like meshes or areas can be coded just as well.. Simply add new routines using user GDI+ methods like DrawCurve or FillPolygon or maybe even DrawImage..
You can set the ChartArea.Area3DStyle.Rotation and the ChartArea.Area3DStyle.Inclination for different views, as can be seen in the animation.
Edit I have update the PostPaint method to minimze dependencies.
In my project im having a point chart .For each and every 1 second time interval im updating the values in the points chart that's works fine.But while updating the values it is automatically splitting 4 values on x axis like 1,2,3,4 (1,2,3,4 are x axis values).But i want 10 fixed values to be plot on x axis.How to do it?
Please refer my code below ,
series.Name = "Series";
series.Color = System.Drawing.Color.Green;
series.IsVisibleInLegend = false;
series.IsXValueIndexed = true;
series.YAxisType=AxisType.Primary;
series.ChartType = SeriesChartType.Point;
this.chart.Series.Add(series);
chart.ChartAreas[0].AxisX.MajorGrid.LineWidth = 0;
chart.ChartAreas[0].AxisY.MajorGrid.LineWidth = 0;
chart.ChartAreas[0].AxisY2.MajorGrid.LineWidth = 0;
chart.ChartAreas[0].AxisX.Title = "X Axis value";
chart.ChartAreas[0].AxisY.Title = "Y Axis value1";
chart.ChartAreas[0].AxisY2.Title = "Y Axis value2";
chart.ChartAreas[0].AxisX.ScrollBar.Size = 15;
chart.ChartAreas[0].AxisX.ScrollBar.ButtonStyle = ScrollBarButtonStyles.All;
chart.ChartAreas[0].AxisX.ScrollBar.IsPositionedInside = false;
chart.ChartAreas[0].AxisX.ScrollBar.Enabled = true;
chart.ChartAreas[0].AxisX.ScaleView.Zoom(2,3);
chart.ChartAreas[0].CursorX.IsUserEnabled = true;
chart.ChartAreas[0].CursorY.IsUserEnabled = true;
chart.ChartAreas[0].AxisX.ScaleView.Zoomable = true;
chart.ChartAreas[0].AxisY.ScaleView.Zoomable = true;
chart.ChartAreas[0].AxisY2.ScaleView.Zoomable = true;
chart.ChartAreas[0].CursorX.IsUserSelectionEnabled = true;
chart.ChartAreas[0].CursorY.IsUserSelectionEnabled = true;
I am assuming you want your x axis shows 0-10 range:
Try add follow code：
chart.ChartAreas[0].AxisX.Maximum = 10;
chart.ChartAreas[0].AxisX.Minimum = 0;
If you use horizontal scroll bar for your chart,use the following code to display 10 intervals on x-axis.
chart.ChartAreas[0].AxisX.ScaleView.Zoom(2, 9);
When I scroll horizontally a zoomed mschart I see an ugly chart area flicker (right border), caused by unwanted change of its width (this is due to variable scaling of the chart during horizontal scrolling).
Any ideas how to improve that?
Code example:
DateTime zeroTime = new DateTime(1, 1, 1, 0, 0, 0);
int k = 0;
chart1.Series[0].ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Line;
chart1.Dock = DockStyle.Fill;
chart1.BackColor = Color.Salmon;
this.chart1.ChartAreas["ChartArea1"].CursorX.IsUserEnabled = true;
this.chart1.ChartAreas["ChartArea1"].CursorY.IsUserEnabled = true;
this.chart1.ChartAreas["ChartArea1"].CursorX.IsUserSelectionEnabled = true;
this.chart1.ChartAreas["ChartArea1"].CursorY.IsUserSelectionEnabled = true;
this.chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.Zoomable = true;
this.chart1.ChartAreas["ChartArea1"].AxisY.ScaleView.Zoomable = true;
this.chart1.ChartAreas["ChartArea1"].AxisX.ScrollBar.IsPositionedInside = true;
this.chart1.ChartAreas["ChartArea1"].AxisY.ScrollBar.IsPositionedInside = true;
this.chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.SmallScrollMinSizeType =DateTimeIntervalType.Seconds;
this.chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.SmallScrollSizeType = DateTimeIntervalType.Seconds;
chart1.ChartAreas["ChartArea1"].CursorY.Interval = 0.1;
chart1.ChartAreas["ChartArea1"].CursorX.Interval = 5.0;
chart1.ChartAreas["ChartArea1"].AxisX.LabelStyle.Format = "HH:mm:ss";
chart1.ChartAreas["ChartArea1"].CursorX.IntervalType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Seconds;
for (int i = 0; i < 600; i++)
{if (i < 200 ){k=i/10;} else if(i<400){k=20;}else{k=(600-i)/10;}; chart1.Series[0].Points.AddXY(zeroTime.AddSeconds(i * 5), 0 - k);}
The resizing of the chart can be influenced by the InnerPlotPosition property of the chart area. The default here is InnerPlotPosition.Auto set to true and this leads to the width change.
The chart width change can be stopped by switching to manual mode:
this.chart1.ChartAreas["ChartArea1"].InnerPlotPosition.Auto = false;
// optional:
this.chart1.ChartAreas["ChartArea1"].InnerPlotPosition.X = 0; // all values are percentage
this.chart1.ChartAreas["ChartArea1"].InnerPlotPosition.Y = 0;
this.chart1.ChartAreas["ChartArea1"].InnerPlotPosition.Height = 100;
this.chart1.ChartAreas["ChartArea1"].InnerPlotPosition.Width = 100;
int blockSize = 100;
// generates random data (i.e. 30 * blockSize random numbers)
Random rand = new Random();
var valuesArray = Enumerable.Range(0, blockSize * 30).Select(x => rand.Next(1, 10)).ToArray();
// clear the chart
chart1.Series.Clear();
//chart1.ChartAreas[0].AxisX.Interval = 3.0;
//chart1.ChartAreas[0].AxisX.IntervalType = DateTimeIntervalType.Auto;
DateTime now = DateTime.Now;
chart1.ChartAreas[0].AxisX.LabelStyle.Format = "HH:mm:ss";
chart1.ChartAreas[0].AxisX.Minimum = now.ToOADate();
// fill the chart
var series = chart1.Series.Add("My Series");
series.XValueType = ChartValueType.DateTime;
series.ChartType = SeriesChartType.Line;
//series.XValueType = ChartValueType.Int32;
//DateTime.Now.AddSeconds(i).ToOADate()
for (int i = 0; i < valuesArray.Length; i++)
series.Points.AddXY(now.AddSeconds(i).ToOADate(), valuesArray[i]);
var chartArea = chart1.ChartAreas[series.ChartArea];
// set view range to [0,max]
//chartArea.AxisX.Minimum = 0;
//chartArea.AxisX.IntervalType = DateTimeIntervalType.Seconds;
//chartArea.AxisX.Interval = 10d;
// chartArea.AxisX.Maximum = 100;
// enable autoscroll
chartArea.CursorX.AutoScroll = true;
// let's zoom to [0,blockSize] (e.g. [0,100])
chartArea.AxisX.ScaleView.Zoomable = true;
chartArea.AxisX.ScaleView.SizeType = DateTimeIntervalType.Auto;
int position = 0;
int size = blockSize;
chartArea.AxisX.ScaleView.Zoom(now.AddSeconds(-5).ToOADate(), now.AddSeconds(20).ToOADate());
//chart1.ChartAreas[0].AxisX.ScaleView.ZoomReset();
// disable zoom-reset button (only scrollbar's arrows are available)
chartArea.AxisX.ScrollBar.ButtonStyle = ScrollBarButtonStyles.SmallScroll;
// set scrollbar small change to blockSize (e.g. 100)
chartArea.AxisX.ScaleView.SmallScrollSize = (new TimeSpan(0,0,10)).TotalSeconds;
With the above code I am unable to drag the scroll bar. I just gets stuck when I click on the scroll bar.I can scroll using the arrows.
chartArea.AxisX.ScaleView.SmallScrollMinSize = .01;
chartArea.AxisX.ScaleView.SmallScrollMinSizeType = DateTimeIntervalType.Seconds;
chartArea.AxisX.ScaleView.SmallScrollSizeType = DateTimeIntervalType.Seconds;
You need to specify the minimum scroll size to get it to work.