How to make line chart start from 0 X-Axis - c#

I create a line chart, but I want to display the chart begin from 0 in X-axis.
How can I do this.
I try some method but still did not get what I want.
Chart1.ChartAreas[0].AxisX.Interval = 0;
Chart1.ChartAreas[0].AxisX.IsStartedFromZero = true;
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Crossing = 0;
This is what I do now
This is what I want
And one more, how can I set major and minor unit in the chart..?
my code here
protected void Page_Load(object sender, EventArgs e)
{
System.Drawing.Font axisFont = new System.Drawing.Font("Arial", 8, System.Drawing.FontStyle.Bold);
System.Drawing.Font titleFont = new System.Drawing.Font("Arial", 10, System.Drawing.FontStyle.Bold);
Chart1.Width = 600;
Chart1.Height = 400;
Chart1.BorderlineColor = System.Drawing.Color.Black;
Chart1.BorderlineWidth = 1;
Chart1.BorderlineDashStyle = ChartDashStyle.Solid;
double[] min = { 60.9, 0, 28.81, 7.27 };
double[] ave = { 60.9, 0, 28.81, 7.27 };
double[] max = { 5167.72, 1.27, 4176.16, 2566.59 };
Chart1.Series["Series1"].ChartArea = "ChartArea1";
Chart1.Series["Series2"].ChartArea = "ChartArea1";
Chart1.Series["Series3"].ChartArea = "ChartArea1";
Chart1.Series["Series1"].Points.AddXY("Step 1-2", max[0]);
Chart1.Series["Series2"].Points.AddXY("Step 1-2", ave[0]);
Chart1.Series["Series3"].Points.AddXY("Step 1-2", min[0]);
Chart1.Series["Series1"].Points.AddXY("Step 2-3", max[1]);
Chart1.Series["Series2"].Points.AddXY("Step 2-3", ave[1]);
Chart1.Series["Series3"].Points.AddXY("Step 2-3", min[1]);
Chart1.Series["Series1"].Points.AddXY("Step 3-4", max[2]);
Chart1.Series["Series2"].Points.AddXY("Step 3-4", ave[2]);
Chart1.Series["Series3"].Points.AddXY("Step 3-4", min[2]);
Chart1.Series["Series1"].Points.AddXY("Step 4-5", max[3]);
Chart1.Series["Series2"].Points.AddXY("Step 4-5", ave[3]);
Chart1.Series["Series3"].Points.AddXY("Step 4-5", min[3]);
String hour1 = "hh";
Chart1.Titles.Add("Cycle Time : "+hour1);
Chart1.Titles[0].Font = titleFont;
Chart1.Series["Series1"].MarkerStyle = System.Web.UI.DataVisualization.Charting.MarkerStyle.Triangle;
Chart1.Series["Series2"].MarkerStyle = System.Web.UI.DataVisualization.Charting.MarkerStyle.Square;
Chart1.Series["Series3"].MarkerStyle = System.Web.UI.DataVisualization.Charting.MarkerStyle.Diamond;
Chart1.Series["Series1"].MarkerSize = 15;
Chart1.Series["Series2"].MarkerSize = 15;
Chart1.Series["Series3"].MarkerSize = 15;
Chart1.Legends.Add("Legend1");
Chart1.Series["Series1"].LegendText = "Max";
Chart1.Series["Series2"].LegendText = "Ave";
Chart1.Series["Series3"].LegendText = "Min";
Chart1.Series["Series1"].Legend = "Legend1";
Chart1.Series["Series2"].Legend = "Legend1";
Chart1.Series["Series3"].Legend = "Legend1";
Chart1.Series["Series1"].IsVisibleInLegend = true;
Chart1.Series["Series2"].IsVisibleInLegend = true;
Chart1.Series["Series3"].IsVisibleInLegend = true;
//This part I try to make the graph start from 0 in X-axis but not work
//Chart1.ChartAreas[0].AxisX.Interval = 0;
//Chart1.ChartAreas[0].AxisX.IsStartedFromZero = true;
//Chart1.ChartAreas[0].AxisX.Minimum = 0;
//Chart1.ChartAreas[0].AxisX.Crossing = 0;
//Chart1.ChartAreas[0].AxisX.Minimum = 0;
//Chart1.ChartAreas[0].Position.Auto = false;
Chart1.ChartAreas[0].AxisX.TitleFont = axisFont;
Chart1.ChartAreas[0].AxisY.TitleFont = axisFont;
Chart1.ChartAreas[0].AxisX.Title = "Step";
Chart1.ChartAreas[0].AxisY.Title = "Time (" + hour1 + ")";
Chart1.ChartAreas[0].BackColor = System.Drawing.Color.AliceBlue;
Chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
Chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = System.Drawing.ColorTranslator.FromHtml("#D5E8F5");
}

I had a similar issue, and found that the solution was to set the IsMarginVisible flag to false:
chart1.ChartAreas[0].AxisX.IsMarginVisible = false;
Hope this helps.

The Chart control decides by his own where to start the Axes, and more importantly where to end them, because it could create problems in displaying the points.
Say that you have a point in (-1,0), if you decided to start the X-Axis from 0 what should the chart control do? Display the series starting from unknown? Erase the point?
In your chart every point has 2 values, a string value for the X-Axis and a double for the Y-Axis.
The strings are stored in the chart in alphabetical order, and it also checks whether some are equals or not (so you don't have 3 *Step 1-3*s).
It also give the strings a position value, starting obviously from 0.
But what is the 0 position value string?
Answer: there is no 0 position value string possible.
In fact, if you try something like
Chart1.Series["Series1"].Points.AddXY(string.Empty, 1.0);
Chart1.Series["Series2"].Points.AddXY(string.Empty, 2.0);
Chart1.Series["Series3"].Points.AddXY(string.Empty, 3.0);
The chart control will automatically add a label for the empty string called 1, showing the position value.
The only way for setting major and minor unit in the chart is by adding or removing data from the chart.
Another workaround could be this:
Chart1.Series["SeriesMin"].Points.AddXY(0, max[0]);
Chart1.Series["SeriesAve"].Points.AddXY(0, ave[0]);
Chart1.Series["SeriesMax"].Points.AddXY(0, min[0]);
Chart1.Series["SeriesMin"].Points[0].AxisLabel = "Step 1-2";
Chart1.Series["SeriesAve"].Points[0].AxisLabel = "Step 1-2";
Chart1.Series["SeriesMax"].Points[0].AxisLabel = "Step 1-2";
Then you could add all your so far not working code
Chart1.ChartAreas[0].AxisX.Interval = 0;
Chart1.ChartAreas[0].AxisX.IsStartedFromZero = true;
Chart1.ChartAreas[0].AxisX.Minimum = 0;
Chart1.ChartAreas[0].AxisX.Crossing = 0;
Chart1.ChartAreas[0].AxisX.Minimum = 0;
//Chart1.ChartAreas[0].Position.Auto = false; //EXCEPT THIS ONE!!
Worked like a charm, exceedingly boring if you had to add more data not from a db.

Related

winform mschart Column chart not centering column on datapoint

Hello I am having a hard time understanding how to get my column chart to be centered over the X-Axis label. IN the chart pic below you will see that I have columns based on 1/2 increments. For my positive series the data starts on the left and ends at the x-axis label. On my negative series the data starts at the x-axis label and continues to the right. How do I get these columns centered over the x-axis label. I don't understand why one series is displayed one way and the other series is displayed a different way.
Screen shot here:
http://i.imgur.com/QuAXUxr.png
Code is below
chartAreaDistributionHalfHour.Name = "ChartAreaDistributionHalfHour";
chartAreaDistributionHalfHour.AxisX.MajorGrid.LineColor = System.Drawing.Color.LightGray;
chartAreaDistributionHalfHour.AxisY.MajorGrid.LineColor = System.Drawing.Color.LightGray;
chartAreaDistributionHalfHour.AxisX.IntervalAutoMode = System.Windows.Forms.DataVisualization.Charting.IntervalAutoMode.VariableCount;
chartAreaDistributionHalfHour.AxisY.IntervalAutoMode = System.Windows.Forms.DataVisualization.Charting.IntervalAutoMode.VariableCount;
chartAreaDistributionHalfHour.AxisX.LabelAutoFitMaxFontSize = 7;
chartAreaDistributionHalfHour.AxisY.LabelAutoFitMaxFontSize = 7;
chartAreaDistributionHalfHour.AxisX.Title = "Distribution (Half-Hourly)";
chartAreaDistributionHalfHour.AxisY.Title = "Profit/Loss ($)";
chartAreaDistributionHalfHour.AxisY.IsMarginVisible = false;
seriesDistributionHalfHour.ChartArea = "ChartAreaDistributionHalfHour";
seriesDistributionHalfHour.ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Column;
seriesDistributionHalfHour.Color = System.Drawing.Color.Green;
seriesDistributionHalfHour.Enabled = true;
seriesDistributionHalfHour.Name = "distributionHalfHour";
seriesDistributionHalfHourNegative.ChartArea = "ChartAreaDistributionHalfHour";
seriesDistributionHalfHourNegative.ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Column;
seriesDistributionHalfHourNegative.Color = System.Drawing.Color.Red;
seriesDistributionHalfHourNegative.Enabled = true;
seriesDistributionHalfHourNegative.Name = "netLossDistributionHalfHour";
seriesDistributionHalfHourZeroLine.ChartArea = "ChartAreaDistributionHalfHour";
seriesDistributionHalfHourZeroLine.ChartType = System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Line;
seriesDistributionHalfHourZeroLine.BorderDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.Dash;
seriesDistributionHalfHourZeroLine.Color = System.Drawing.Color.Black;
seriesDistributionHalfHourZeroLine.Enabled = true;
seriesDistributionHalfHourZeroLine.Name = "netDistributionHalfHourZeroLine";
this.chartDistributionHalfHourGraph.Location = new System.Drawing.Point(17, 49);
this.chartDistributionHalfHourGraph.Name = "chartDistributionHalfHourGraph";
this.chartDistributionHalfHourGraph.BorderlineColor = System.Drawing.Color.Black;
this.chartDistributionHalfHourGraph.BorderlineDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.Solid;
this.chartDistributionHalfHourGraph.Cursor = System.Windows.Forms.Cursors.Cross;
this.chartDistributionHalfHourGraph.Visible = false;
this.chartDistributionHalfHourGraph.Size = new System.Drawing.Size(1443, 694);
this.chartDistributionHalfHourGraph.TabIndex = 7;
this.chartDistributionHalfHourGraph.Text = "chart2";
this.chartDistributionHalfHourGraph.ChartAreas.Add(chartAreaDistributionHalfHour);
this.chartDistributionHalfHourGraph.Series.Add(seriesDistributionHalfHour);
this.chartDistributionHalfHourGraph.Series.Add(seriesDistributionHalfHourNegative);
this.chartDistributionHalfHourGraph.Series.Add(seriesDistributionHalfHourZeroLine);

ZedGraph - How to change X-axis from points to time?

i have a working DLL where i have one function to add arrays to a list and another function that shows all list-arrays in a ZED-Graph-diagram. All arrays have the same size.
Currently the x-axis is shown in points from 0 to 1024.
Question is: What do i have to change to display the x-axis in time?
I have the value "Intervall" (time between two points) that i can pass into the function.
Thanks for the help.
Here is what i have so far:
public void AddGraph(double[] Values, string LegendName)
{
int i = 0;
PointPairList list = new PointPairList();
for (i = 0; i < Values.Length; i++)
{
list.Add(i, Values[i]);
}
if (i > MaxXAxis)
MaxXAxis = i;
SList.Add(list);
SListColor.Add(Color.Black);
SListName.Add(LegendName);
}
public void ShowDiagram(string Title, string XAxisName, string YAxisName, int Timeout_ms)
{
ZedGraph.ZedGraphControl zgc = new ZedGraphControl();
GraphPane myPane = zgc.GraphPane;
LineItem myCurve = null;
// Set the titles and axis labels
myPane.Title.Text = Title;
myPane.XAxis.Title.Text = XAxisName;
myPane.YAxis.Title.Text = YAxisName;
for (int i = 0; i < SList.Count(); i++)
{
myCurve = myPane.AddCurve(SListName[i], SList[i], SListColor[i], SymbolType.None);
myCurve.Line.Width = 2;
}
// Add gridlines to the plot, and make them gray
myPane.XAxis.MinorGrid.IsVisible = true;
myPane.YAxis.MinorGrid.IsVisible = true;
myPane.XAxis.MinorGrid.Color = Color.LightGray;
myPane.YAxis.MinorGrid.Color = Color.LightGray;
myPane.XAxis.MinorGrid.DashOff = 0;
myPane.YAxis.MinorGrid.DashOff = 0;
myPane.XAxis.MajorGrid.IsVisible = true;
myPane.YAxis.MajorGrid.IsVisible = true;
myPane.XAxis.MajorGrid.Color = Color.Gray;
myPane.YAxis.MajorGrid.Color = Color.Gray;
myPane.XAxis.MajorGrid.DashOff = 0;
myPane.YAxis.MajorGrid.DashOff = 0;
// Move Legend to buttom
myPane.Legend.Position = LegendPos.Bottom;
zgc.AxisChange();
myPane.XAxis.Scale.Max = MaxXAxis;
zgc.Location = new Point(0, 0);
zgc.Size = new Size(panel_diagramm.ClientRectangle.Width, panel_diagramm.ClientRectangle.Height);
panel_diagramm.Controls.Add(zgc);
}
This is my first time posting so I apologize for not putting it in a better format.
The following allows you to setup your x-axis to display time:
myPane.XAxis.Type = AxisType.Date;
myPane.XAxis.Title.Text = "Time (HH:MM:SS)";
myPane.XAxis.Scale.Format = "HH:mm:ss";
myPane.XAxis.Scale.MajorUnit = DateUnit.Minute;
myPane.XAxis.Scale.MinorUnit = DateUnit.Minute;
myPane.XAxis.Scale.Min = DateTime.Now.Subtract(new TimeSpan(0, 0, 10, 0, 0).ToOADate();
myPane.XAxis.Scale.Max = DateTime.Now.ToOADate();

ASP.NET (C#) Graph

I am wondering how can I remove the 3 horizontal red lines on the stock graph as shown in image bellow. Please ignore the dots/squares on the image they are irrelevant. I think I have searched every google page there is and went through every option asp.net has... and could not figure out it. Any help is greatly appreciated!
Code that generated this graph:
Double[] test = new Double[] { 10, 50 };
Chart1.Series[0].ChartType = SeriesChartType.Stock;
Chart1.Series[0].YAxisType = AxisType.Primary;
Chart1.Series[0].Color = Color.Red;
Chart1.Series[0].BorderWidth = 10;
Chart1.ChartAreas[0].AxisY.MajorGrid.Enabled = false;
Chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
Chart1.Series[0]["PixelPointWidth"] = "5";
Chart1.Series.Add(new Series("Test Series"));
Chart1.Series[1].ChartType = SeriesChartType.Point;
Chart1.Series[1].YAxisType = AxisType.Primary;
Chart1.Series[1].Color = Color.Black;
Chart1.Series[1].BorderWidth = 3;
Chart1.Series[1].MarkerSize = 15;
Chart1.Series.Add(new Series("New Series"));
Chart1.Series[2].ChartType = SeriesChartType.Point;
Chart1.Series[2].YAxisType = AxisType.Primary;
Chart1.Series[2].Color = Color.Orange;
Chart1.Series[2].BorderWidth = 3;
Chart1.Series[2].MarkerSize = 15;
Chart1.Series[0].Points.Add(new Double[] {-10, 50});
Chart1.Series[1].Points.Add(25);
Chart1.Series[2].Points.Add(20);
for (int i = 0; i < 2; i++)
{
Chart1.Series[0].Points.Add(test);
Chart1.Series[1].Points.Add(25);
Chart1.Series[2].Points.Add(20);
}
Okay, after looking into it obsessively, I think that I have a solution. Just adding the two Y values, the chart has a default value of zero for a marker (high or low?). By specifying that you will add the four values (open, close, high, low - not certain about the high/low order), you can hide those lines by making them fall within your open/close range, and by setting the PixelPointWidth to equal or less then your BorderWidth.
// IMPORTANT: add the ", 4" to indicate that you have the four Y values
Chart1.Series.Add(new Series("Stock", 4));
Chart1.Series["Stock"].ChartType = SeriesChartType.Stock;
Chart1.Series["Stock"].YAxisType = AxisType.Primary;
Chart1.Series["Stock"].Color = Color.Red;
Chart1.Series["Stock"].BorderWidth = 10;
Chart1.ChartAreas[0].AxisY.MajorGrid.Enabled = false;
Chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
// Set <= BorderWidth, so that it's effectively hidden
Chart1.Series["Stock"]["PixelPointWidth"] = "10";
Chart1.Series["Stock"].Points.AddY(10, 50, 20, 30); // open, close, high, low.
That was a little hard to track down. Whew.

Piechart showing fewer slices than the legend

I'm a student that is still learning C# and I ran into a problem.
I'm trying to make a graphic (pie chart) with 7 different fields and seven different legendas.
I've got this code:
private void InitializeChart()
{
this.components = new System.ComponentModel.Container();
ChartArea chartArea1 = new ChartArea();
Legend legend1 = new Legend()
{ BackColor = Color.FromArgb(97,97,97), //achtergrondkleur legende
ForeColor = Color.White, //kleur van tekst in legende
Title = "Legende grafiek", //titel legende
TitleForeColor = Color.White}; //kleur titel legende
pieChart = new Chart();
((ISupportInitialize)(pieChart)).BeginInit();
SuspendLayout();
//===Pie chart
chartArea1.Name = "PieChartArea";
pieChart.ChartAreas.Add(chartArea1);
pieChart.Height = 300;
pieChart.Width = 300;
pieChart.Dock = System.Windows.Forms.DockStyle.Fill;
legend1.Name = "Legend1";
pieChart.Legends.Add(legend1);
pieChart.Location = new System.Drawing.Point(0, 50);
//====Bar Chart
chartArea1 = new ChartArea();
chartArea1.Name = "BarChartArea";
AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
this.Load += new EventHandler(StatistiekenForm_Load);
((ISupportInitialize)(this.pieChart)).EndInit();
this.ResumeLayout(false);
}
private void LoadPieChart()
{
pieChart.Series.Clear();
pieChart.Width = 300;
pieChart.Height = 300;
pieChart.Palette = ChartColorPalette.Excel;
pieChart.BackColor = Color.Transparent;
//pieChart.Titles.Add("Overzicht uitgaven");
pieChart.ChartAreas[0].BackColor = Color.Transparent;
Series series = new Series
{
Name = "Overzicht",
IsVisibleInLegend = true,
Color = System.Drawing.Color.FromArgb(97,97,97),
ChartType = SeriesChartType.Pie
};
pieChart.Series.Add(series);
int teller, prijsje = 50;
for (teller = 0; teller < 7; teller++)
{
series.Points.Add(teller);
var p1 = series.Points[teller];
p1.AxisLabel = Convert.ToString(prijsje + "€");
p1.LegendText = Convert.ToString("legende " + teller);
prijsje += 50;
}
pieChart.Invalidate();
panelPie.Width = 400;
panelPie.Height = 400;
panelPie.Controls.Add(pieChart);
}
Could anybody explain me why I keep seeing SIX slices, but the legenda shows me seven?
You can see the problem in this image:
http://i.imgur.com/4xciNUG.png?1
Thank you very much,
Yenthe.
There are 7 slices. The first one is too small though and you only see a sliver. Try changing this line: prijsje += 50 to prijsje += 10. his should allow you to better see that there are indeed 7 slices.
UPDATED:
I think you are using the Add Method incorrectly. I think what you are thinking is that by calling series.Points.Add(teller);, that C# is adding a point to teller position in the collection. This is actually incorrect.
What its doing is its inserting a point with the value of teller. The first one has a value of 0, which is why you aren't seeing it. Then the next one has a value of 1, which is the "100" label. Then the next one has a value of 2 (which is double the size of the one before it..1), which is the "150" label. If you were to cut out the "100" slice and overlay it on top of the "200" slice, you'd probably think by looking at the labels that two "100" slices could exactly fit into one "200" slice. In actuality, three can fit into one. The reason is because the value assigned to the "200" slice is 3.
To fix your problem, You should be using the Insert method instead of Add. Try this:
for (teller = 0; teller < 7; teller++)
{
var dp = new DataPoint(prijsje, prijsje);
dp.AxisLabel = Convert.ToString(prijsje + "€");
dp.LegendText = Convert.ToString("legende " + teller);
series.Points.Insert(teller, dp);
prijsje += 50;
}

ScaleView.minSize does not work properly on chart with date/time on axis

I'm building a winforms application with a chart (system.windows.forms.datavisualization.Charting.ChartArea). The series in this chart have date/time on the AxisX and float on the AxisY.
No matter what settings I try for ScaleView.MinSize and ScaleView.MinSizeType on AxisX, it always works like it is set to 1 Days
chartArea1.AxisX.Enabled = System.Windows.Forms.DataVisualization.Charting.AxisEnabled.True;
chartArea1.AxisX.LabelStyle.Format = "dd MMM\nHH:mm";
chartArea1.AxisX.ScaleView.MinSize = 0.001D;
chartArea1.AxisX.ScaleView.MinSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Days;
chartArea1.AxisX.ScaleView.SizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Hours;
chartArea1.AxisX.ScaleView.SmallScrollMinSize = 15D;
chartArea1.AxisX.ScaleView.SmallScrollMinSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Minutes;
chartArea1.AxisX.ScaleView.SmallScrollSize = 15D;
chartArea1.AxisX.ScaleView.SmallScrollSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Minutes;
chartArea1.AxisX2.Enabled = System.Windows.Forms.DataVisualization.Charting.AxisEnabled.False;
chartArea1.AxisX2.ScaleView.SmallScrollMinSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Hours;
chartArea1.AxisX2.ScaleView.SmallScrollSize = 15D;
chartArea1.AxisX2.ScaleView.SmallScrollSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Minutes;
chartArea1.AxisY.Enabled = System.Windows.Forms.DataVisualization.Charting.AxisEnabled.True;
chartArea1.AxisY.ScaleView.MinSize = 1D;
chartArea1.AxisY.ScaleView.MinSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Number;
chartArea1.AxisY.ScaleView.SmallScrollMinSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Number;
chartArea1.AxisY.ScaleView.SmallScrollSize = 1D;
chartArea1.AxisY.ScaleView.SmallScrollSizeType = System.Windows.Forms.DataVisualization.Charting.DateTimeIntervalType.Number;
chartArea1.AxisY2.Enabled = System.Windows.Forms.DataVisualization.Charting.AxisEnabled.False;
chartArea1.CursorX.IsUserEnabled = true;
chartArea1.CursorX.IsUserSelectionEnabled = true;
chartArea1.CursorY.IsUserEnabled = true;
chartArea1.CursorY.IsUserSelectionEnabled = true;
AxisY with datatype float is working properly. Also SmallScrollSize on AxisX is working properly. But why is the ScaleView.MinSize troubeling me?
The problem was caused by cursor interval. This is set to 1 by default, therefore I could not select a smaller interval than 1 (day). By changing the interval to 0.01 (14.4 minutes), this is no longer a problem.
chartArea1.CursorX.Interval = 0.01D;

Categories