# Vertical Line marker for Timeseries chart **URL:** \ **Category:** Ignition\ **Tags:** perspective\ **Created:** [September 17, 2025, 5:51pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726 "2025-09-17T17:51:16Z")\ **Posts on this page:** 11\ **Page:** 1
**Author:** ![ryder\_risic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryder_risic/32/79824_2.png) [@ryder\_risic](https://forum.inductiveautomation.com/u/ryder_risic)\ **Post date:** [September 17, 2025, 5:51pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/1 "2025-09-17T17:51:16Z")
I have a chart that tracks torque and position behavior from a robot. I also track when the task program name changes, and want to reflect this on the graph so that there is a clear visual distinction between different programs being run. Ideally this would be a dynamic vertical line that is assigned the timestamp of when the new task started, and consequently moves with the x axis, until it leaves the view. There are no annotations or markers I can find that accomplish this for me. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/e/8e0b11574ed27a07a12f633a12bab34064ece62a.png) ---
**Author:** ![Tim](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tim/32/3361_2.png) [@Tim](https://forum.inductiveautomation.com/u/Tim)\ **Post date:** [September 17, 2025, 5:56pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/2 "2025-09-17T17:56:45Z")
This is similar to this example: > [@Time Series Chart Markers](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337/2): > > Try adding the series name under props.plots[0].trends[0].series Here is a working Time Series Chart with a single line marker: play_button View JSON ---
**Author:** ![ryder\_risic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryder_risic/32/79824_2.png) [@ryder\_risic](https://forum.inductiveautomation.com/u/ryder_risic)\ **Post date:** [September 17, 2025, 6:06pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/3 "2025-09-17T18:06:23Z")
Did you ever figure out how to get the markers vertical? It seems at the bottom of your thread there still wasn’t a clear answer to this. I could also accept any workarounds. I’ve been trying to think of a way to do this by just making another series on the chart, but haven’t figured it out yet ---
**Author:** ![Tim](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tim/32/3361_2.png) [@Tim](https://forum.inductiveautomation.com/u/Tim)\ **Post date:** [September 17, 2025, 6:08pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/4 "2025-09-17T18:08:40Z")
I ended up using ApexChart via the free 3rd-party EmbrCharts module. This is really a great module. ---
**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\ **Post date:** [September 17, 2025, 6:15pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/5 "2025-09-17T18:15:49Z")
I have done that by placing the chart inside of a Coordinate Container, and calculating the X position of a label/container based on its ~~pixel~~ width and the span within that represents a particular time: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/f/3fe83b5fc41aba1526d8e32e78cd65543707c324.png) ---
**Author:** ![ryder\_risic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryder_risic/32/79824_2.png) [@ryder\_risic](https://forum.inductiveautomation.com/u/ryder_risic)\ **Post date:** [September 17, 2025, 6:20pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/6 "2025-09-17T18:20:42Z")
That is exactly the look I am going for. My chart is in a coordinate container, but I am embedding that view in a flex repeater to accomplish a variable amount of shown charts. You can see a mockup UI below where there are 5 charts (it varies 1-6 usually). Would this calculation idea blow up once the charts start changing sizes? ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/5/659951f3799ad0dbfe6dee1f3baeca32d29c85d9.png) ---
**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\ **Post date:** [September 17, 2025, 6:26pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/7 "2025-09-17T18:26:16Z")
Yes, if you set the container to `percent` mode. Then you just calculate the time between the start time and the marker time, and divide that by the time between the start and end times to get the marker X position. ---
**Author:** ![ryder\_risic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryder_risic/32/79824_2.png) [@ryder\_risic](https://forum.inductiveautomation.com/u/ryder_risic)\ **Post date:** [September 17, 2025, 6:50pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/8 "2025-09-17T18:50:06Z")
I think I understand what you are saying. Do you mind sharing an example of this of yours? I assume you can have the vertical bar line up with the correct time no matter the flex/percent size if you script it this way? I am struggling to pull the first and last time displayed on the timeserieschart and using those effectively. ---
**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\ **Post date:** [September 17, 2025, 7:05pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/9 "2025-09-17T19:05:52Z")
The red chart at the bottom of my screenshot is a ChartRangeSelector that is used to select a time span that is then passed in as parameters to the TimeSeriesChart series (a Tag History binding). I have a list of marker times kept as a custom view property, and the X position of a marker is a binding with a script transform: ```python value = value[self.custom.markersIndex]['time'] if value is None: return 0 timeSpan1 = system.date.secondsBetween(self.view.custom.selectedRangeStart, value) fullSpan = system.date.secondsBetween(self.view.custom.selectedRangeStart, self.view.custom.selectedRangeEnd) ratio = float(timeSpan1) / float(fullSpan) * 0.97 return 0.025 + ratio ``` The two hardwired float values account for the width of the Y axis labels and component padding (I think, it's been a while since I did this). The markers adjust accordingly with a change in either browser window size, or selected time range. ---
**Author:** ![ryder\_risic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryder_risic/32/79824_2.png) [@ryder\_risic](https://forum.inductiveautomation.com/u/ryder_risic)\ **Post date:** [September 17, 2025, 7:19pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/10 "2025-09-17T19:19:30Z")
@Ryan_Deardorff @Tim Thank you for the help! I am exploring Ryan’s option. However the timeserieschart zoom/pan feature seems to mess with this setup. I also am not planning on fitting a range selector in my project, but it is good to know this is a viable option. It seems until perspective comes out with some better marker features, Apex charts module might be the way to go. Just skimmed it and it looks pretty powerful. ---
**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\ **Post date:** [September 17, 2025, 7:21pm UTC](https://forum.inductiveautomation.com/t/vertical-line-marker-for-timeseries-chart/110726/11 "2025-09-17T19:21:53Z")
Ah, right, I forgot, I do have those markers disappearing whenever zoom kicks in. Would be nice if the chart properties gave you access to the actual time span being displayed. Note, though, that if you use a ChartRangeSelector as I'm doing, you can still "zoom" by narrowing the range being selected, and the markers will adjust accordingly.