Visualizing Dynamic Mover Movement

Ignition
, ,
1

I am working on a project where I need to visualize the movement of a machine's "nests"/movers (representative elements) through a series of stations in a manufacturing process. Since the machines are very old, there is no (cheap/fast) way to do so, however I have a system that tracks and updates the positions of the 104 nests, based on the change of the machine cycle.
I have a tag array [1...104] and after every cycle change I move them up 1 number

This is how it looks like:
[video-to-gif output image]

for it I am using a coordinate container with labels called mover_0 to mover_104 (for now up to 52) to show the current mover at every "position" in the transport belt.
I have a tag bind:

basePath+'/'+{view.params.MC_name}+'/MC_'+{view.params.MC_num}+'/'+{view.params.lineName}+'/BDE/nests/ar_n_NestPosition['+split({this.meta.name},'_')[1,0]+']'

e.g:

[
  {
    "type": "ia.display.label",
    "version": 0,
    "props": {
      "style": {
        "borderBottomLeftRadius": 25,
        "borderBottomRightRadius": 25,
        "borderColor": "#E5E5E5",
        "borderStyle": "outset",
        "borderTopLeftRadius": 25,
        "borderTopRightRadius": 25,
        "borderWidth": 2,
        "fontWeight": "bold",
        "outlineStyle": "none",
        "textAlign": "center",
        "transform": "scale(1)",
        "transition": "background-color 0.1s linear, transform 0.1s linear, opacity 0.1s linear"
      }
    },
    "meta": {
      "name": "mover_0"
    },
    "position": {
      "x": 57.53125,
      "y": 62,
      "height": 49,
      "width": 96.38999999999999
    },
    "custom": {},
    "propConfig": {
      "props.style.backgroundColor": {
        "binding": {
          "config": {
            "path": "this.props.text"
          },
          "transforms": [
            {
              "code": "\treturn 'red' if int(value) in self.view.custom.badNests else '#D2D2D2'",
              "type": "script"
            }
          ],
          "type": "property"
        }
      },
      "props.text": {
        "binding": {
          "type": "tag",
          "config": {
            "mode": "expression",
            "tagPath": basePath+'/'+{view.params.MC_name}+'/MC_'+{view.params.MC_num}+'/'+{view.params.lineName}+'/BDE/nests/ar_n_NestPosition['+split({this.meta.name},'_')[1,0]+']'",
            "fallbackDelay": 2.5
          }
        }
      }
    }
  }
]

how else can I achieve this and represent the movers so that I don't have to manually arrange them? I tried looking into SVG/canvas but did not find much of a solution.

They should be arranged in a sort of oval shape like:

image
image934×480 22.6 KB

just for reference, I have this tag change script on the machine cycle tag:

def valueChanged(tag, tagPath, previousValue, currentValue, initialChange, missedEvents):
	def shift_nest_positions(nest_positions):
		return  [nest_positions[-1]] + list(nest_positions[:-1])

	path = "[.]ar_n_NestPosition"
	current_positions = system.tag.readBlocking([path])[0].value
	

	new_positions = shift_nest_positions(current_positions)
	

	#new_positions = range(1,105)	#reset positions
	system.tag.writeBlocking([path], [new_positions])

Thanks in advance

2

Probably hacky, but the only thing that popped into my head was using four separate flex repeaters, like a dock. This wouldn't be oval, rather rectangle.

Edit, what did you try on the view canvas?
https://docs.inductiveautomation.com/display/DOC81/Perspective+-+View+Canvas

1 Like
3

I guess that is one way to go

So far I have not tried the view canvas, I was looking for something I could embed.

I had in mind playing with the coordinates of the label with some sort of function

import math
for i in range(n):
    angle = 2 * 3.14 * i / n
    x = centerX + radiusX * math.cos(angle)
    y = centerY + radiusY * math.sin(angle)

to place them along the perimeter of an oval, but it does not seem very efficient nor professional

4

Are you suggesting you can't embed a view canvas?

What were you referring to when you said SVG/canvas? I assumed you meant view canvas.

By the way, are the physical machines arranged in an oval just as you referenced?