# Circular State indicator **URL:** \ **Category:** Ignition\ **Tags:** ignition81\ **Created:** [December 15, 2021, 9:44pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169 "2021-12-15T21:44:16Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![mandeep\_gill](https://avatars.discourse-cdn.com/v4/letter/m/919ad9/32.png) [@mandeep\_gill](https://forum.inductiveautomation.com/u/mandeep_gill)\ **Post date:** [December 15, 2021, 9:44pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/1 "2021-12-15T21:44:16Z")
Hi I am trying to create a Circular indicator for Pivot display. Following is what i want to achieve: 1. Circular or configurable circle ( 180deg or 270deg or 360 deg) to display the pivot actual boundary. color animation to display the sprayed area. 2. Line or something similar to display the current position of the pivot arm.( it is coming as Angle from the PLC which is 0-360deg) It has to move from center point along above circle. 3. Arrow indicating which way pivot is moving forward or reverse direction. i will see if i can attach pictures of our other SCADA which is reflecting this functionality. ![Irrigration Pic1](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/3/13360c51327f381946d8f8cdfee0b0f98a19c66a.jpeg) ![Irrigration Pic2](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/0/5027d21d1f8901a1f8cfd9d57503f6dad7483a18.jpeg) ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [December 15, 2021, 9:48pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/2 "2021-12-15T21:48:05Z")
You didn’t specify _Vision_ or _Perspective_. Perspective’s simple gauge should be able to do what you want for the circle. Vision’s gauge should also be suitable when you turn off some of the options. The arrow you’ll have to create, position where you want it and move the pivot to the centre of the gauge. ---
**Author:** ![mandeep\_gill](https://avatars.discourse-cdn.com/v4/letter/m/919ad9/32.png) [@mandeep\_gill](https://forum.inductiveautomation.com/u/mandeep_gill)\ **Post date:** [December 15, 2021, 9:49pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/3 "2021-12-15T21:49:19Z")
I am currently developing in ignition Vision 8.1 I looked at Gauges or pi indicator… But there could be instance where arm carry on moving without spray which become trick for Pi and gauge indicator. ---
**Author:** ![mandeep\_gill](https://avatars.discourse-cdn.com/v4/letter/m/919ad9/32.png) [@mandeep\_gill](https://forum.inductiveautomation.com/u/mandeep_gill)\ **Post date:** [December 15, 2021, 9:56pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/4 "2021-12-15T21:56:57Z")
Is there any examples or documentation which can be referred ? ---
**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\ **Post date:** [December 15, 2021, 10:37pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/5 "2021-12-15T22:37:27Z")
> [@mandeep\_gill](#): > > Is there any examples or documentation which can be referred ? Did you try the [Vision - Meter](https://docs.inductiveautomation.com/display/DOC80/Vision+-+Meter) page in the manual? ---
**Author:** ![mandeep\_gill](https://avatars.discourse-cdn.com/v4/letter/m/919ad9/32.png) [@mandeep\_gill](https://forum.inductiveautomation.com/u/mandeep_gill)\ **Post date:** [December 15, 2021, 10:46pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/6 "2021-12-15T22:46:53Z")
Yes, i have tried combining Meter and Pi chart. Both of this can give you basic functionality but doesn’t indicate the spray status( Which area is sprayed and which is not) which have to be combination of Digital signal(Spray ON/Off) and Analogue signal ( Angle in degree). Arrow indication is other one which unable to find how to do this… ---
**Author:** ![zacht](https://avatars.discourse-cdn.com/v4/letter/z/ea5d25/32.png) [@zacht](https://forum.inductiveautomation.com/u/zacht)\ **Post date:** [December 15, 2021, 11:46pm UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/7 "2021-12-15T23:46:17Z")
It looks like something you could do with the [Paintable Canvas](https://docs.inductiveautomation.com/display/DOC81/Vision+-+Paintable+Canvas). ---
**Author:** ![alexraymond](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alexraymond/32/16951_2.png) [@alexraymond](https://forum.inductiveautomation.com/u/alexraymond)\ **Post date:** [December 16, 2021, 12:10am UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/8 "2021-12-16T00:10:53Z")
I programmed a paintable canvas to do this. Didn’t have time to do an arrow. Here you go: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/4/7430904fb94118724f0a7b5e6ce574884650ce18.jpeg) Paste this code into a paintable canvas repaint script and then setup the custom properties to match. ```auto from java.awt import Color from java.awt import BasicStroke from java.awt.geom import Rectangle2D import math g = event.graphics armAngle = event.source.armAngle circleStartAngle = event.source.boundaryStartAngle circleArcSize = event.source.boundaryArcSize rotation = event.source.rotationAdjustment clockwise = event.source.degreesDirectionCW diameter = min([event.width,event.height]) dx = event.width - diameter dy = event.height - diameter area = Rectangle2D.Float(0+dx/2.,0+dy/2.,diameter,diameter) if clockwise: c1_startAngle = -(circleStartAngle + rotation) c1_arcAngle = -(armAngle-circleStartAngle) c2_startAngle = -circleStartAngle-(armAngle-circleStartAngle)-rotation c2_arcAngle = -(circleArcSize-(armAngle-circleStartAngle)) theta = -circleStartAngle-(armAngle-circleStartAngle)-rotation else: c1_startAngle = circleStartAngle + rotation c1_arcAngle = armAngle-circleStartAngle c2_startAngle = circleStartAngle+armAngle-circleStartAngle + rotation c2_arcAngle = circleArcSize-(armAngle-circleStartAngle) theta = circleStartAngle+armAngle-circleStartAngle + rotation # Draw Arcs g.setColor(event.source.primaryColor) g.fillArc(int(area.x), int(area.y), int(area.width), int(area.height), int(c1_startAngle), int(c1_arcAngle)) g.setColor(event.source.secondaryColor) g.fillArc(int(area.x), int(area.y), int(area.width), int(area.height), int(c2_startAngle), int(c2_arcAngle)) # Draw Arm centerX = event.width/2. centerY = event.height/2. x = centerX + diameter/2. * math.cos(-theta * math.pi / 180.0) y = centerY + diameter/2. * math.sin(-theta * math.pi / 180.0) g.setStroke(BasicStroke(diameter*0.01,BasicStroke.CAP_ROUND, BasicStroke.JOIN_MITER)) g.setColor(event.source.armColor) g.drawLine(int(centerX),int(centerY), int(x), int(y)) ``` Custom Properties: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/1/e1ba1cc96073d6c110346078c5f665d0481b3865.png) ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/c/6c3e3a3c274429e3c4d478bbc18b83dd95ede861.png) ---
**Author:** ![mandeep\_gill](https://avatars.discourse-cdn.com/v4/letter/m/919ad9/32.png) [@mandeep\_gill](https://forum.inductiveautomation.com/u/mandeep_gill)\ **Post date:** [December 16, 2021, 1:23am UTC](https://forum.inductiveautomation.com/t/circular-state-indicator/54169/9 "2021-12-16T01:23:11Z")
Hi alexraymond, Thanks a lot… This has saved me lot of time to invent the wheel… Thanks Again.