Szybciej zapisuj wizualizacje dzięki dscc-gen

Aby zobaczyć zmiany w wizualizacji utworzonej przez społeczność, zwykle prześlij pliki do GCS, a następnie odśwież raport Looker Studio. To działa, ale oznacza to, że oczekiwanie na pojawienie się zmian może zająć dużo czasu. dscc-gen umożliwia przepływowi pracy natychmiastowego sprawdzenia zmian w kodzie wizualizacji, ograniczając czas potrzebny na opracowanie wizualizacji utworzonej przez społeczność.

Na początek upewnij się, że są zainstalowane npm w wersji 5.2.0 lub nowszej oraz gsutil. Następnie: bieg:

npx @google/dscc-gen viz

Konfiguracja po raz pierwszy

dscc-gen zawiera domyślny lokalny zbiór danych, który prawdopodobnie nie jest reprezentatywny z danymi, które chcesz zwizualizować. Aby dostosować ten zbiór danych do swoich potrzeb:

  1. Zaktualizuj konfigurację na src/index.json.
  2. Uruchom npm run update_message. Spowoduje to wdrożenie wizualizacji w Zasobnik dev, w którym wyświetla się wiadomość w formacie łatwym do skopiowania.
  3. Utwórz nowy raport i połącz się ze zbiorem danych reprezentującym które chcesz zwizualizować.
  4. Dodaj wizualizację utworzoną przez społeczność, używając zasobnika dev jako komponentu. ID.
  5. Skopiuj zawartość wizualizacji do scripts/data/localData.js. Ten dane będą używane podczas programowania lokalnego.

Skrypty

W projektach wizualizacji utworzonych za pomocą dscc-gen

Polecenie Działanie
npm run start Uruchom serwer lokalny i wyświetl podgląd wizualizacja
npm run update_message Zaktualizuj wiadomość za pomocą obiektu objectFormat
npm run build:dev Utwórz pliki z ./src w ./build za pomocą buforowanie wyłączone.
npm run push:dev Skopiuj pliki z folderu build do zasobnika dev.
npm run build:prod Utwórz pliki z ./src w ./build za pomocą buforowanie włączone.
npm run push:prod Skopiuj pliki z usługi build do urządzenia prod zasobnika.

Wartość domyślna polecenia update_message to objectFormat. Aby użyć funkcji tableFormat, zmodyfikuj parametry w skrypcie update_message w package.json od -f object do -f table.

Ćwiczenia z programowania

Aby dowiedzieć się, jak używać tego narzędzia, zapoznaj się z laboratorium dscc-gen.

Ćwiczenie w Codelabs dotyczące DSCC