⇨ Símbolos Gauge Design de telas Início

Símbolos Bar

São barras ou retângulos cuja altura é alterada em função do valor do registro de entrada ou saída ao qual estão associados. É um símbolo utilizado para representar valores do tipo analógico.

São úteis para situações como representar o nível de fluido de um tanque, um termômetro, uma barra de progresso, etc.

Estrutura

<svg> <g eq-symbol="{'type':'bar'}"> <!-- Conteúdo estático (opcional) --> <g eq-data="{'type':'bar', 'maxHeight':'300', 'minHeight':'10', 'maxValue' :'90', 'minValue' :'-30'}"> <!-- Outros elementos (opcional) --> <rect></rect> </g> </g> </svg>

O grupo principal do arquivo SVG do símbolo contém um atributo eq-symbol cujo valor é bar. Por meio desse atributo o sistema identifica todos os símbolos desse tipo incluídos na tela.

Dentro desse grupo encontramos o seguinte:

  • Grupo com atributo eq-data, que contém os seguintes elementos
    • <rect>: Mudará sua altura de acordo com o valor do registro associado; para isso o sistema utiliza o atributo height
    • Outros elementos: elementos acessórios que permitem, por exemplo, que o símbolo tenha aparência tridimensional. Mudarão sua posição vertical para acompanhar as variações de altura do <rect>
  • Conteúdo estático: Outros elementos gráficos que não mudam de aspecto em relação ao registro associado ao símbolo. Por exemplo, no caso de um tanque, será sua estrutura, seus suportes, uma escada lateral, etc. Ou seja, todos os elementos que não sejam o seu nível.

Parâmetros do atributo eq-data

Parâmetro Descrição
type Indica o tipo de símbolo, coincide com o indicado no grupo pai dentro do atributo " eq-symbol" com o parâmetro “type”.
maxHeight Este parâmetro determina a altura máxima em pixels que o retângulo poderá assumir. Se este parâmetro for omitido, será considerada como altura máxima a altura estática do <rect>, ou seja, a altura do elemento antes de começar a ser manipulado pelo sistema.
minHeight Este parâmetro determina a altura mínima em pixels que o <rect> poderá assumir. Se este parâmetro for omitido, será considerada zero.
maxValue Este parâmetro define o valor máximo em unidades de engenharia que o registro associado ao símbolo deveria ter. Por exemplo, se for um tanque em que o nível pode atingir no máximo uma altura de 10 metros, este valor deverá ser 10. Se este parâmetro for omitido, é considerado um percentual, assumindo como valor padrão cem.
minValue De forma semelhante, este parâmetro define o valor mínimo em unidades de engenharia que o registro associado ao símbolo deveria ter. Se este parâmetro for omitido, é considerado um percentual, assumindo como valor padrão zero.

Quando o sistema lê esses parâmetros do símbolo, toma a indicação do registro associado e realiza os seguintes cálculos:

Exemplo de tanque em três dimensões

Todos os seus elementos fazem parte de um grupo com atributo eq-symbol; alguns são estáticos, como os que podem ser vistos à esquerda da imagem. Outros são dinâmicos, como o <rect> e o <path> que fazem parte do grupo com atributo eq-data.

Neste último são definidos os parâmetros maxValue, minValue, maxHeight e minHeight. O <rect> dentro do grupo com atributo eq-data mudará de altura de acordo com o exposto anteriormente, e os outros elementos que o acompanham, neste caso um <path>, mudará de posição para se posicionar acima do <rect>.