Forum > TAChart
TAChart how to make different width and/or color only for a specific grid line
tk:
Hello, I need to highlight the horizontal zero-value grid line in my chart, i.e., display it in a different color and with a thicker line width.
It can be seen here https://wiki.freepascal.org/TAChart on the screenshot below.
Both zero value grid lines are drawn with different style.
How to do this programmatically in TAChart?
Further information is little bit off topic but maybe it can be useful:
In my programs, I also use the Chart.JS JavaScript library.
I found a good video demonstrating this in Chart.JS: https://www.youtube.com/watch?v=wijUFALw3tQ
This works as expected.
I also use Steema TeeChart Delphi VCL library (Standard Edition without source code).
I don't know how to make this there as well.
Maybe someone knows how to do the same thing in Steema TeeChart?
The official forum https://www.steema.com/support/ seems to be closed to new registrations, so I can't ask questions there :(
Thanks
wp:
In TAChart you add a TConstantLine series to the chart. For a y=0 line, make sure that it has LineStyle = lsHorizontal and Position = 0. A x=0 line needs LineStyle = lsVertical. Use the Pen property of the series to modify color and style. And you may want to uncheck ShowInLegend to avoid having these auxiliary lines in the legend.
I cannot find something like this in TeeChart. But you can always add a dummy line series running along the zero-value grid line.
--- Quote from: tk on July 17, 2025, 11:30:24 am ---The official forum https://www.steema.com/support/ seems to be closed to new registrations, so I can't ask questions there :(
--- End quote ---
Yet another reason to switch to TAChart...
tk:
Thank you for such a quick answer!
--- Quote from: wp on July 17, 2025, 11:56:36 am ---In TAChart you add a TConstantLine series to the chart.
--- End quote ---
One more question:
Will this constant line series count towards the automatic vertical range calculation (when LeftAxis.Automatic := True)?
Because the zero line is not always visible in my chart - the grid lines shown depend on automatic range calculation.
--- Quote from: wp on July 17, 2025, 11:56:36 am ---I cannot find something like this in TeeChart. But you can always add a dummy line series running along the zero-value grid line.
--- End quote ---
I already tried to use the dummy line series in both TaChart and Teechart but they always count towards the automatic vertical range calculation.
They cannot be excluded from that calculation (or I don't know how they can be excluded).
Of course I could compute the range manually from 'working' series to prevent this but I don't want to do this.
I prefer to use the automatic calculation with default rounding and display settings.
wp:
I see. Yes - the ConstantLine series is considered when the overall axis range is calculated.
The following code seems to work:
* In the OnExtentChanging event of the chart hide the ConstantLine series.
* In the OnExtentChanged event of the chart, use the chart's LogicalExtent (the range of the x and y axes, since ConstantLine series is hidden this is without the constant line) to decide whether the ConstantLine should be turned on again:
--- Code: Pascal [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---uses TAChartUtils; procedure TForm1.Chart1ExtentChanging(ASender: TChart);begin Chart1ConstantLine1.Active := false;end; procedure TForm1.Chart1ExtentChanged(ASender: TChart);var ext: TDoubleRect;begin ext := Chart1.LogicalExtent; Chart1ConstantLine1.Active := ext.b.y * ext.a.y < 0;end;
Another possibility would be to skip the idea with the ConstantLine series and to hook into one of the chart's drawing events. OnAfterDrawBackwall or OnAfterCustomDrawBackwall seem to be good candidates. Get the logical extent in a local variable and replace the y value by 0. Calculate the corresponding screen points and draw the connecting line:
--- Code: Pascal [+][-]window.onload = function(){var x1 = document.getElementById("main_content_section"); if (x1) { var x = document.getElementsByClassName("geshi");for (var i = 0; i < x.length; i++) { x[i].style.maxHeight='none'; x[i].style.height = Math.min(x[i].clientHeight+15,306)+'px'; x[i].style.resize = "vertical";}};} ---procedure TForm1.Chart1AfterCustomDrawBackWall(ASender: TChart; ADrawer: IChartDrawer; const ARect: TRect);var ext: TDoubleRect; P1, P2: TPoint;begin ext := ASender.LogicalExtent; ext.a.y := 0; ext.b.y := 0; P1 := ASender.GraphToImage(ext.a); P2 := ASender.GraphToImage(ext.b); ADrawer.SetPenParams(psSolid, clYellow, 3); ADrawer.Line(P1, P2);end;
The problem here is that the axis grid is drawn after the background and the grid line is painted over this manually drawn zero-line. Only when the zero line has the same color as the grid lines, this does not matter...
wp:
Ah - there's a better solution:
* In the object tree, click on the AxisList of the chart, then right-click and "Add item". This adds a third axis to the chart
* If you want a horizontal zero line, set the Alignment of the new axis to alBottom, otherwise alLeft.
* Turn this axis line ON: (new axis).AxisPen.Visible := true; you may also want to change linewidth and color here
* Turn off the grid of the new axis: (new axis).Grid.Visible := false
* Maybe you want to turn OFF the axis labels and ticks of the new axis: (new axis).Marks.Visible := false.
* Move the new axis line to the zero position: (new axis).Position := 0 and (new axis).PositionUnits := cuGraph; this interprets the "0" in the unit system of the data points.
* Move the new axis above the old axis (because otherwise the grid will be painted over it in case of coincidence): (new axis).ZPosition := 1. But now the new axis will also be before the series which have ZPosition := 0 by default. If you don't like this, you must also set the ZPosition of each series to a larger value than the ZPosition of the new axis. (Or: apply all the changes to the old axis and keep the default settings of the new axis.)I hope I did not forget anything...
Navigation
[0] Message Index
[#] Next page