Controlling gaps for grid lines

TeeChart for Microsoft Visual Studio .NET, Xamarin Studio (Android, iOS & Forms) & Monodevelop.
Post Reply
BrayanSosa
Newbie
Newbie
Posts: 7
Joined: Tue Sep 12, 2017 12:00 am

Controlling gaps for grid lines

Post by BrayanSosa » Thu May 09, 2024 8:39 pm

I have a chart called TeeChart and I would like to add grid lines for both my left and bottom axes which both range from 0 -128. However I would like said gridlines to occur every 5 numbers shown for each axis and I would like for them to occur at every intersection for a grid line so that they sort of build a "+". So for example there should be a "+" (25, 25), (25, 50), (50, 25) etc. It is of my understanding that the following code that I have written should do that:

Code: Select all

// Ensure regular gridlines are visible
TeeChart.Axes.Bottom.Grid.Visible = true;
TeeChart.Axes.Left.Grid.Visible = true;

//Adding grid line every 5 numbers shown on axis
TeeChart.Axes.Bottom.Grid.DrawEvery = 5;
TeeChart.Axes.Left.Grid.DrawEvery = 5;

// Define dash style for the X-axis (Bottom axis)
System.Windows.Media.DoubleCollection dashArrayX = new System.Windows.Media.DoubleCollection();
dashArrayX.Add(5); // Length of dash at y-coordinate 0
dashArrayX.Add(25); // Length of gap between y-coordinate 0 and 25

// Set the dash style for the bottom axis (X-axis)
TeeChart.Axes.Bottom.Grid.Style = new System.Windows.Media.DashStyle(dashArrayX, 0);

// Define dash style for the Y-axis (Left axis)
System.Windows.Media.DoubleCollection dashArrayY = new System.Windows.Media.DoubleCollection();
dashArrayY.Add(5); // Length of dash
dashArrayY.Add(25); // Length of gap

// Set the dash style for the left axis (Y-axis)
TeeChart.Axes.Left.Grid.Style = new System.Windows.Media.DashStyle(dashArrayY, 0);
The issue I am having is that my gap which should be of length 25 relative to my axis, is not relative to its respective axis. Same thing with the length of the dash, but this is less of a concern than the gap is. Is there a way to force the gap length to be relative to the size of my axis? Please let me know if you would like me to provide anything else for the chart to better assist me. I have also tried to use the DashPattern property instead, but it seems to have the same issue.

Marc
Site Admin
Site Admin
Posts: 1274
Joined: Thu Oct 16, 2003 4:00 am
Location: Girona
Contact:

Re: Controlling gaps for grid lines

Post by Marc » Fri May 10, 2024 11:50 am

Hello,

The approach, DashStyle, is not well suited to the purpose you have in mind, particularly as not only the sizing of gap and dash are important but their precise location too.

Better would be to plot your own lines using the BeforeDrawSeries event (see custom drawing tutorial).

The approach would be to loop vertically between Left Axis Max and Min at the increment you require in pixels (use Chart.Axes.Left.CalcSizeValue to convert axis scale to pixel size) and within that loop, at each increment, loop horizontally from bottom axis min to max. Within that second loop use g.Line (or g.moveTo or g.lineTo) methods at the increment/space you require to plot the horizontal segments.

Repeat the above steps surrounding the left axis loop by the bottom axis loop to generate the vertical lines.

The entire chart rectangle can, optionally, be clipped to avoid any slight overspill of line segments at the end. That may not be necessary if the last segements are controlled by the last Axis Max location, not by a fixed size.

It's not as complicated as the first read through might convey, I may not have described it well either. Once written, the code will create a solid generic solution. It takes a little bit of time to write due to the attention to detail needed so I haven't included an example here but if I/we get a timeslot we'll do so.

Regards,
Marc Meumann
Steema Support

BrayanSosa
Newbie
Newbie
Posts: 7
Joined: Tue Sep 12, 2017 12:00 am

Re: Controlling gaps for grid lines

Post by BrayanSosa » Fri May 10, 2024 6:15 pm

Got it thank you very much for your support!

Post Reply