A estrutura de Painéis do Azure
Este documento explica a estrutura de um painel do Azure, usando o painel a seguir como exemplo:
Como os painéis compartilhados do Azure são recursos, este painel pode ser representado como JSON. Você pode baixar a representação JSON de um painel selecionando Exportar e Baixar no portal do Azure.
Exemplo de JSON do painel
O JSON a seguir representa o painel de exemplo mostrado na seção anterior.
{
"properties": {
"lenses": [
{
"order": 0,
"parts": [
{
"position": {
"x": 0,
"y": 0,
"colSpan": 3,
"rowSpan": 2
},
"metadata": {
"inputs": [],
"type": "Extension/HubsExtension/PartType/MarkdownPart",
"settings": {
"content": {
"settings": {
"content": "## Azure Virtual Machines Overview\r\nNew team members should watch this video to get familiar with Azure Virtual Machines.",
"markdownUri": null
}
}
}
}
},
{
"position": {
"x": 3,
"y": 0,
"colSpan": 8,
"rowSpan": 4
},
"metadata": {
"inputs": [],
"type": "Extension/HubsExtension/PartType/MarkdownPart",
"settings": {
"content": {
"settings": {
"content": "This is the team dashboard for the test VM we use on our team. Here are some useful links:\r\n\r\n1. [Create a Linux virtual machine](https://docs.microsoft.com/azure/virtual-machines/linux/quick-create-portal)\r\n1. [Create a Windows virtual machine](https://docs.microsoft.com/azure/virtual-machines/windows/quick-create-portal)\r\n1. [Create a virtual machine scale set](https://docs.microsoft.com/azure/virtual-machine-scale-sets/quick-create-portal)",
"title": "Test VM Dashboard",
"subtitle": "Contoso",
"markdownUri": null
}
}
}
}
},
{
"position": {
"x": 0,
"y": 2,
"colSpan": 3,
"rowSpan": 2
},
"metadata": {
"inputs": [],
"type": "Extension/HubsExtension/PartType/VideoPart",
"settings": {
"content": {
"settings": {
"src": "https://www.youtube.com/watch?v=rOiSRkxtTeU",
"autoplay": false
}
}
}
}
},
{
"position": {
"x": 0,
"y": 4,
"colSpan": 11,
"rowSpan": 3
},
"metadata": {
"inputs": [
{
"name": "queryInputs",
"value": {
"timespan": {
"duration": "PT1H"
},
"id": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine",
"chartType": 0,
"metrics": [
{
"name": "Percentage CPU",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
}
]
}
}
],
"type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart"
}
},
{
"position": {
"x": 0,
"y": 7,
"colSpan": 3,
"rowSpan": 2
},
"metadata": {
"inputs": [
{
"name": "queryInputs",
"value": {
"timespan": {
"duration": "PT1H"
},
"id": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine",
"chartType": 0,
"metrics": [
{
"name": "Disk Read Operations/Sec",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
},
{
"name": "Disk Write Operations/Sec",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
}
]
}
}
],
"type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart"
}
},
{
"position": {
"x": 3,
"y": 7,
"colSpan": 3,
"rowSpan": 2
},
"metadata": {
"inputs": [
{
"name": "queryInputs",
"value": {
"timespan": {
"duration": "PT1H"
},
"id": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine",
"chartType": 0,
"metrics": [
{
"name": "Disk Read Bytes",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
},
{
"name": "Disk Write Bytes",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
}
]
}
}
],
"type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart"
}
},
{
"position": {
"x": 6,
"y": 7,
"colSpan": 3,
"rowSpan": 2
},
"metadata": {
"inputs": [
{
"name": "queryInputs",
"value": {
"timespan": {
"duration": "PT1H"
},
"id": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine",
"chartType": 0,
"metrics": [
{
"name": "Network In Total",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
},
{
"name": "Network Out Total",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
}
]
}
}
],
"type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart"
}
},
{
"position": {
"x": 9,
"y": 7,
"colSpan": 2,
"rowSpan": 2
},
"metadata": {
"inputs": [
{
"name": "id",
"value": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
}
],
"type": "Extension/Microsoft_Azure_Compute/PartType/VirtualMachinePart",
"asset": {
"idInputName": "id",
"type": "VirtualMachine"
}
}
}
]
}
],
"metadata": {
"model": {}
}
},
"name": "Simple VM Dashboard",
"type": "Microsoft.Portal/dashboards",
"location": "INSERT LOCATION",
"tags": {
"hidden-title": "Simple VM Dashboard"
},
"apiVersion": "2022-12-01-preview"
}
Propriedades comuns do recurso
Vamos dividir as seções relevantes do JSON. As propriedades de recurso comuns aparecem perto do final do exemplo JSON. Essas propriedades são compartilhadas em todos os tipos de recursos do Azure e não se relacionam especificamente com o conteúdo do painel.
ID
O ID representa a ID de recurso do Azure do painel, sujeito às convenções de nomenclatura dos recursos do Azure. Quando o portal cria um painel, geralmente escolhe uma ID no formato de um GUID, mas você pode usar qualquer nome válido ao criar um painel programaticamente.
Quando você exporta um painel do portal do Azure, o campo id não está incluído. Se você criar um novo painel importando um arquivo JSON que inclua o campo id, o valor será ignorado e um novo valor de ID será atribuído a cada novo painel.
Nome
O nome do recurso que o portal do Azure usa para o painel.
Tipo
Todos os painéis são do tipo Microsoft.Portal/dashboards.
Localidade
Ao contrário de outros recursos, os painéis não têm um componente de runtime. Para painéis, location indica a localização geográfica primária que armazena a representação JSON do painel. O valor deve ser um dos códigos de local que podem ser buscados usando a API de locais no recurso de assinaturas.
Marcações
Marcas são um recurso comum de recursos do Azure que lhe permitem organizar seus recursos por pares de valor de nome arbitrário. Os painéis incluem uma marca especial chamada hidden-title. Se o seu painel tiver essa propriedade populada, esse valor será usado como o nome de exibição do seu painel no Portal. Esta tag oferece uma maneira de ter um nome de exibição renomeável para seu painel
Propriedades
O objeto properties contém duas propriedades, lenses e metadata. A propriedade lenses contém informações sobre os blocos no painel. A propriedade metadata está reservada para potenciais recursos futuros.
Lentes
A propriedade lenses contém o painel.
Partes
A propriedade lenses contém duas propriedades, order e parts. Atualmente, order é sempre definido como 0. A propriedade parts contém um objeto que define as partes individuais (também chamadas de blocos) no painel.
O objeto parts contém uma propriedade para cada parte, onde o nome da propriedade é um número. O número não é significativo.
Cada objeto de parte individual contém position e metadata.
Cargo
A propriedade position contém as informações de tamanho e localização da parte expressas como x, y, rowSpan, e colSpan. Os valores estão em termos de unidades de grade. Essas unidades de grade ficam visíveis quando o painel está no modo editável, conforme mostrado aqui.
Por exemplo, se você deseja que um bloco tenha uma largura de duas unidades de grade, uma altura de uma unidade de grade e um local no canto superior esquerdo do painel, o objeto de posição terá a seguinte aparência:
position: { x: 0, y: 0, rowSpan: 2, colSpan: 1 }
Metadados
Cada parte tem uma propriedade de metadados. Um objeto tem apenas uma propriedade necessária dentro de metadados: type. Esta cadeia de caracteres informa ao portal qual tipo de bloco mostrar. Nosso painel de exemplo usa esses tipos de blocos:
Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart– usado para mostrar as métricas de monitoramentoExtension[azure]/HubsExtension/PartType/MarkdownPart– Usado para mostrar conteúdo de markdown personalizado, como texto ou imagens, com formatação básica para listas, links, etc.Extension[azure]/HubsExtension/PartType/VideoPart– Usado para mostrar vídeos do YouTube, Canal 9 e qualquer outro tipo de vídeo que funcione em uma tag de vídeo HTML.
Cada tipo de parte tem suas próprias opções de configuração. As possíveis propriedades de configuração são chamadas inputs, settings, e asset.
Entradas
O objeto inputs geralmente contém informações que associam um bloco a uma instância do recurso.
Cada MetricsChartPart em nosso exemplo tem uma única entrada que expressa o recurso ao qual se associar, representando a ID do recurso do Azure da VM, juntamente com informações sobre os dados que estão sendo exibidos. Por exemplo, aqui está o objeto inputs para o bloco que mostra as métricas de Rede Total de Entrada e Rede Total de Saída.
"inputs":
[
{
"name": "queryInputs",
"value": {
"timespan": {
"duration": "PT1H"
},
"id": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine",
"chartType": 0,
"metrics": [
{
"name": "Network In Total",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
},
{
"name": "Network Out Total",
"resourceId": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVirtualMachine"
}
]
}
}
]
Configurações
O objeto settings contém os elementos configuráveis de uma parte. Em nosso painel de exemplo, o MarkdownPart usa configurações para armazenar o conteúdo de Markdown personalizado, juntamente com um título e um subtítulo configuráveis.
"settings": {
"content": {
"settings": {
"content": "This is the team dashboard for the test VM we use on our team. Here are some useful links:\r\n\r\n1. [Create a Linux virtual machine](https://docs.microsoft.com/azure/virtual-machines/linux/quick-create-portal)\r\n1. [Create a Windows virtual machine](https://docs.microsoft.com/azure/virtual-machines/windows/quick-create-portal)\r\n1. [Create a virtual machine scale set](https://docs.microsoft.com/azure/virtual-machine-scale-sets/quick-create-portal)",
"title": "Test VM Dashboard",
"subtitle": "Contoso",
"markdownUri": null
}
}
}
Da mesma forma, o VideoPart tem suas próprias configurações que contêm um ponteiro para o vídeo a ser reproduzido, uma configuração de reprodução automática e informações de título opcionais.
"settings": {
"content": {
"settings": {
"src": "https://www.youtube.com/watch?v=rOiSRkxtTeU",
"autoplay": false
}
}
}
Ativo
Os blocos associados aos objetos de portal gerenciáveis de primeira classe (chamados ativos) têm essa relação expressa por meio do objeto asset. Em nosso painel de exemplo, o bloco de máquina virtual contém a descrição do ativo. A propriedade idInputName informa ao portal que a entrada de ID contém o identificador exclusivo do ativo, nesse caso, o ID do recurso. A maioria dos tipos de recursos do Azure tem ativos definidos no portal.
"asset": {
"idInputName": "id",
"type": "VirtualMachine"
}
Próximas etapas
- Saiba como criar um painel no portal do Azure ou programaticamente.
- Saiba como usar blocos de redução nos painéis do Azure para mostrar conteúdo personalizado.