Azure 儀表板結構
此文件將使用下列儀表板做為範例，逐步說明 Azure 儀表板的結構：
因為共用 Azure 儀表板屬於資源，所以此儀表板能夠以 JSON 的形式呈現。 您可以選取 [匯出]，然後在 Azure 入口網站中 下載，以下載儀表板的 JSON 表示法。
範例儀表板 JSON
下列 JSON 代表上一節中所顯示的範例儀表板。
{
"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"
}
通用資源屬性
接下來要將 JSON 的相關區段加以細分。 通用資源屬性會出現在範例 JSON 的結尾附近。 這些屬性會在所有 Azure 資源類型之間共用，而且它們與儀表板的內容沒有具體關係。
識別碼
ID 代表儀表板的 Azure 資源識別碼，受限於 Azure 資源的命名慣例。 入口網站建立儀表板時，通常會選擇 GUID 形式的識別碼，但是以程式設計方式建立儀表板時，您可以使用任何有效的名稱。
當您從 Azure 入口網站匯出儀表板時，不會包含 id 欄位。 如果您匯入包含 [id] 欄位的 JSON 檔案來建立新的儀表板，該值會被忽略，並會為每個新的儀表板指派新的識別碼值。
名稱
Azure 入口網站用於儀表板的資源名稱。
類型
所有儀表板的類型都是 Microsoft.Portal/dashboards。
Location
不同於其他資源，儀表板沒有執行階段元件。 對於儀表板，location 代表的是儲存儀表板的 JSON 表示法所在的主要地理位置。 該值應為可使用訂用帳戶資源上的位置 API 擷取到的其中一個位置代碼。
標籤
標記是 Azure 資源的共通功能，可讓您按照任意名稱值組排列您的資源。 儀表板包含一個稱為 hidden-title 的特殊標籤。 如果您的儀表板已填入這個屬性，則該值會用來作為儀表板在入口網站的顯示名稱。 此標籤讓您的儀表板擁有可重新命名的顯示名稱。
屬性
properties 物件包含兩個屬性：lenses 和 metadata。 lenses 屬性包含儀表板上圖格的相關資訊。 metadata 屬性會保留給未來的潛在功能。
功能濾鏡
lenses 屬性包含儀表板。
組件
lenses 屬性包含兩個屬性：order 和 parts。 目前，order 這個值一律設定為 0。 parts 屬性包含物件，用來定義儀表板上的個別組件 (也稱為圖格)。
parts 物件包含每個組件的屬性，其中的屬性名稱是數字。 數字並不重要。
每個個別元件物件都包含 position 與 metadata。
Position
position 屬性包含組件的大小和位置資訊，分別以 xy、rowSpan、和 colSpan 表示。 這些值會以格線單位呈現。 當儀表板處於可編輯的模式時，這些格線單位便會顯示，如下所示。
例如，如果您想要讓圖格的寬度為兩個格線單位、高度為一個格線單位、位於儀表板左上角，則位置物件看起來會像這樣:
position: { x: 0, y: 0, rowSpan: 2, colSpan: 1 }
中繼資料
每個組件都有中繼資料屬性。 物件在中繼資料內只有一個必要屬性：type。 這個字串告知入口網站要顯示的圖格類型。 我們的範例儀表板使用下列類型的圖格：
Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart– 用來顯示監視計量Extension[azure]/HubsExtension/PartType/MarkdownPart– 使用清單、連結等等的基本格式，用來顯示如文字或影像的自訂 Markdown 内容。Extension[azure]/HubsExtension/PartType/VideoPart– 用來顯示來自 YouTube、Channel9 的影片，以及適用於 HTML 影片標記的任何其他類型的影片。
每個類型的組件都有本身的設定選項。 可能的設定屬性稱為 inputs、settings 和 asset。
輸入
輸入物件通常包含將圖格繫結至資源執行個體的資訊。
我們範例中的每個 MetricsChartPart 都有單一輸入，表示要繫結的資源，代表 VM 的 Azure 資源識別碼，以及所顯示資料相關資訊。 例如，以下是圖格的 inputs 物件，其中顯示網路總計，以及 網路輸出總計 計量。
"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"
}
]
}
}
]
設定
設定物件包含可設定的組件元素。 在我們的範例儀表板中，MarkdownPart 會使用儲存自訂 Markdown 內容的設定，以及可設定的標題和副標題。
"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
}
}
}
同樣地，VideoPart 有自己的設定，其中包含播放視訊的指標、自動播放設定，以及選用的標題資訊。
"settings": {
"content": {
"settings": {
"src": "https://www.youtube.com/watch?v=rOiSRkxtTeU",
"autoplay": false
}
}
}
資產
繫結至第一類可管理入口網站物件的圖格 (稱為資產) 會透過 asset 物件表示此關聯性。 在我們的範例儀表板中，虛擬機器圖格包含此資產描述。 idInputName 屬性告知入口網站識別碼輸入包含資產的唯一識別碼，在此案例中是資源識別碼。 大部分的 Azure 資源類型都有在入口網站中定義的資產。
"asset": {
"idInputName": "id",
"type": "VirtualMachine"
}
下一步
- 瞭解如何在 Azure 入口網站中，或以程式設計方式建立儀表板。
- 瞭解如何 在 Azure 儀表板上使用 Markdown 圖格來顯示自訂內容。