# Time Series Chart Markers

**URL:** <https://forum.inductiveautomation.com/t/time-series-chart-markers/110337>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [September 2, 2025, 6:12pm UTC](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337 "2025-09-02T18:12:25Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**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 2, 2025, 6:12pm UTC](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337/1 "2025-09-02T18:12:25Z")

</div>

I’m hoping someone can shed some light on [markers](https://www.docs.inductiveautomation.com/docs/8.1/appendix/components/perspective-components/perspective-chart-palette/perspective-time-series-chart#plotsmarkers-properties) within the Perspective Time Series Chart. I’m on version 8.1.44 and have been unable to get a marker of any form to display on the chart. Can someone post an extremely basic example JSON of the chart with a marker? Maybe just the default chart config with the default data including one vertical marker added. Is this known to not work?

Note: I can successfully add markers to the XY Chart, but no luck with the Time Series Chart.

---

<div class="post-metadata">

**Author:** ![schenk](https://avatars.discourse-cdn.com/v4/letter/s/6bbea6/32.png) [@schenk](https://forum.inductiveautomation.com/u/schenk)\
**Post date:** [September 2, 2025, 7:26pm UTC](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337/2 "2025-09-02T19:26:17Z")

</div>

Try adding the series name under `props.plots[0].trends[0].series`

Here is a working Time Series Chart with a single line marker:

> **View JSON**
>
> `{`  
> `"custom": {},`  
> `"params": {},`  
> `"props": {},`  
> `"root": {`  
> `"children": [`  
> `{`  
> `"meta": {`  
> `"name": "TimeSeriesChart"`  
> `},`  
> `"position": {`  
> `"basis": "400px",`  
> `"grow": 1`  
> `},`  
> `"props": {`  
> `"plots": [`  
> `{`  
> `"axes": [],`  
> `"markers": [`  
> `{`  
> `"axis": "",`  
> `"line": {`  
> `"color": "",`  
> `"dashArray": 0,`  
> `"label": {`  
> `"font": {`  
> `"color": "",`  
> `"size": 10`  
> `},`  
> `"position": "right",`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"text": ""`  
> `},`  
> `"opacity": 0.5,`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"width": 3`  
> `},`  
> `"type": "line",`  
> `"value": 20,`  
> `"visible": true`  
> `}`  
> `],`  
> `"relativeWeight": 1,`  
> `"trends": [`  
> `{`  
> `"axis": "",`  
> `"baselines": [],`  
> `"breakLine": true,`  
> `"columns": [],`  
> `"interpolation": "curveLinear",`  
> `"radius": 2,`  
> `"series": "Boiler",`  
> `"stack": true,`  
> `"type": "line",`  
> `"visible": true`  
> `}`  
> `]`  
> `}`  
> `],`  
> `"series": [`  
> `{`  
> `"data": [`  
> `{`  
> `"Pressure": 12,`  
> `"Temperature": 52,`  
> `"time": 1560469431423`  
> `},`  
> `{`  
> `"Pressure": 42,`  
> `"Temperature": 18,`  
> `"time": 1560469432423`  
> `},`  
> `{`  
> `"Pressure": 81,`  
> `"Temperature": 26,`  
> `"time": 1560469433423`  
> `},`  
> `{`  
> `"Pressure": 11,`  
> `"Temperature": 63,`  
> `"time": 1560469434423`  
> `},`  
> `{`  
> `"Pressure": 23,`  
> `"Temperature": 65,`  
> `"time": 1560469435423`  
> `},`  
> `{`  
> `"Pressure": 43,`  
> `"Temperature": 12,`  
> `"time": 1560469436423`  
> `},`  
> `{`  
> `"Pressure": 71,`  
> `"Temperature": 61,`  
> `"time": 1560469437423`  
> `},`  
> `{`  
> `"Pressure": 89,`  
> `"Temperature": 60,`  
> `"time": 1560469438423`  
> `},`  
> `{`  
> `"Pressure": 66,`  
> `"Temperature": 58,`  
> `"time": 1560469439423`  
> `},`  
> `{`  
> `"Pressure": 33,`  
> `"Temperature": 1,`  
> `"time": 1560469440423`  
> `}`  
> `],`  
> `"name": "Boiler"`  
> `}`  
> `]`  
> `},`  
> `"type": "ia.chart.timeseries"`  
> `}`  
> `],`  
> `"meta": {`  
> `"name": "root"`  
> `},`  
> `"props": {`  
> `"direction": "column"`  
> `},`  
> `"type": "ia.container.flex"`  
> `}`  
> `}`

---

<div class="post-metadata">

**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 2, 2025, 7:46pm UTC](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337/3 "2025-09-02T19:46:34Z")

</div>

Thanks this is great. Is it possible with this component to have a vertical marker or only the horizontal?

---

<div class="post-metadata">

**Author:** ![schenk](https://avatars.discourse-cdn.com/v4/letter/s/6bbea6/32.png) [@schenk](https://forum.inductiveautomation.com/u/schenk)\
**Post date:** [September 2, 2025, 9:05pm UTC](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337/4 "2025-09-02T21:05:06Z")

</div>

I was able to add a highlighted range to the chart. I think these are all of the steps I took, but I attached an updated view with an example in case I missed something:

- Add a new series with the start and end of the range you want, with a value of 1 for each
- Add a new axis, set the width to -1 to hide it, and the min/max to 0 and 1
- Add a new trend with props.plots[0].trends[1].type set to "area" and set the axis and series to the newly created ones
- Add a column to the new trend and set the key to the new series x-axis key, and set the color to something with opacity

> **View JSON**
>
> `{`  
> `"custom": {`  
> `"data": {`  
> `"$": [`  
> `"ds",`  
> `192,`  
> `1756846855478`  
> `],`  
> `"$columns": [`  
> `{`  
> `"data": [],`  
> `"name": "t_stamp",`  
> `"type": "Date"`  
> `},`  
> `{`  
> `"data": [],`  
> `"name": "RandomInteger",`  
> `"type": "Long"`  
> `}`  
> `]`  
> `},`  
> `"tags": "value"`  
> `},`  
> `"params": {},`  
> `"propConfig": {`  
> `"custom.data": {`  
> `"binding": {`  
> `"config": {`  
> `"avoidScanClassValidation": true,`  
> `"dateRange": {`  
> `"mostRecent": "4",`  
> `"mostRecentUnits": "HOUR"`  
> `},`  
> `"enableValueCache": true,`  
> `"ignoreBadQuality": false,`  
> `"polling": {`  
> `"enabled": true,`  
> `"rate": "10"`  
> `},`  
> `"preventInterpolation": true,`  
> `"returnFormat": "Wide",`  
> `"returnSize": {`  
> `"type": "RAW"`  
> `},`  
> `"tags": [`  
> `{`  
> `"alias": "RandomInteger",`  
> `"path": "[InternalQuestDB/Ignition-USWN3469:Ignition3079]HistorianTest/RandomInteger1"`  
> `}`  
> `],`  
> `"valueFormat": "DATASET"`  
> `},`  
> `"type": "tag-history"`  
> `},`  
> `"persistent": true`  
> `},`  
> `"custom.tags": {`  
> `"persistent": true`  
> `}`  
> `},`  
> `"props": {},`  
> `"root": {`  
> `"children": [`  
> `{`  
> `"meta": {`  
> `"name": "TimeSeriesChart"`  
> `},`  
> `"position": {`  
> `"basis": "400px",`  
> `"grow": 1`  
> `},`  
> `"props": {`  
> `"plots": [`  
> `{`  
> `"axes": [`  
> `{`  
> `"alignment": "left",`  
> `"grid": {`  
> `"color": "",`  
> `"dashArray": 0,`  
> `"opacity": 0.9,`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"visible": false`  
> `},`  
> `"label": {`  
> `"font": {`  
> `"color": "",`  
> `"size": 10`  
> `},`  
> `"offset": 0,`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"text": "",`  
> `"visible": true`  
> `},`  
> `"max": "",`  
> `"min": "",`  
> `"name": "Axis0",`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"tick": {`  
> `"color": "",`  
> `"count": "Auto",`  
> `"label": {`  
> `"font": {`  
> `"color": "",`  
> `"size": 10`  
> `},`  
> `"format": "Auto",`  
> `"style": {`  
> `"classes": ""`  
> `}`  
> `},`  
> `"style": {`  
> `"classes": ""`  
> `}`  
> `},`  
> `"width": 60`  
> `},`  
> `{`  
> `"alignment": "left",`  
> `"grid": {`  
> `"color": "",`  
> `"dashArray": 0,`  
> `"opacity": 0.9,`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"visible": false`  
> `},`  
> `"label": {`  
> `"font": {`  
> `"color": "",`  
> `"size": 10`  
> `},`  
> `"offset": 0,`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"text": "",`  
> `"visible": false`  
> `},`  
> `"max": 1,`  
> `"min": 0,`  
> `"name": "HighlightAxis",`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"tick": {`  
> `"color": "",`  
> `"count": "Auto",`  
> `"label": {`  
> `"font": {`  
> `"color": "",`  
> `"size": 10`  
> `},`  
> `"format": "Auto",`  
> `"style": {`  
> `"classes": ""`  
> `}`  
> `},`  
> `"style": {`  
> `"classes": ""`  
> `}`  
> `},`  
> `"width": -1`  
> `}`  
> `],`  
> `"markers": [`  
> `{`  
> `"axis": "Axis0",`  
> `"line": {`  
> `"color": "black",`  
> `"dashArray": 0,`  
> `"label": {`  
> `"font": {`  
> `"color": "",`  
> `"size": 10`  
> `},`  
> `"position": "left",`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"text": "Marker"`  
> `},`  
> `"opacity": 1,`  
> `"style": {`  
> `"classes": ""`  
> `},`  
> `"width": 1`  
> `},`  
> `"type": "line",`  
> `"value": 20,`  
> `"visible": true`  
> `}`  
> `],`  
> `"relativeWeight": 1,`  
> `"trends": [`  
> `{`  
> `"axis": "Axis0",`  
> `"baselines": [],`  
> `"breakLine": true,`  
> `"columns": [],`  
> `"interpolation": "curveLinear",`  
> `"radius": 2,`  
> `"series": "Boiler",`  
> `"stack": true,`  
> `"type": "line",`  
> `"visible": true`  
> `},`  
> `{`  
> `"axis": "HighlightAxis",`  
> `"baselines": [],`  
> `"breakLine": true,`  
> `"columns": [`  
> `{`  
> `"color": "#0000FF30",`  
> `"key": "x",`  
> `"styles": {`  
> `"highlighted": {`  
> `"fill": {`  
> `"color": "",`  
> `"opacity": null`  
> `},`  
> `"stroke": {`  
> `"color": "",`  
> `"dashArray": null,`  
> `"opacity": null,`  
> `"width": null`  
> `}`  
> `},`  
> `"muted": {`  
> `"fill": {`  
> `"color": "",`  
> `"opacity": null`  
> `},`  
> `"stroke": {`  
> `"color": "",`  
> `"dashArray": null,`  
> `"opacity": null,`  
> `"width": null`  
> `}`  
> `},`  
> `"normal": {`  
> `"fill": {`  
> `"color": "",`  
> `"opacity": null`  
> `},`  
> `"stroke": {`  
> `"color": "",`  
> `"dashArray": null,`  
> `"opacity": null,`  
> `"width": null`  
> `}`  
> `},`  
> `"selected": {`  
> `"fill": {`  
> `"color": "",`  
> `"opacity": null`  
> `},`  
> `"stroke": {`  
> `"color": "",`  
> `"dashArray": null,`  
> `"opacity": null,`  
> `"width": null`  
> `}`  
> `}`  
> `}`  
> `}`  
> `],`  
> `"interpolation": "curveLinear",`  
> `"radius": 2,`  
> `"series": "HighlightRange",`  
> `"stack": false,`  
> `"type": "area",`  
> `"visible": true`  
> `}`  
> `]`  
> `}`  
> `],`  
> `"series": [`  
> `{`  
> `"data": [`  
> `{`  
> `"Pressure": 12,`  
> `"Temperature": 52,`  
> `"time": 1560469431423`  
> `},`  
> `{`  
> `"Pressure": 42,`  
> `"Temperature": 18,`  
> `"time": 1560469432423`  
> `},`  
> `{`  
> `"Pressure": 81,`  
> `"Temperature": 26,`  
> `"time": 1560469433423`  
> `},`  
> `{`  
> `"Pressure": 11,`  
> `"Temperature": 63,`  
> `"time": 1560469434423`  
> `},`  
> `{`  
> `"Pressure": 23,`  
> `"Temperature": 65,`  
> `"time": 1560469435423`  
> `},`  
> `{`  
> `"Pressure": 43,`  
> `"Temperature": 12,`  
> `"time": 1560469436423`  
> `},`  
> `{`  
> `"Pressure": 71,`  
> `"Temperature": 61,`  
> `"time": 1560469437423`  
> `},`  
> `{`  
> `"Pressure": 89,`  
> `"Temperature": 60,`  
> `"time": 1560469438423`  
> `},`  
> `{`  
> `"Pressure": 66,`  
> `"Temperature": 58,`  
> `"time": 1560469439423`  
> `},`  
> `{`  
> `"Pressure": 33,`  
> `"Temperature": 1,`  
> `"time": 1560469440423`  
> `}`  
> `],`  
> `"name": "Boiler"`  
> `},`  
> `{`  
> `"data": [`  
> `{`  
> `"x": 1560469432423,`  
> `"y": 1`  
> `},`  
> `{`  
> `"x": 1560469435423,`  
> `"y": 1`  
> `}`  
> `],`  
> `"name": "HighlightRange"`  
> `}`  
> `],`  
> `"timeAxis": {`  
> `"grid": {`  
> `"color": "red"`  
> `},`  
> `"tickCount": 1`  
> `}`  
> `},`  
> `"type": "ia.chart.timeseries"`  
> `}`  
> `],`  
> `"meta": {`  
> `"name": "root"`  
> `},`  
> `"props": {`  
> `"direction": "column"`  
> `},`  
> `"type": "ia.container.flex"`  
> `}`  
> `}`

---

<div class="post-metadata">

**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 3, 2025, 1:37pm UTC](https://forum.inductiveautomation.com/t/time-series-chart-markers/110337/5 "2025-09-03T13:37:34Z")

</div>

Thanks! This may be a viable work around. But I may have to fall back to ApexCharts to obtain a vertical marker. I feel there is something lacking in this component which IA may want to fix because it seems like a vertical marker should be possible.
