# SVG Export format to have nested groups, paths, circles, svgs and polygons in the designer

**URL:** <https://forum.inductiveautomation.com/t/svg-export-format-to-have-nested-groups-paths-circles-svgs-and-polygons-in-the-designer/60641>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [June 10, 2022, 9:54pm UTC](https://forum.inductiveautomation.com/t/svg-export-format-to-have-nested-groups-paths-circles-svgs-and-polygons-in-the-designer/60641 "2022-06-10T21:54:39Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![lrose](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lrose/32/62724_2.png) [@lrose](https://forum.inductiveautomation.com/u/lrose)\
**Post date:** [December 7, 2023, 4:37am UTC](https://forum.inductiveautomation.com/t/svg-export-format-to-have-nested-groups-paths-circles-svgs-and-polygons-in-the-designer/60641/3 "2023-12-07T04:37:59Z")

</div>

The image shown above is from an early version of the Perspective module that, as far as I know, was never released publicly.

However, you can do a lot with SVG's with a little know how, here are some links:

> [@Drawing Tools in perspective](https://forum.inductiveautomation.com/t/drawing-tools-in-perspective/51407/3):
>
> SVG’s are the way to do it (they aren’t the only way to do it, but they are probably the best way). You can copy this into a text file, save it as a .svg file and then drag it onto your view, this will give you a blank SVG. \<?xml version="1.0" encoding="UTF-8" standalone="no"?\> \<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="50mm" height="50mm" viewBox="0 0 50 50" version="1.1"\> \</svg\> From there it is just a matter of understanding how to wor…

> [@Perspective, faster page](https://forum.inductiveautomation.com/t/perspective-faster-page/69885/35):
>
> Okay, I had a bit of free time today, so here is a complete SVG solution. You could do the Label as SVG text as well, or a gauge needle if you wanted, I haven't gone that far. Just a little example of the power of using the Ignition Designer to add SVG elements. I didn't include the label for the example. Note: All of this (outside of the calculations needed to find the points for the shape) was done inside of the designer (yes I can be somewhat of a masochist at times. rofl). First a s…

> [@How to add animation by HTML/CSS scripts in Perspective?](https://forum.inductiveautomation.com/t/how-to-add-animation-by-html-css-scripts-in-perspective/75523/14):
>
> Okay, so it took me longer than I wanted (my laptop died), but I finally did get around to completing this, and I have to say I'm pretty pleased with the result. This was a fun exercise and I learned something good along the way. I will give you a disclaimer though, other than a rough idea of what an Azimuth Propeller is, I don't know much else. So for instance, I have no idea what the yellow triangle is supposed to indicate and so I didn't add it. I made some assumptions on how I think the re…

> [@Perspective - Font Scaling with SVG?](https://forum.inductiveautomation.com/t/perspective-font-scaling-with-svg/74584/3):
>
> It also opens up other interesting functionality. Or even fancier! Yep, just add the fontSize value to the style object. Since all of this is done in the designer, all of it is able to be bound. [svgtext] Here I created a second text path and I'm using the following expression binding to switch between the two. Wouldn't really recommend doing this with text, but just because it was fun and it can be done. if((toMillis(now(75)) % 75) \>= 37,'#testPath','#testPath2')

---

_[View the full topic](https://forum.inductiveautomation.com/t/svg-export-format-to-have-nested-groups-paths-circles-svgs-and-polygons-in-the-designer/60641)._
