Analog Indicators

An indicator is a panel object that allows you to represent a numerical value, which usually varies between a minimum and a maximum.
There are two types of indicators:
the "analog bars" and the "analog gauges". 


http://www.miupanel.com/Portals/0/custom_images/analog%20bars.png 
 
http://www.miupanel.com/Portals/0/custom_images/IndicatorDials.png?timestamp=1442147973246
Example of analog bars Example of analog gauge

The two types of indicators have different syntax for their definition and usage, so each type will be described below separately.

 

1. Object Definition


  • Syntax of the ANALOG BAR


An analog bar can be added to the panel using the following syntax:

A ID [type] [stylers] [events] : min : level: max : [internal_style];

Field between [ ] are optional.

The following table describes in detail the meaning of each field:

 
Field Lenght Description
Values
A
1 char
Char used to identify the object indicator.
A
ID 1 char
Unique ID to identify each indicator on the panel.
This field can be a decimal digit.
You can define up to 10 indicators (bars + gauges) on each panel screen.

(0,9)
[type] 1 char
Leave this field empty or specify type="B" for the type analog bar.
B
[stylers] variable One or more stylers that define the graphical appearance of this object (such as, size, position, opacity, border, background, ...).
The style "f" permits to display the numerical value of the level on the bar.
Can be specified in succession more styles.
Some stylers may not take effect because meaningless for this object.
see stylers
[events]
One or more event specifiers
see events
min
variable
Minimum value (empty level).
]-∞,max[
level
 variable
Initial depicted level; in the range [min,max]. Can be a decimal number (es: 12.3456) [min,max]
max
variable
Maximum value (full scale value)
]min, +∞[
 [internal_style] 
 variable
Internal style of the 'filled' portion of the bar.
More stylers can be specified. 

   

Examples:


Analog BAR: example n.1

Target:

Panel with an analog bar. Range of (0,100) and bar level of 50.
Level value depicted.




Syntax:

object: A

ID: 1

type: -

[stylers]: !888

min: 0

level: 50

max: 100

[internal_style]: -

Message:

A1f!888:0:50:100;

 

     

Analog BAR: example n. 2

Target:

Panel with an analog bar. Rounded border with thickness 10, default color.

Text aligned to the right. Range (0,100) and initial bar level set to 60. Background color: white with a gray nuance. Inner bar color: red with a gray nuance.



Syntax:

object: A

ID: 1

type: -

[stylers]:
-10r30 !FFF,DDD>

min: 0

level: 60

max: 100

[internal_style]: !F00,555

Message:

A1-10r30!FFF,DDD
>:0:60:100:!F00,555;


 

Analog BAR: example n. 3

Target:

Horizontal Panel with an horizontal bar rotated by -90 degrees (padding and offset styles will be needed to relocate the bar). Dimensions of 80, rounded border, background color (white with a yellow nuance). Shadow: no diagonal offset, color white, blur 20 point. Full bar color: blue with a white nuance.
Level value not displayed.


 

 

Syntax:

object: A

ID: 1

[type]: -

[stylers]:

d,50a-90p10r30
!FFF,FF8h0,FFF,20fn


min : 0

level: 50

max: 100

[internal_style]:

!88F,00F#FFF;

Message:

A1d,50a-90p10r30
!FFF,FF8h0,FFF,20fn
:0:50:100:!88F,00F#FFF;


 

 

  • Syntax of the ANALOG GAUGE

An analog gauge can be added to the panel using the following syntax:

A ID type
[style]
[event]
: image_back : image_index : index_angle  [: index_style] [: offset] [: k] ;

The following table describes in detail the meaning of each field:

  
Field Lenght Description
Values
A
1 char
Char used to identify the object analog bar.
A
ID 1 char
Unique ID to identify each indicator on the panel.
This field can be a decimal digit.
You can define up to 10 indicators (bars + gauges) on each panel screen.
(0,9)
type 1 char
Use Type = 'G' to specify the analog gauge.
G
[stylers] variable One or more stylers that define the graphical appearance of this object (such as, size, position, opacity, border, background, ...).
Can be specified in succession more styles.
Some stylers may not take effect because meaningless for this object.
see stylers
[events]
One or more event specifiers
see events
image_back
variable
Number of the image used as background (es. the dial image '5.10').
see image gallery
image_index
variable
Number of the image used as index for the gauge. This image can be rotated around its center. (es. the index image '5.11')
see image gallery
index_angle
variable
Initial rotation of the image used as index. Can be a decimal number (es: 12.35 degree) [0,360]
[index_style]
variable
Optional. One or more style for the index image.
see stylers
[offset]
variable

Usign an "offset" and the coefficient "k" is possible to align the rotation of the index image to the graduated gauge of a dial. The formula is:

index rotation = offset + K (index_angle)

[0,360]
[K]
variable
any number

   

GAUGE Examples:


Analog GAUGE: example n.1

Target:

Panel with an analog gauge composed from image n. 5.20 as background and the image 5.21 as dial.
No initial ratation (0°).
Default position and size.

Syntax:

object: A

ID: 0

type: G

image_back: 5.20

image_index: 5.21

index_angle: 0

Message:

A0G:5.20:5.21:0;
http://www.miupanel.com/Portals/0/custom_images/gauge1.PNG

   

 

Analog GAUGE: example n. 2

Target:

Panel with an analog gauge composed from the image 5.22 as dial and 5.23 as index.

Rotation of index adapted with the graduated gauge of the dial in order to have 1:1 correspondence (i.e. with an index_angle = 300 the index will align with the level of  300 of graduated gauge).



Syntax:

object: A

ID: 0

type: G

image_back: 5.22

image_index: 5.23

index_angle: 300

index_style: -

offset: 0

K: 0.45

 

Message:

A0G:5.22:5.23:300::0:0.45;

http://www.miupanel.com/Portals/0/custom_images/gauge_es2.PNG

 

 

  

2. Object usage



  • Update the analog bar level (Controller --> WiFi Module --> Panel screen)  

Syntax

#
A ID : value

Examples

  • Update the analog bar having ID=1 with a level value of '55':  #A1:55
  • Rotare the index of the analog gauge having ID=1 with a value of '55':  #A1:55

Note:

The level should be inside the range [min,max] that you have decided for the analog bar during the panel definition.

To interact with the object in the panel, the object has to be previously created during the panel definition step.

 

  • Events (Panel screen --> WiFi Module --> controller)

Read the events section to learn how to enable and manage the events.