# How are these svg components created in Perspective?

**URL:** <https://forum.inductiveautomation.com/t/how-are-these-svg-components-created-in-perspective/61011>\
**Category:** Ignition\
**Tags:** ignition80, perspective\
**Created:** [June 21, 2022, 2:13pm UTC](https://forum.inductiveautomation.com/t/how-are-these-svg-components-created-in-perspective/61011 "2022-06-21T14:13:04Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![liam1](https://avatars.discourse-cdn.com/v4/letter/l/e68b1a/32.png) [@liam1](https://forum.inductiveautomation.com/u/liam1)\
**Post date:** [June 21, 2022, 2:13pm UTC](https://forum.inductiveautomation.com/t/how-are-these-svg-components-created-in-perspective/61011/1 "2022-06-21T14:13:04Z")

</div>

Hi all

I found this svg component from the sample quick start project.

This component is made up of a type ` ia.container.drawing` and `ia.shapes.group`

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

Is it possible to create the structure natively in the designer or must this be made in JSON and then pasted in?

I prefer this structure compared to the standard element structure as it’s easier to create bindings to parts of the SVG.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [June 21, 2022, 2:46pm UTC](https://forum.inductiveautomation.com/t/how-are-these-svg-components-created-in-perspective/61011/2 "2022-06-21T14:46:01Z")

</div>

its from an older version  
its not really possible anymore

---

<div class="post-metadata">

**Author:** ![swolnisty](https://avatars.discourse-cdn.com/v4/letter/s/7bcc69/32.png) [@swolnisty](https://forum.inductiveautomation.com/u/swolnisty)\
**Post date:** [June 21, 2022, 7:35pm UTC](https://forum.inductiveautomation.com/t/how-are-these-svg-components-created-in-perspective/61011/3 "2022-06-21T19:35:56Z")

</div>

I think the caveat here is that it _is_ possible, but probably not worth the effort. You would need to copy the view’s JSON, manipulate outside of Ignition, then paste the JSON back into the view (assuming you have all of the syntax for everything correct) in order to have SVGs like the one you showed. The ONLY reason I can think of to do this is if you needed to have different event handlers trigger on select paths in the whole SVG.
