[00:00] When importing images into Ignition it's recommended to import svgs or scalable vector graphics. The reason being as the name suggests they're scalable. In this lesson, I'll show you how to import an SVG into a Vision project and how to easily manipulate them to fit your needs. To easily import an SVG into your project you can use this Symbol Factory module, which is a library of high quality industrial vector graphics that come included with the Vision and Perspective modules. Symbol Factory can be accessed via the tools menu in your designer. I'll find a motor symbol that I like and I can simply drag it onto my window to use it. If I click and drag the arrows around the image, you can see that it resizes gracefully and continues to look crisp after doing so unlike a JPEG or PNG that will start to look pixelated. This is beneficial if you have multiple screen sizes, as you can ensure that your image quality will be retained no matter where it's viewed. When you import an SVG, you can see in the project browser that it's actually a group of components.

[01:06] If I expand the group we can take a look at the components that make it up. I can choose to color individual parts of the image or even animate them if I want. If I ungroup the motor I can move or remove pieces as well. If you can't find the graphic that you need in Symbol Factory, you can import your own SVGs that are created outside of ignition. You can even take AutoCAD drawings and Export them as SVGs using certain utility programs. I have an SVG on my local machine that I can import by simply dragging it onto my window and you can see that I can manipulate it in the same way. Using SVGs in Ignition is very simple and they can be colored animated or scaled to your desired size.