Perspective: drawing lines and polygons

Ignition
,
1

Hi, I need to programmatically draw some lines and polygons in Ignition Perspective: any suggestion?

2

You can use the label component's borders to create

  • rectangles (easy)
  • squares (easy)
  • circles (create a square and set the border radii to 50%)
  • line (set the height to 1 or whatever your line thickness is)
  • triangles (if I remember correctly, set the border to 50% and turn on only one side)

Lines and polys

I've never done it but you can try creating a view with a label in it and parameters to control the appearance.
Then use the View Canvas component to load multiple instances of the view and move them to the desired locations.

3

You are better of just creating an svg.

Well you can use polygon if its only straight lines

if you need bends you will need paths, which is a bit harder

you can acces the svg element component by dragging in something from the symbol factory

1 Like
4

Typically drawings are best done as embedded SVGs. I use Inkscape to draw the SVGs and then I selected the "embedded" option when I drag drop the SVG into Ignition.

NOTE: You get better performance if you save the SVG as "optimized SVG" file type.

If you're just doing boxes, circles or lines you can always use borders on labels. To draw a circle you just set the border radius to 100%. People have varying opinions on this method. The performance is about the same as an SVG and you can add text to it fairly easily because it's a label. I personally feel like labels are a cleaner implementation in a lot of situations (not all).

I would recommend using SVGs if you're drawing devices or other complicated things.

5

Thanks all for your suggestions. Unfortunately they don't fit my use case: I'll get a set of coordinates from the database, on which set I will have to draw polylines on a map of the customer factory. XY chart could be an option. One other way I'm considering is a site where I draw polyline on a canvas with a javascript drawing library, site that will be loaded into an IFrame component, served by the Ignition Webdev module (WebDev is a must to avoid cross origin issues, if I used node to base the external site).
I was told that Ignition 8.3 should bring more drawing functions (anything like system.perspective.drawPolyline(...) would be perfect), but no one knows what will come actually and when.
Regards

6

Consider dynamically generating the props.elements of an embedded SVG.

7

Thanks @pturmel ,I'll give it a try!

8

Also, consider that props.elements for a SVG can be bound to a document tag (just as props.instances for a view canvas can be bound to a document tag).

1 Like