Azure 儀表板結構

此文件將使用下列儀表板做為範例,逐步說明 Azure 儀表板的結構:

Screenshot of a sample dashboard in the Azure portal.

因為共用 Azure 儀表板屬於資源,所以此儀表板能夠以 JSON 的形式呈現。 您可以選取 [匯出],然後在 Azure 入口網站中 下載,以下載儀表板的 JSON 表示法。

下列 JSON 代表上面顯示的儀表板。

{
{
  "properties": {
    "lenses": {
      "0": {
        "order": 0,
        "parts": {
          "0": {
            "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
                  }
                }
              }
            }
          },
          "1": {
            "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
                  }
                }
              }
            }
          },
          "2": {
            "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
                  }
                }
              }
            }
          },
          "3": {
            "position": {
              "x": 0,
              "y": 4,
              "colSpan": 11,
              "rowSpan": 3
            },
            "metadata": {
              "inputs": [
                {
                  "name": "queryInputs",
                  "value": {
                    "timespan": {
                      "duration": "PT1H"
                    },
                    "id": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1",
                    "chartType": 0,
                    "metrics": [
                      {
                        "name": "Percentage CPU",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      }
                    ]
                  }
                }
              ],
              "type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart",
              "settings": {}
            }
          },
          "4": {
            "position": {
              "x": 0,
              "y": 7,
              "colSpan": 3,
              "rowSpan": 2
            },
            "metadata": {
              "inputs": [
                {
                  "name": "queryInputs",
                  "value": {
                    "timespan": {
                      "duration": "PT1H"
                    },
                    "id": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1",
                    "chartType": 0,
                    "metrics": [
                      {
                        "name": "Disk Read Operations/Sec",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      },
                      {
                        "name": "Disk Write Operations/Sec",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      }
                    ]
                  }
                }
              ],
              "type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart",
              "settings": {}
            }
          },
          "5": {
            "position": {
              "x": 3,
              "y": 7,
              "colSpan": 3,
              "rowSpan": 2
            },
            "metadata": {
              "inputs": [
                {
                  "name": "queryInputs",
                  "value": {
                    "timespan": {
                      "duration": "PT1H"
                    },
                    "id": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1",
                    "chartType": 0,
                    "metrics": [
                      {
                        "name": "Disk Read Bytes",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      },
                      {
                        "name": "Disk Write Bytes",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      }
                    ]
                  }
                }
              ],
              "type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart",
              "settings": {}
            }
          },
          "6": {
            "position": {
              "x": 6,
              "y": 7,
              "colSpan": 3,
              "rowSpan": 2
            },
            "metadata": {
              "inputs": [
                {
                  "name": "queryInputs",
                  "value": {
                    "timespan": {
                      "duration": "PT1H"
                    },
                    "id": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1",
                    "chartType": 0,
                    "metrics": [
                      {
                        "name": "Network In Total",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      },
                      {
                        "name": "Network Out Total",
                        "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                      }
                    ]
                  }
                }
              ],
              "type": "Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart",
              "settings": {}
            }
          },
          "7": {
            "position": {
              "x": 9,
              "y": 7,
              "colSpan": 2,
              "rowSpan": 2
            },
            "metadata": {
              "inputs": [
                {
                  "name": "id",
                  "value": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
                }
              ],
              "type": "Extension/HubsExtension/PartType/ResourcePart",
              "asset": {
                "idInputName": "id",
                "type": "VirtualMachine"
              }
            }
          }
        }
      }
    },
    "metadata": {
      "model": {
        "timeRange": {
          "value": {
            "relative": {
              "duration": 24,
              "timeUnit": 1
            }
          },
          "type": "MsPortalFx.Composition.Configuration.ValueTypes.TimeRange"
        }
      }
    }
  },
  "name": "Simple VM Dashboard",
  "type": "Microsoft.Portal/dashboards",
  "location": "INSERT LOCATION",
  "tags": {
    "hidden-title": "Simple VM Dashboard"
  },
  "apiVersion": "2015-08-01-preview"
}

通用資源屬性

接下來要將 JSON 的相關區段加以細分。 通用資源屬性會出現在上述範例結尾附近。 這些屬性會跨所有 Azure 資源類型共用。 不會特別與儀表板的內容相關。

識別碼

ID 代表儀表板的 Azure 資源識別碼,受限於 Azure 資源的命名慣例。 入口網站建立儀表板時,通常會選擇 GUID 形式的識別碼,但是以程式設計方式建立儀表板時,您可以使用任何有效的名稱。

當您從 Azure 入口網站匯出儀表板時,不會包含 id 欄位。 如果您匯入包含 [id] 欄位的 JSON 檔案來建立新的儀表板,該值會被忽略,並會為每個新的儀表板指派新的識別碼值。

名稱

Azure 入口網站用於儀表板的資源名稱。

類型

所有儀表板的類型都是 Microsoft.Portal/dashboards

Location

不同於其他資源,儀表板沒有執行階段元件。 對於儀表板,「位置」代表的是儲存儀表板的 JSON 表示法所在的主要地理位置。 該值應為可使用訂用帳戶資源上的位置 API 擷取到的其中一個位置代碼。

標籤

標記是 Azure 資源的共通功能,可讓您按照任意名稱值組排列您的資源。 儀表板包含一個稱為 hidden-title 的特殊標籤。 如果您的儀表板已填入這個屬性,則該值會用來作為儀表板在入口網站的顯示名稱。 此標籤讓您的儀表板擁有可重新命名的顯示名稱。

屬性

屬性物件包含兩個屬性: lensesmetadatalenses 屬性包含儀表板上圖格的相關資訊。 metadata 屬性會保留給未來的潛在功能。

功能濾鏡

lenses 屬性包含儀表板。 此範例中的功能濾鏡物件包含名為 "0" 的單一屬性。 功能濾鏡是目前未實作的群組概念。 目前,所有儀表板都有在功能濾鏡物件上名為 "0" 的這個單一屬性。

組件

"0" 下方的物件包含兩個屬性: orderparts。 目前,order 這個值一律設定為 0。 parts 屬性包含物件,用來定義儀表板上的個別組件 (也稱為圖格)。

parts 物件包含每個組件的屬性,其中的屬性名稱是數字。 數字並不重要。

每個個別元件物件都包含 positionmetadata

Position

position 屬性包含組件的大小和位置資訊,分別以 xyrowSpan、和 colSpan 表示。 這些值會以格線單位呈現。 儀表板處於如下所示的自訂模式時,這些格線單位便會顯示。

Screenshot showing the grid units for a dashboard in the Azure portal.

例如,如果您想要讓圖格的寬度為兩個格線單位、高度為一個格線單位、位於儀表板左上角,則位置物件看起來會像這樣:

position: { x: 0, y: 0, rowSpan: 2, colSpan: 1 }

中繼資料

每個組件都有中繼資料屬性。 物件只有一個必要屬性: type。 這個字串告知入口網站要顯示的圖格類型。 我們的範例儀表板使用下列類型的圖格:

  1. Extension/Microsoft_Azure_Monitoring/PartType/MetricsChartPart – 用來顯示監視計量
  2. Extension[azure]/HubsExtension/PartType/MarkdownPart – 使用清單、連結等等的基本格式,用來顯示如文字或影像的自訂 Markdown 内容。
  3. Extension[azure]/HubsExtension/PartType/VideoPart – 用來顯示來自 YouTube、Channel9 的影片,以及適用於 HTML 影片標記的任何其他類型的影片。

每個類型的組件都有本身的設定選項。 可能的設定屬性稱為 inputssettingsasset

輸入

輸入物件通常包含將圖格繫結至資源執行個體的資訊。

我們範例中的每個 MetricsChartPart 都有單一輸入,表示要繫結的資源,代表 VM 的 Azure 資源識別碼,以及所顯示資料相關資訊。 例如,以下是圖格的 inputs 物件,其中顯示網路總計,以及 網路輸出總計 計量。

"inputs":
[
  {
    "name": "queryInputs",
    "value": {
      "timespan": {
        "duration": "PT1H"
      },
      "id": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1",
      "chartType": 0,
      "metrics": [
        {
          "name": "Network In Total",
          "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
        },
        {
          "name": "Network Out Total",
          "resourceId": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/SimpleWinVMResourceGroup/providers/Microsoft.Compute/virtualMachines/myVM1"
        }
      ]
    }
  }
]

設定

設定物件包含可設定的組件元素。 在我們的範例儀表板中,Markdown 組件會使用儲存自訂 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"
    }
  }
}

同樣地,影片圖格有自己的設定,其中包含播放視訊的指標、自動播放設定,以及選用的標題資訊。


"settings": {
  "content": {
    "settings": {
      "src": "https://www.youtube.com/watch?v=rOiSRkxtTeU",
      "autoplay": false
    }
  }
}

資產

繫結至第一類可管理入口網站物件的圖格 (稱為資產) 會透過 asset 物件表示此關聯性。 在我們的範例儀表板中,虛擬機器圖格包含此資產描述。 idInputName 屬性告知入口網站識別碼輸入包含資產的唯一識別碼,在此案例中是資源識別碼。 大部分的 Azure 資源類型都有在入口網站中定義的資產。

"asset": { "idInputName": "id", "type": "VirtualMachine" }

下一步