You can help by commenting or suggesting your edit directly into the transcript. We'll review any changes before posting them. All comments are completely anonymous. For any comments that need a reply, consider emailing training@inductiveautomation.com.
Version:
LESSON LIST
-
2:16Color SVG Dynamically
-
3:08Tint SVG
-
2:01Tank Cutaway
-
3:37Component Animation
Take Topic Challenge
LESSON
Tank Cutaway
Description
Learn how to cut out a shape on a tank (SVG) and use a level indicator to create a custom tank.
Video recorded using: Ignition 7.7
Transcript
(open in window)[00:00] Another useful technique with Vector graphics and Ignition, is to cut out a shape from a graphic. There's a common technique to use the tanks. You now know every tank looks like the one have we under our Component panel here under Display, The cylindrical tank. Most of them look like the ones we have in Symbol Factory. If you go to tools, Symbol Factory, and go to my Tanks category, there's a whole slew of them here that we can work with. Let's say our tank looks like this one right here. And what I want to do is have the exact same functionality as the cylindrical tank, in that I can drag a tag onto it so I can see the actual level. Now there is no level property for this graphic, so what we want to do is actually cut out a shape from the graphic, so we can see through to a level indicator that's behind it. Let's do that technique. The first thing I want to do is create the shape I'm going to cut away from the graphic. I'm going to go up here to Tools, Symbol Factory. On the Basic, there's a category called Tank Cutaways, that I can use. There's a whole bunch of cutaways that we can work with. You can also draw your own using the Drawing Tools. Let's say I want to do this first one here, I'ma drag it into the window, and place it right on top, where I want to do the cutaway. And then what we need to do is actually then select the tank first, the hold down Ctrl and select the cutaway second. But it's like in the cutaway second, because we're going to subtract that from the first shape. Once we do that, we're going to go up here to Shape, and we're going to select Difference. That will cut out that shape from the first graphic. As you can see, there's now a cutaway piece. That piece is transparent, so I can do, is put the Level Indicator on my window, put it right, make it the same size as that cutaway; drag my Tag onto it, as you see there's a level. And the only problem is right now, it's on top of the tank. Let's go ahead and click on this, and go up to the Toolbar up here, and move it to the bottom. We can also go up here to Alignment, and say Move to Back or press End. I move it to the back, you'll see it's behind my tank graphic, and now I have a tank, that looks like the one in my factory. I can select both of these graphics, I can right click and Group them so now they can move around as one unit. And in fact, you can make a template out of that, so you can use it many times.