Cartão do medidor

De uma a seis leituras mostram números grandes com a faixa nomeada em palavras ao lado de um mostrador, barra, tanque ou formato de bateria, visível de longe. Preenche a tela, fica no meio, se encaixa em um canto como quadrado ou uma linha, e roda como faixa na borda. Você define de uma a seis leituras com uma escala, faixas nomeadas e um alvo opcional, escolhe formato radial, semicírculo, velocímetro, linear, bala, tanque ou bateria, escolhe se as faixas aparecem, decide se o número ou a faixa lidera uma leitura única, e escolhe sempre mostrar ou só para aviso, perigo ou leituras ausentes.

Cartão ao vivo

Categoria: Operações. Etiquetas: Gráficos e medidores, Números e métricas, Escritórios e locais de trabalho, Fábricas e armazéns.

Layouts

Este cartão principal se encaixa em qualquer layout: tela cheia, centro, largo, canto, chip, faixa ou qualquer retângulo livre.

Layouts: cheio, centro, largo, canto, chip, faixa. Formas: paisagem, retrato, quadrado, faixa.

Layouts, temas e publicação de cartões. Veja os cartões.

Dados e privacidade

Este cartão usa suas propriedades configuradas e dados ao vivo do cartão.

Propriedades

Para tema, fundo, destaque e posição, veja Propriedades comuns.

Defina as propriedades estáticas nos params do cartão ao criá-lo. O documento de dados dele contém apenas propriedades dinâmicas. Linhas aninhadas descrevem o conteúdo da propriedade pai.

Propriedades estáticas

Propriedades dinâmicas

Exemplo de tela

Salve as propriedades estáticas como params.json e crie o cartão. O resultado traz o id crd_ dele.

{
  "theme": "neomustard"
}

screenrig card create --type gauge --major 1 --file params.json

Adicione este item aos primitives de uma página da playlist, com esse id no lugar do id do exemplo. Publique a playlist e atribua uma tela.

{
  "id": "gauge",
  "primitive": "card",
  "card": "crd_01EXAMPLECARD000000000",
  "layout": "full",
  "content_fit": "fill"
}

Escrever dados ao vivo

Escreva o documento no cartão depois de criá-lo e depois substitua-o para atualizar a tela sem republicar. O cartão verifica cada gravação contra suas propriedades dinâmicas e recusa um documento que ele rejeita. Use o mesmo projeto da playlist.

Salve o documento como card-data.json. O CLI lê o documento em si, sem invólucro:

{
  "metrics": [
    {
      "label": "Living room",
      "value": 21.5,
      "unit": "°C",
      "min": 10,
      "max": 30,
      "decimals": 1,
      "target": 22,
      "bands": [
        {
          "to": 18,
          "tone": "cool",
          "label": "Cool"
        },
        {
          "to": 24,
          "tone": "success",
          "label": "Comfortable"
        },
        {
          "to": 30,
          "tone": "warning",
          "label": "Warm"
        }
      ],
      "icon": "thermometer"
    },
    {
      "label": "Humidity",
      "value": 58,
      "unit": "%",
      "min": 0,
      "max": 100,
      "bands": [
        {
          "to": 30,
          "tone": "warning",
          "label": "Dry"
        },
        {
          "to": 60,
          "tone": "success",
          "label": "Comfortable"
        },
        {
          "to": 100,
          "tone": "cool",
          "label": "Humid"
        }
      ],
      "icon": "humidity"
    },
    {
      "label": "Air quality",
      "value": 780,
      "unit": "ppm",
      "min": 400,
      "max": 2000,
      "bands": [
        {
          "to": 800,
          "tone": "success",
          "label": "Fresh"
        },
        {
          "to": 1200,
          "tone": "warning",
          "label": "Stuffy"
        },
        {
          "to": 2000,
          "tone": "danger",
          "label": "Poor"
        }
      ],
      "icon": "air-vent"
    }
  ],
  "updatedAt": null
}

screenrig card data put crd_01EXAMPLECARD000000000 --file card-data.json

Ou chame a API diretamente. A API envolve o mesmo documento em um campo document. Um token de agente já nomeia seu projeto, então nenhum cabeçalho de projeto é enviado; se você enviar ScreenRig-Project, ele deve corresponder ao projeto do token. Forneça sua autorização de API pelo ambiente; veja Autenticação da API.

curl --request PUT "https://api.screenrig.ai/api/cards/crd_01EXAMPLECARD000000000/data" \
  --header "Authorization: Bearer $SCREENRIG_TOKEN" \
  --header "Content-Type: application/json" \
  --data '{"document":{"metrics":[{"label":"Living room","value":21.5,"unit":"°C","min":10,"max":30,"decimals":1,"target":22,"bands":[{"to":18,"tone":"cool","label":"Cool"},{"to":24,"tone":"success","label":"Comfortable"},{"to":30,"tone":"warning","label":"Warm"}],"icon":"thermometer"},{"label":"Humidity","value":58,"unit":"%","min":0,"max":100,"bands":[{"to":30,"tone":"warning","label":"Dry"},{"to":60,"tone":"success","label":"Comfortable"},{"to":100,"tone":"cool","label":"Humid"}],"icon":"humidity"},{"label":"Air quality","value":780,"unit":"ppm","min":400,"max":2000,"bands":[{"to":800,"tone":"success","label":"Fresh"},{"to":1200,"tone":"warning","label":"Stuffy"},{"to":2000,"tone":"danger","label":"Poor"}],"icon":"air-vent"}],"updatedAt":null}}'