只有採用下列設定的 LookML 資訊主頁支援按鈕：
preferred_viewer設為dashboards-nextlayout設為newspaper
本頁說明如何使用 dashboard.lkml 檔案中的 LookML 資訊主頁參數，新增及自訂 type: button 的 LookML 資訊主頁元素。按鈕適合用來在資訊主頁中放置連結。您可以連結至 Looker 內容 (例如 Look 圖表和資訊主頁)，或連結至其他網站。
如要瞭解如何透過 Looker UI 在資訊主頁中新增按鈕，請參閱「建立使用者定義資訊主頁」說明文件頁面。
應用實例
## BASIC PARAMETERS
type: button
name: text
height: N
width: N
row: N
col: N
## BUTTON PARAMETER
rich_content_json: '{
"text": "button text",
"description": "description",
"newTab": true | false,
"alignment": "left" | "right" | "center",
"size": "small" | "medium" | "large",
"style": "OUTLINED" | "FILLED" | "TRANSPARENT",
"color": "hex string or css color",
"href": "link"
}'
參數定義
| 參數名稱 | 說明 | |
|---|---|---|
| 基本參數 | ||
type (用於元素) |
決定要在元素中使用的圖表類型 | |
name (用於元素) |
建立元素 | |
height (用於元素) |
定義按鈕元素的圖塊方塊高度。layout: newspaper 資訊主頁的高度單位為列 |
|
width (用於元素) |
定義按鈕元素的圖塊方塊寬度。layout: newspaper 資訊主頁的寬度單位為欄 |
|
row |
定義 layout: newspaper 資訊主頁中，按鈕元素資訊方塊的上下位置 (以列為單位) |
|
col |
定義 layout: newspaper 資訊主頁中按鈕元素資訊方塊的左右位置 (以欄為單位) |
|
| 按鈕參數 | ||
rich_content_json |
JSON 物件，包含按鈕相關資訊的鍵/值組合 | |
基本參數
定義 type: button 的 LookML 資訊主頁元素時，您必須至少指定 name 和 type 參數的值。
height、width、row 和 col 參數適用於按鈕元素的圖塊方塊，而非按鈕本身。
name
本節說明資訊主頁元素中的
name參數。
name也可以做為資訊主頁篩選器的一部分，詳情請參閱「資訊主頁參數」說明文件頁面。
每個 name 宣告都會建立新的資訊主頁元素，並指派名稱。元素名稱不得重複。
按鈕的 name 不會顯示在資訊主頁 UI 中。
- name: orders_by_date
type
本節說明資訊主頁元素中的
type參數。
type也可以做為資訊主頁篩選器的一部分，詳情請參閱「資訊主頁參數」說明文件頁面。
type也可以做為彙整的一部分，詳情請參閱type(用於彙整) 參數說明文件頁面。
type也可以做為維度的一部分，詳情請參閱「維度、篩選器和參數類型」說明文件頁面。
type也可以做為測量指標的一部分，詳情請參閱「測量指標類型」說明文件頁面。
type 參數會決定元素中使用的圖表類型。
- name: element_name
type: text | looker_grid | table | single_value | looker_single_record |
looker_column | looker_bar | looker_scatter | looker_line | looker_area |
looker_pie | looker_donut_multiples | looker_funnel | looker_timeline |
looker_map | looker_geo_coordinates | looker_geo_choropleth | looker_waterfall |
looker_wordcloud | looker_boxplot | button | group
如要概略瞭解不同類型的 LookML 資訊主頁元素，請參閱 type (適用於 LookML 資訊主頁) 說明文件頁面。
height
本節說明資訊主頁元素中的
height參數。
height也可以做為資訊主頁資料列的一部分，詳情請參閱資訊主頁參數說明文件頁面。
按鈕元素資訊方塊方塊預設高度為 6 列。高度下限為 1 列。變更按鈕元素高度可能會影響資訊主頁上的其他元素，但不會影響按鈕本身的高度。
舉例來說，以下程式碼會將按鈕的圖塊方塊設為 12 列高：
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
height: 12
...
width
本節說明資訊主頁元素中的
width參數。
width也可以做為資訊主頁的一部分，詳情請參閱「資訊主頁參數」說明文件頁面。
width 參數定義按鈕元素圖塊方塊的寬度，單位為欄。
按鈕元素的圖塊方塊寬度預設為 8 欄，也就是資訊主頁全寬的三分之一。按鈕圖塊方塊的寬度下限為 2。
舉例來說，下列程式碼會將按鈕的圖塊方塊設為資訊主頁寬度的一半：
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
width: 12
...
如果按鈕的圖塊方塊內有空間，按鈕的寬度會增加，以容納 text 中定義的長字串。不過，按鈕寬度不會超過 width 參數中設定的值；如有必要，按鈕上定義的 text 字串會遭到截斷。
row
row 參數定義了按鈕元素圖塊方塊頂端邊緣所在的列。如果使用 group 參數將按鈕放在圖塊群組中，row 會定義按鈕相對於群組容器頂端 (row: 0) 的列位置。
資訊主頁頂端為第 0 列。資訊主頁按鈕元素的高度預設為 6 列，也就是說，資訊主頁頂端的資訊主頁元素 (row: 0) 預設會占用第 0 到 5 列。
在以下範例中，程式碼會將按鈕的圖塊方塊設為放在資訊主頁的第二列元素，假設元素設為預設高度：
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
row: 6
...
col
col 參數定義按鈕元素圖塊方塊左側邊緣所在的欄。如果使用 group 參數將按鈕放在圖塊群組中，col 會定義按鈕相對於群組容器左側邊緣 (col: 0) 的欄位置。
資訊主頁分為 24 欄。資訊主頁從左側的第 0 欄開始。報紙版面配置的資訊主頁預設元素寬度為 8 欄，也就是說，資訊主頁左側的資訊主頁元素 (col: 0) 預設會占用第 0 到 7 欄。
舉例來說，下列程式碼會將元素設為資訊主頁中第三欄的元素：
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
col: 16
...
按鈕參數
本節說明的參數可用於將內容新增至 type: button 的 LookML 資訊主頁元素。
rich_content_json
rich_content_json 是 JSON 物件，包含多個鍵/值組合，用於定義資訊主頁按鈕的特性。
以下範例說明如何使用資訊主頁按鈕前往其他資訊主頁。
rich_content_json: '{
"text": "Go to Sales Dashboard",
"description": "View sales from the last 18 months.",
"newTab": true,
"alignment": "center",
"size": "medium",
"style": "FILLED",
"color": "forestgreen",
"href":"https://instance_name.looker.com/dashboards/152?State=California&Created+Fiscal+Quarter=2022"
}'
以下範例說明如何使用資訊主頁按鈕，前往資訊主頁的分頁。
rich_content_json: '{
"text": "Go to Users tab",
"description": "View user data from the last 18 months.",
"newTab": false,
"alignment": "center",
"size": "medium",
"style": "FILLED",
"color": "forestgreen",
"targetTabName":"Users"
"href":""
}'
text
text 定義資訊主頁 UI 中按鈕上顯示的文字。按鈕會隨著文字長度變寬，直到達到 width 參數設定的限制為止，此時文字會遭到截斷。
description
description 定義將游標懸停在按鈕上時，顯示為工具提示的文字。如未提供說明，系統預設會顯示 href 中提供的連結。
newTab
newTab 是布林值，用於定義按鈕連結要在新分頁 (true) 或目前分頁 (false) 開啟。newTab 預設為 true。
alignment
alignment 會設定按鈕在按鈕元素圖塊方塊中的對齊方式。alignment 預設為 center。
大小
size 會將按鈕和文字的大小設為 small、medium 或 large。size 的值不會影響按鈕元素的圖塊方塊大小或 height 參數。
style
style 會將按鈕樣式設為下列其中一個值：
FILLED：按鈕主體會填入color中設定的顏色。按鈕的文字是白色。這是預設值。OUTLINED：按鈕邊緣有外框，但主體為透明。按鈕文字的顏色由color設定。TRANSPARENT：按鈕主體為透明。按鈕文字的顏色由color設定。
color
color 會根據 style 設定，設定按鈕或按鈕文字的顏色。color 預設為 Looker 執行個體預設類別顏色集合中的第一個顏色。
顏色值的格式可以是十六進位字串 (例如 #2ca6cd)，也可以是 CSS 顏色名稱 (例如 mediumblue)。
targetTabName
如果資訊主頁含有分頁，targetTabName 會設定按鈕將使用者導向的資訊主頁分頁。
進一步瞭解分頁資訊主頁。
href
href 會設定按鈕將使用者導向的網址。其他 Looker 資訊主頁的連結可能包含篩選器參數，可將資訊主頁篩選器設為特定值。