Hi All,

How can we show the animation for a pipe turning green in color with regard to the active direction of flow and turning back to normal color grey when not an active direction of flow on a winCC unified system(V17-MTP)?

Is it possible? Please provide guidance/examples.

If not what are other alternatives?

See Attached.

There are a couple of parameters that probably need clarification.

Speed I set the value from 0 to 100. At 100 it will move as fast as possible, at zero it will not move.

LineWidth and DashWidth sets the line width and thickness in pixels.

Run starts the animation.

For now, you need to load and test all these changes in Runtime, because now it looks different in the development environment. I don't know why it behaves like that.

And of course to see the animation you have to load it in Runtime and only in the browser it will be visible.

P.S. I had to pack it into an archive, the forum does not allow attaching a file with *.svghmi extension.

We handle PA in our systems where each section of the pipeline has an integer value representing its state:

1. State Representation: Each section between valves has a default "neutral" state when there's no active flow (grey). When a valve opens and flow starts from an upstream section, the state (which is an integer) gets passed to the downstream section. This integer corresponds to the type of flow, and from there, you can control the color of the pipe.

2. Valve Operations: Whenever a valve opens, it moves the integer value from the upstream section to the downstream, dynamically updating the pipe's state. The integer value tells us what type of source is flowing, and we use that to update the animation color of the pipe.

 I created a global function to translate the int state of the sections into colors on the HMI:

Properties Global Defs:

//Insert definitions for script dynamizations here
import * as utils from 'utils'

Properties script: 

export function DynamicSVG_17_Properties_BasicColor_Trigger(item) {
let value;
let pipe_state = Tags("SYSTEM_pa_common_pg_upw_post_VALVE01").Read();

value = utils.pipe_state_color(pipe_state);

return value;
}

Global script under utils:

export function pipe_state_color(int_state) {
let value;
switch (int_state) {
case 0:
// Neutral - Grey (no flow)
value = 0xFF808080;
break;
case 1:
// UPW (ultrapure water) - Green
value = 0xFF00FF00;
break;
case 2:
// Process Gas - Blue
value = 0xFF0000FF;
break;
case 4:
// Chemicals - Red
value = 0xFFFF0000;
break;
case 3:
// Combination of Process Gas + UPW - Cyan
value = 0xFF00FFFF;
break;
case 5:
// Chemicals + UPW - Yellow
value = 0xFF00FF00;
break;
case 7:
// All combined sources - White
value = 0xFFFFFF00;
break;
default:
// Fallback to Neutral (Grey)
value = 0xFF808080;
break;
}
return value;
}