以視覺方式醒目顯示符合 (或不符合) 特定條件的值，可讓使用者快速找出資料趨勢。在 Excel 或其他試算表應用程式中，這種模式通常稱為「條件式格式設定」。
舉例來說，本頁「直接在圖表設定中使用條件式格式設定」一節中的表格圖表，可協助使用者找出使用者成長率可能為正或負的位置：
Looker 支援多種方式，可在圖表中套用條件式格式設定：
- 資料表計算和表情符號。如果需要直接在 Looker 探索中建立決定格式設定的條件，這個方法最合適。請參閱「使用資料表計算功能設定條件式格式」最佳做法頁面，瞭解如何使用資料表計算功能，為圖表套用自訂格式。
- 使用文字和表格圖表圖表設定中的內建選項。
- 使用
htmlLookML 參數。如果特定欄位的分析中，驅動格式設定的條件一致，就很適合使用這個方法。
本指南提供後兩種選項的教學課程：
使用圖表設定進行條件式格式設定
您可以使用圖表設定，在表格圖表、單一值圖表和單一記錄圖表中套用條件式格式設定。
本節說明如何使用圖表「編輯」選單中的圖表設定，在表格圖表中使用條件式格式設定。
如需單一值圖表條件式格式設定的逐步指南，請參閱「充分運用 Looker 食譜中的圖表」中的「使用單一值圖表呈現大量資訊」食譜。
食材
- 探索查詢
- 表格圖表
必要條件
如要建立採用條件式格式設定的表格圖表，必須符合下列條件：
範例
行銷團隊想查看每月新使用者人數，並依年齡層區隔，進一步瞭解每月推出的行銷訴求成效。
部分使用者可能難以剖析預設表格圖表。您可以在圖表設定中使用條件式格式設定，根據目標或設定規則比較及對照值，讓使用者更容易理解資料。
在這個範例中，行銷團隊想根據下列條件比較表格中的值：
- 正成長 (綠色) — 新使用者達 50 人以上的月份和年齡層
- 平均成長 (黃色) — 新使用者人數介於 25 到 50 人的月份和年齡層
- 成長不佳 (紅色) — 新使用者人數不超過 24 人的月份和年齡層
請按照下列步驟，使用圖表「編輯」選單中的設定，為表格圖表套用條件式格式設定：
- 開啟「圖表」列上的「編輯」選單。
- 視需要從「繪圖」分頁選取任何表格樣式選項，包括使用「表格主題」下拉式選單選擇表格主題，或選取/取消選取「顯示列號」切換鈕，選擇是否顯示列號。
- 在「Plot」分頁中，選取「Cell Visualization」選項來停用。必須停用「儲存格圖表」，才能對表格值套用條件式格式設定。
- 在「格式設定」分頁中，選取「啟用條件式格式設定」切換鈕，啟用條件式格式設定並存取條件式格式設定。
- 您也可以在「格式」分頁的「顏色」部分，從「集合」下拉式選單中選擇調色盤，並在「自訂」部分的「列」欄位中自訂列大小 (以像素為單位)，以及在「標頭」欄位中自訂欄標頭文字對齊方式、字型大小和顏色。
- 在本範例中，我們選取「納入空值並視為 0」選項，將所有空值視為 0。
- 建立條件式格式設定規則。您可以選取「新增規則」按鈕，視需要新增多個條件式格式設定規則。
- 在「套用至」下拉式選單中，選取要套用至規則的值。
在「格式」下拉式選單中，選取要套用至規則的格式。 * 您可以選擇保留預設的「沿著刻度」格式。系統會根據你選擇的調色盤和值設定，以漸層方式醒目顯示值。如要進一步瞭解如何使用色階，請參閱表格圖表選項說明文件頁面的「條件式格式設定」一節。
- 視需要為每項規則指定「背景顏色」、「字型顏色」和「字型樣式」的值。請務必考量顏色對比度，確保內容符合無障礙設計規範。
在這個範例中，我們建立了三項規則：
- 格式選項「如果值大於」49，並選取綠色「背景顏色」選項。
- 格式選項「如果值介於」24 和 50 之間，並選取黃色「背景顏色」選項。
- 「格式」選項「如果值小於」25，並選取紅色的「背景顏色」選項。
產生的圖表會根據行銷團隊指定的條件，顯示每個年齡層欄中的使用者人數：
- 正成長 (綠色) — 新使用者達 50 人以上的月份和年齡層
- 平均成長 (黃色) — 新使用者人數介於 25 到 50 人的月份和年齡層
- 成長不佳 (紅色) — 新使用者人數不超過 24 人的月份和年齡層
在 LookML 中使用 html 參數設定條件式格式
除了使用圖表「編輯」選單設定，您也可以直接在欄位的 LookML 中硬式編碼條件式格式。這項功能可確保特定欄位的條件式格式在分析中保持一致，避免個別查詢需要重新設定圖表。
食材
- 液體變數：液體變數會搭配指定的 HTML 格式，轉譯欄位的值。
html參數：在欄位的html參數中編寫的 HTML 樣式，會顯示在「探索」的資料表和圖表中。- 表格圖表：使用者會在圖表中看到條件式格式。
必要條件
如要在 html 參數中硬式編碼條件式格式，必須符合下列條件：
- 建立探索的權限。
- 具備開發 LookML 的權限，並熟悉 SQL 和 LookML 開發。
- 具備在 Looker 使用 Liquid 和 HTML 程式碼的基本知識。請參閱
html說明文件頁面的「在html參數中使用 Liquid 變數」一節，瞭解必要的背景資訊。 - 儲存內容的權限 (如要將圖表儲存為 Look 圖表或資訊主頁)
範例
假設資料中有一個名為 status 的欄位，用於提供每筆訂單的狀態。status 的可能值如下：
- 「cancelled」
- "complete"
- 「待處理」
如要向查看查詢結果 (包含「狀態」欄位) 的使用者醒目顯示訂單狀態，可以新增專屬背景顏色，醒目顯示各個狀態。
如要在 LookML 欄位中編寫條件式格式設定，請按照下列步驟操作：
dimension: status {
type: string
sql: ${TABLE}.status ;;
html:
{% if value == 'complete' %}
<p style="color: black; background-color: lightgreen;">{{ value }}</p>
{% elsif value == 'pending' %}
<p style="color: black; background-color: orange;">{{ value }}</p>
{% else %}
<p style="color: white; background-color: red;">{{ value }}</p>
{% endif %}
;;
description: "The current status of an existing order."
}
- 在開發模式中，前往要新增條件式格式設定的 LookML 欄位。
- 您可以從「探索」頁面直接前往欄位的 LookML 定義。
- 在欄位中加入
html參數。在這個範例中，欄位為status。 - 在
html參數中，使用 Liquid 標記語法建立運算式，為欄位的特定值設定條件。- 這個範例使用 Liquid 變數
value輸出欄位值。請務必使用_rendered_value顯示採用 Looker 值格式的欄位值。 - 請務必考量顏色對比度，確保內容符合無障礙設計規範。
- 您可以視需要新增任何其他 Looker 支援的 HTML 樣式。如需更多範例，請參閱
html參數說明文件頁面。
- 這個範例使用 Liquid 變數
- 確認程式碼運作正常後，儲存、驗證並推送至正式環境。
在任何包含該欄位的 Looker 查詢結果中，「Status」值會根據狀態以紅色、綠色或橘色醒目顯示。
其他圖表也會顯示背景顏色。舉例來說，如果查詢依「訂單狀態」將「訂單數量」分組，則柱狀圖會顯示每個「訂單狀態」值的編碼背景顏色。
其他樣式
您可以使用與前一個範例相同的語法，根據欄位值新增圖示或圖片。以下範例會為「已取消」的訂單狀態新增紅色「x」勾號圖示，為「已完成」的訂單狀態新增綠色勾號圖示，並為「待處理」的訂單狀態新增時鐘圖示：
dimension: status {
type: string
sql: ${TABLE}.status ;;
html:
{% if value == 'complete' %}
<p><img src="https://findicons.com/files/icons/573/must_have/48/check.png" height=20 width=20>{{ rvalue }}</p>
{% elsif value == 'pending' %}
<p><img src="https://findicons.com/files/icons/1681/siena/128/clock_blue.png" height=20 width=20>{{ value }}</p>
{% else %}
<p><img src="https://findicons.com/files/icons/719/crystal_clear_actions/64/cancel.png" height=20 width=20>{{ value }}</p>
{% endif %}
;;
description: "The current status of an existing order."
}
在任何包含該欄位的 Looker 查詢結果中，Status 值旁會顯示紅色 X 圖示、綠色勾號圖示或時鐘圖示，具體取決於狀態。
後續步驟
使用條件式格式設定建立表格圖表後，即可與他人共用：