# Display circular/spiral graph in Perspective

**URL:** <https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [April 22, 2021, 2:41pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911 "2021-04-22T14:41:31Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![DougSN](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@DougSN](https://forum.inductiveautomation.com/u/DougSN)\
**Post date:** [April 22, 2021, 2:41pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/1 "2021-04-22T14:41:31Z")

</div>

I have a client that wants to be able to display the movement of an object on a graph like this in Perspective:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/c/7c2e0c0f90075893a1fac3043d8e299e66177e62.png)

The path would be based on recorded data, as well as the current location of the circle indicator. I have used charts plenty of times where the data is plotted against a time axis, but I haven’t done something where X and Y axes represent a physical plane. Do you have ideas or examples where this has been done?

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [April 22, 2021, 3:35pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/2 "2021-04-22T15:35:50Z")

</div>

It's not the same problem, by any means, but I would probably approach this by generating an SVG, using a method _broadly_ similar to the one in this post:

> [@Reading values from database and converting it using python](http://forum.inductiveautomation.com/t/reading-values-from-database-and-converting-it-using-python/44508/11):
>
> Easysvg is a nice little wrapper to make svg files. Unzip and put in the gateway’s user-lib/pylib/site-packages folder. [easysvg.zip](https://forum.inductiveautomation.com/uploads/short-url/wY51CE88Fu5FMMVecxJajTF2wx2.zip) (6.7 KB) View attached using the csv data posted. The SVG can be converted to base64 to display in an image component. [heatmap\_test.zip](https://forum.inductiveautomation.com/uploads/short-url/DNp1RjLC9yUNKbbFzdiZdg5LHc.zip) (76.0 KB) Script: import easysvg import base64 class heatPalette: ''' Calculate the RGB value of a point on a gradient. Usage: heatPalette(minval, maxval, [colors]) minval - minimun value to sca…

---

<div class="post-metadata">

**Author:** ![Adriaan.leRoux](https://avatars.discourse-cdn.com/v4/letter/a/bbce88/32.png) [@Adriaan.leRoux](https://forum.inductiveautomation.com/u/Adriaan.leRoux)\
**Post date:** [April 23, 2021, 8:23pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/3 "2021-04-23T20:23:40Z")

</div>

You can donit with a normal XY chart

---

<div class="post-metadata">

**Author:** ![DougSN](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@DougSN](https://forum.inductiveautomation.com/u/DougSN)\
**Post date:** [April 27, 2021, 7:19pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/4 "2021-04-27T19:19:49Z")

</div>

Looking at the XY Chart, I don’t see any options that would allow a spiral graph like this. Could you help me get one step further?

---

<div class="post-metadata">

**Author:** ![Adriaan.leRoux](https://avatars.discourse-cdn.com/v4/letter/a/bbce88/32.png) [@Adriaan.leRoux](https://forum.inductiveautomation.com/u/Adriaan.leRoux)\
**Post date:** [April 28, 2021, 4:39am UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/5 "2021-04-28T04:39:11Z")

</div>

Right so what you do is treat it like you would a normal time series chart, but with two variables instead of one variable against time. Does that make sense? you plot your points with a X and Y coordinate

---

<div class="post-metadata">

**Author:** ![DougSN](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@DougSN](https://forum.inductiveautomation.com/u/DougSN)\
**Post date:** [April 28, 2021, 8:12pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/6 "2021-04-28T20:12:57Z")

</div>

I understand what you mean in theory, thanks for explaining it. I have been trying to get this to work with an XY chart for a while now and I just can’t seem to do it. I tried it with the timestamp as one column of the dataset and a tuple of values like (1,2) as the other column, and I also tried it with a timestamp column and separate X and Y columns. I’m not sure how having an X and Y column without a timestamp would produce the chart I’m looking for, but I’m certainly happy to hear more tips on this method!

---

<div class="post-metadata">

**Author:** ![DougSN](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@DougSN](https://forum.inductiveautomation.com/u/DougSN)\
**Post date:** [April 28, 2021, 9:06pm UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/7 "2021-04-28T21:06:46Z")

</div>

I was able to get it to work as a proof of concept at least, without a timestamp column. I just queried two columns with x and y data, and then changed the configuration on the X axis “render” property to value instead of date.

This is the query I used to form a poor quality circle, and a screenshot of the result. With more datapoints, I believe I could make the spiral above.

```auto
SELECT *
FROM (
	VALUES 
		(0, -1), (.25,-.9), (.5, -.7), (.9, -.25), (1, 0), 
		(.9, .25), (.5, .7), (.25, .9), (0, 1), (-.25, .9), 
		(-.5, .7), (-.9, .25), (-1, 0), (-.9, -.25), (-.5, -.7), 
		(-.25, -.9), (0, -1)
	) AS a(x, y)

```

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/4/e46d214c404739ff75761c8ed02cb5619113e86d.png)

---

<div class="post-metadata">

**Author:** ![Adriaan.leRoux](https://avatars.discourse-cdn.com/v4/letter/a/bbce88/32.png) [@Adriaan.leRoux](https://forum.inductiveautomation.com/u/Adriaan.leRoux)\
**Post date:** [April 29, 2021, 5:46am UTC](https://forum.inductiveautomation.com/t/display-circular-spiral-graph-in-perspective/45911/8 "2021-04-29T05:46:58Z")

</div>

There you go, see it as coordinates to draw something. If you have X as your timestamp you will have a normal time series chart because Y is always plotted to time
