Dane i opcje stylu wizualizacji społeczności są zdefiniowane w pliku JSON config. Konfiguracja data określa liczbę wymiarów i rodzajów danych, które obsługuje wizualizacja. Konfiguracja style określa selektory stylów dostępne w panelu właściwości.
Konfiguracja danych
Konfiguracja data definiuje elementy DIMENSION i METRIC, które Looker Studio renderuje w panelu właściwości. Każdy element odpowiada polom wymiaru i elementu, które użytkownik podaje jako dane wejściowe do wizualizacji.
Przykładowy element danych:
{
"id": "twoDimensionsPlease",
"label": "Dimension Element Heading",
"type": "DIMENSION",
"options": {
"min": 2,
"max": 2,
}
}
id zdefiniowany w elemencie danych jest uwzględniany w informacjach, które zwraca Looker Studio. Parametr label określa tekst, który użytkownicy widzą nad sekcją danych, a parametr type określa, czy jest to wymiar, czy rodzaj danych. 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 jest zdefiniowany, Looker Studio ogranicza typ pól wymiarów, które można dodać 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 znaklabel jako nagłówek wielu elementów danych.
Sekcja Przykładowe dane:
{
"id": "dimensionSection1",
"label": "Dimension Section Heading",
"elements":[
// array of data elements
]
}
Ten 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"
}
Atrybut label określa tekst, który użytkownicy widzą jako etykietkę, a atrybut type określa rodzaj selektora stylu renderowanego przez Looker Studio. OpcjonalniedefaultValue określa wartość domyślną każdego elementu stylu.
Podobnie jak elementy danych, elementy stylu są zdefiniowane w sekcjach, które zawierają nagłówki i logiczne grupy. Pełną listę dostępnych selektorów znajdziesz w dokumentacji konfiguracji.
Przykładowa sekcja stylu:
{
"id": "styleGroup1",
"label": "Header for style group",
"elements": [
// insert Style Elements here
]
}
Zrzut ekranu poniżej przedstawia przykład panelu stylu z selektorem krycia, w którym etykietka „Krycie linku” odpowiada elementowi label w elemencie stylu.
Konfiguracja interakcji
interaction Konfiguracja określa, jak interakcje z wykresem działają w przypadku wizualizacji społecznościowej. Nie jest to jednak wymagane.
Przykład:
{
"id": "onClick",
"supportedActions": ["FILTER"]
}
Obecnie obsługiwana jest tylko forma FILTER. Jeśli skonfigurujesz interakcje, w panelu właściwości pojawi się pole wyboru.
Konfiguracja funkcji
Konfiguracja features może włączać i wyłączać różne funkcje w wizualizacji społecznościowej. Ta sekcja jest opcjonalna. Listę funkcji znajdziesz w dokumentacji konfiguracji.
Przykład:
"features": {
"enableComparisonDateRange": true
}
Przykład
Przykładową konfigurację wizualizacji znajdziesz w tym pliku.
Dalsze kroki
Po zdefiniowaniu konfiguracji napisz wizualizację.