# Coordinating Zoom on Time Series Chart

**URL:** <https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384>\
**Category:** Ignition\
**Tags:** ignition80\
**Created:** [February 18, 2020, 4:28pm UTC](https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384 "2020-02-18T16:28:06Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![jgardner](https://avatars.discourse-cdn.com/v4/letter/j/a587f6/32.png) [@jgardner](https://forum.inductiveautomation.com/u/jgardner)\
**Post date:** [February 18, 2020, 4:28pm UTC](https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384/1 "2020-02-18T16:28:06Z")

</div>

I have two Time Series Charts on one view. Is there a way to coordinate the Zoom / Pan action between them? I have Temperature (with lower / upper bounds) as well as Humidity (with bounds) and it would be great if zooming on the Temp chart also zoomed the Humidity chart. Thank you.

---

<div class="post-metadata">

**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\
**Post date:** [February 18, 2020, 5:22pm UTC](https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384/2 "2020-02-18T17:22:19Z")

</div>

Hi @jgardner, the best way to accomplish that would be to plot the temp and humidity as separate plots on the same chart. This will allow the data to be visually separate, but the zoom action will apply to both data plots.

---

<div class="post-metadata">

**Author:** ![jgardner](https://avatars.discourse-cdn.com/v4/letter/j/a587f6/32.png) [@jgardner](https://forum.inductiveautomation.com/u/jgardner)\
**Post date:** [February 18, 2020, 6:18pm UTC](https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384/3 "2020-02-18T18:18:10Z")

</div>

Thanks for the suggestion. I figured that would be the intended (elegant) solution. I thought it would be a bit muddy to read since both trends have their own upper / lower limit lines. You could color coordinate each limit to help readability. For background, here’s my current layout (complete with thermometers).

 ![Temp%20Hum](https://us1.discourse-cdn.com/inductiveautomation/original/2X/4/43b62c90640a8c705159df47cc8bee41167209e5.png)

---

<div class="post-metadata">

**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\
**Post date:** [February 18, 2020, 7:22pm UTC](https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384/4 "2020-02-18T19:22:59Z")

</div>

You’re right, that does get a little muddy with the current design. It would be the best way to keep the zoom levels in sync, though. Because zooming is driven by mouse/touch user actions, we allow those actions to fully control the state of the zoom; therefore, we don’t store zoom level as a property.

---

<div class="post-metadata">

**Author:** ![jgardner](https://avatars.discourse-cdn.com/v4/letter/j/a587f6/32.png) [@jgardner](https://forum.inductiveautomation.com/u/jgardner)\
**Post date:** [February 18, 2020, 7:44pm UTC](https://forum.inductiveautomation.com/t/coordinating-zoom-on-time-series-chart/32384/5 "2020-02-18T19:44:28Z")

</div>

@jball your suggestion was ultimately the solution to my problem. After a lot of learning and fiddling, I came up with the following:

- Two plots on the same chart
- Three Trends each plot (data / upper / lower)
- Each Trend bound to a named query w/ t\_stamp, data\_col
- Custom column for each Trend to assign pen color

I was hoping to be able to bind a multi-column named query right to the Series property and have it take each column as a series array element. Doesn’t look like that’s the case.

I appreciate the help!

 ![Temp%20Hum](https://us1.discourse-cdn.com/inductiveautomation/original/2X/7/790c95917190e19c53f12f3ebf246bd970b49a7e.png)
