視覺上醒目顯示符合特定條件的值,可讓使用者快速掌握資料趨勢。這種模式通常稱為條件式格式設定。
舉例來說,這頁面上的「以顏色標示最大值、最小值和百分位值」範例圖表,可協助使用者快速找出銷售量最低和最高的月份:
在 Looker 中,您可以使用文字和表格圖表視覺化設定中的內建選項,將條件格式套用至文字和表格圖表。針對笛卡爾圖表,您可以使用圖表設定編輯器,依條件設定資料值的格式。
在圖表設定編輯器中,您可以使用 series formatters
屬性,將條件式設定格式套用至符合特定條件的值。以下是可套用的部分條件式格式規則:
值大於、小於或等於指定值。
舉例來說,如要將條件式格式套用至大於 100 的數值,請使用
select: 'value > 100'
。這個值是序列中的最小值或最大值。
舉例來說,如要將條件式格式套用至最大值,請使用
select: 'max'
。該值位於指定百分位數排名內。
舉例來說,如要將條件式格式套用至前 10% 的值,請使用
select: 'percent_rank >= 0.9'
。X 軸值與指定值相符。
舉例來說,如要將條件式格式套用至 x 軸值為「Columbia」的資料列,請使用
select: name = Columbia
。
本食譜提供以下教學課程:
以顏色標示最大值、最小值和百分位值
您可以使用 select
和 style
屬性,指定笛卡爾圖表中最大和最小資料值的顏色,以及任何低於指定百分比的值。
食材
事前準備
如要建立含有條件式格式的笛卡爾圖表,請完成下列步驟:
- 建立探索項目的權限,以及探索資料的相關知識
can_override_vis_config
權限:可存取圖表設定編輯器- 儲存內容的權限 (如果您想將轉換為圖表儲存為 Look 或資訊主頁)
- 熟悉 JSON
範例:資料欄檢視圖
業務團隊希望能夠快速找出一年內的每月銷售趨勢。他們使用圖表顯示按月份分組的總費用。
你可以使用條件式格式,標示符合特定目標的值,讓使用者更容易理解資料。
在本例中,銷售團隊想強調下列值:
- 資料欄的「總費用」值越低,顏色就會越深。
- 總費用值最高的資料欄會以綠色顯示。
- 位於下三十百分位以下的任何欄位 (總費用) 會以橘色顯示。
- 所有其他欄都會顯示為灰色。
如要將這項條件設定格式套用至笛卡爾圖表,請按照下列步驟操作:
- 在探索中查看笛卡爾圖表,或在觀點或資訊主頁中編輯笛卡爾圖表。
- 在圖表中開啟「編輯」選單。
- 按一下「Plot」分頁中的「Edit Chart Config」按鈕。Looker 會顯示「Edit Chart Config」對話方塊。
選取「圖表設定 (覆寫)」部分,然後輸入以下 JSON:
{ series: [{ color: 'gray', formatters: [{ select: 'max', style: { color: 'green', } }, { select: 'percent_rank <= 0.3', style: { color: 'orange' } }, { select: 'min', style: { color: 'red' } }, ] }] }
如要套用變更,請按一下「套用」。
如今,銷售團隊可以快速查看哪些月份的業績不佳,並針對這些月份進行調查,找出原因。
自訂完成後,您可以儲存圖表。如果您在「探索」中查看了視覺化資料,請儲存「探索」。如果您編輯了 Look 或資訊主頁,請按一下「儲存」。
範例:散佈圖視覺化
如要將條件式格式套用至散布圖示圖,您可以為 style.marker.fillColor
和 style.marker.lineColor
屬性指定顏色,而非 style.color
屬性。
lineColor
屬性會設定散布圖中每個點的輪廓顏色。fillColor
屬性會設定散布圖中每個點的內部顏色。
您可以按照下列步驟修改上述範例:
- 在探索中查看散布圖視覺化資料,或在 Look 或資訊主頁中編輯散布圖視覺化資料。
- 在圖表中開啟「編輯」選單。
- 按一下「Plot」分頁中的「Edit Chart Config」按鈕。Looker 會顯示「Edit Chart Config」對話方塊。
選取「圖表設定 (覆寫)」部分,然後輸入以下 JSON:
{ series: [{ color: 'gray', formatters: [{ select: 'max', style: { marker: { fillColor: 'green', lineColor: 'green' } } }, { select: 'percent_rank <= 0.3', style: { marker: { fillColor: 'orange', lineColor: 'orange' } } }, { select: 'min', style: { marker: { fillColor: 'red', lineColor: 'red' } } } ] }] }
按一下「套用」套用變更。
在產生的視覺化報表中,最小值、最大值和底部 30% 的值會根據格式設定規則套用顏色。
自訂完成後,您可以儲存圖表。如果您在「探索」中查看了視覺化資料,請儲存「探索」。如果您編輯了 Look 或資訊主頁,請按一下「儲存」。
合併條件式格式設定條件
您可以在 select
屬性中使用 AND
和 OR
,在條件式格式設定規則中結合邏輯運算式。
食材
事前準備
如要建立含有條件式格式的笛卡爾圖表,請完成下列步驟:
- 建立探索項目的權限,以及探索資料的相關知識
can_override_vis_config
權限:可存取圖表設定編輯器- 儲存內容的權限 (如果您想將轉換為圖表儲存為 Look 或資訊主頁)
- 熟悉 JSON
範例
銷售團隊希望能快速找出符合特定條件的月份。他們使用圖表顯示按月份分組的總費用。
你可以使用條件式格式,標示符合特定目標的值,讓使用者更容易理解資料。
在本例中,銷售團隊想強調下列值:
- 總費用值介於 $43,000 美元至 $45,000 美元 (含) 之間的任何資料欄都會顯示為紫色。
- 所有其他欄都會顯示為灰色。
如要將這項條件設定格式套用至笛卡爾圖表,請按照下列步驟操作:
- 在探索中查看笛卡爾圖表,或在觀點或資訊主頁中編輯笛卡爾圖表。
- 在圖表中開啟「編輯」選單。
- 按一下「Plot」分頁中的「Edit Chart Config」按鈕。Looker 會顯示「Edit Chart Config」對話方塊。
選取「圖表設定 (覆寫)」部分,然後輸入以下 JSON:
{ series: [{ color: 'gray', formatters: [{ select: 'value >= 43000 AND value <= 45000', style: { color: 'purple', } }, ] }] }
如要套用變更,請按一下「套用」。
如今,銷售團隊可以快速查看 3 月、4 月和 9 月的收益介於 $43,000 美元和 $45,000 美元之間,並採取進一步行動,瞭解這幾個月的情況。
自訂完成後,您可以儲存圖表。如果您在「探索」中查看了視覺化資料,請儲存「探索」。如果您編輯了 Look 或資訊主頁,請按一下「儲存」。