# Custom Style Time Series Chart

**URL:** <https://forum.inductiveautomation.com/t/custom-style-time-series-chart/108584>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [July 16, 2025, 9:35pm UTC](https://forum.inductiveautomation.com/t/custom-style-time-series-chart/108584 "2025-07-16T21:35:17Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![raees.khan](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/raees.khan/32/76218_2.png) [@raees.khan](https://forum.inductiveautomation.com/u/raees.khan)\
**Post date:** [July 16, 2025, 9:35pm UTC](https://forum.inductiveautomation.com/t/custom-style-time-series-chart/108584/1 "2025-07-16T21:35:17Z")

</div>

Hello IA Community:

I am currently creating a dashboard in ignition and would like to know how I can create a time series chart that looks like google's exchange rate chart like the image below

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/7/a78380362d50f847e275ae58b6a040e709c22bca.png)

For example if I have a tag for a transformer output power and I want to show the history in this style of a time series chart.

Thank you for your insights

---

<div class="post-metadata">

**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:** [July 16, 2025, 10:02pm UTC](https://forum.inductiveautomation.com/t/custom-style-time-series-chart/108584/2 "2025-07-16T22:02:35Z")

</div>

I would use a [Multi-State Button](https://www.docs.inductiveautomation.com/docs/8.1/appendix/components/perspective-components/perspective-input-palette/perspective-multistate-button) for the options up top. Bind its value to a custom view property, and create two other view properties, `startDate` and `endDate`, whose values adjust based on the selected button value. Use those to generate a [Tag History Binding](https://www.docs.inductiveautomation.com/docs/8.1/ignition-modules/perspective/working-with-perspective-components/bindings-in-perspective/tag-history-bindings-in-perspective) on a [TimeSeriesChart](https://www.docs.inductiveautomation.com/docs/8.1/appendix/components/perspective-components/perspective-chart-palette/perspective-time-series-chart).

Customizing it all to _look_ just like that is a matter of styling the various button and chart properties. I like that gradient fill, but that currently isn't available as an option (you can apply a solid fill with an overall given opacity).

---

<div class="post-metadata">

**Author:** ![josborn](https://avatars.discourse-cdn.com/v4/letter/j/4bbf92/32.png) [@josborn](https://forum.inductiveautomation.com/u/josborn)\
**Post date:** [July 16, 2025, 10:22pm UTC](https://forum.inductiveautomation.com/t/custom-style-time-series-chart/108584/3 "2025-07-16T22:22:52Z")

</div>

@bmusson has his Embr-Charts module that has some amazing looking charts, it may be possible you could do a gradient fill like your image.
