Opcje danych i stylu na potrzeby wizualizacji utworzonej przez społeczność są zdefiniowane w pliku JSON config. Konfiguracja data określa liczbę wymiarów i danych obsługiwanych przez wizualizację. Konfiguracja style określa selektory stylów dostępne w panelu właściwości.
Konfiguracja danych
Konfiguracja data określa elementy DIMENSION i METRIC, które Looker Studio renderuje w panelu właściwości. Każdy element odpowiada polom wymiarów i elementów, które użytkownik udostępnia jako dane wejściowe do wizualizacji.
Przykładowy element danych:
{
"id": "twoDimensionsPlease",
"label": "Dimension Element Heading",
"type": "DIMENSION",
"options": {
"min": 2,
"max": 2,
}
}
Wartość id definiowana w elemencie danych jest uwzględniana w informacjach, na które odpowiada Looker Studio. Pole label określa tekst, który użytkownicy widzą nad sekcją danych, a pole type określa, czy chodzi o wymiar czy dane. Obiekt options określa minimalną i maksymalną liczbę pól, które użytkownik może dodać do elementu danych.
W elemencie danych DIMENSION obiekt options obsługuje opcjonalny klucz supportedTypes. Jeśli są zdefiniowane, Looker Studio ogranicza typ pól wymiarów, które można dodawać do elementu. Wartość supportedTypes to tablica, która może zawierać dowolną kombinację wartości „DEFAULT”, „TIME” i „GEO”.
Sekcja danych grupuje wiele elementów danych. Looker Studio renderuje label jako nagłówek wielu elementów danych.
Sekcja przykładowych danych:
{
"id": "dimensionSection1",
"label": "Dimension Section Heading",
"elements":[
// array of data elements
]
}
Zrzut ekranu pokazuje, jak Looker Studio renderuje sekcję danych i element danych powyżej:
Konfiguracja stylu
Konfiguracja stylu określa selektory stylów, które są renderowane w panelu właściwości.
Przykładowy element stylu:
{
"id": "linkOpacity",
"label": "Link opacity",
"type": "OPACITY",
"defaultValue": "0.2"
}
label określa tekst, który użytkownicy widzą jako etykietkę, a type określa rodzaj selektora stylu renderowany przez Looker Studio. Opcjonalnie defaultValue określa wartość domyślną każdego elementu stylu.
Podobnie jak w przypadku elementów danych elementy stylu są definiowane w sekcjach, które udostępniają nagłówki i grupowania logiczne. Pełną listę dostępnych selektorów znajdziesz w dokumentacji dotyczącej konfiguracji.
Przykładowa sekcja stylu:
{
"id": "styleGroup1",
"label": "Header for style group",
"elements": [
// insert Style Elements here
]
}
Zrzut ekranu poniżej pokazuje przykładowy panel stylu z selektorem przezroczystości, przy czym etykietka „Przezroczystość linku” odpowiada wartości label w elemencie stylu.
Konfiguracja interakcji
Konfiguracja interaction określa, jak interakcje na wykresie działają na potrzeby wizualizacji społeczności. Nie jest to jednak wymagane.
Przykład:
{
"id": "onClick",
"supportedActions": ["FILTER"]
}
Obecnie obsługiwana jest tylko opcja FILTER. Jeśli skonfigurujesz interakcje, w panelu właściwości pojawi się pole wyboru.
Konfiguracja funkcji
Konfiguracja features pozwala włączać i wyłączać różne funkcje wizualizacji utworzonej przez społeczność. Ta sekcja jest opcjonalna. Listę funkcji znajdziesz w dokumentacji referencyjnej.
Przykład:
"features": {
"enableComparisonDateRange": true
}
Przykład
Przykład konfiguracji wizualizacji znajdziesz w przykładowej konfiguracji.
Dalsze kroki
Po zdefiniowaniu konfiguracji utwórz wizualizację.