Menulis visualisasi Anda lebih cepat dengan dscc-gen

Alur kerja umum untuk melihat perubahan dalam visualisasi komunitas Anda adalah dengan mengupload file ke GCS, lalu memperbarui laporan Looker Studio. Cara ini dapat dilakukan, tetapi berarti Anda dapat menghabiskan banyak waktu untuk menunggu perubahan. dscc-gen memungkinkan alur kerja untuk segera melihat perubahan kode visualisasi Anda, sehingga mengurangi waktu yang diperlukan untuk menulis visualisasi komunitas.

Untuk memulai, pastikan npm 5.2.0 atau yang lebih baru dan gsutil sudah diinstal. Kemudian, jalankan:

npx @google/dscc-gen viz

Konfigurasi Pertama Kali

dscc-gen dilengkapi dengan set data lokal default yang mungkin tidak mewakili data yang ingin Anda visualisasikan. Untuk memperbarui {i>dataset<i} ini agar sesuai dengan kebutuhan Anda:

  1. Perbarui konfigurasi di src/index.json.
  2. Jalankan npm run update_message. Tindakan ini akan men-deploy visualisasi ke bucket dev Anda yang menampilkan pesan dalam format yang mudah disalin.
  3. Buat laporan baru dan hubungkan ke set data yang mewakili data yang ingin Anda visualisasikan.
  4. Tambahkan visualisasi komunitas menggunakan bucket dev sebagai ID komponen Anda.
  5. Salin konten visualisasi ke scripts/data/localData.js. Data ini akan digunakan saat Anda melakukan pengembangan secara lokal.

Skrip

Skrip berikut tersedia untuk project visualisasi yang dibuat dengan dscc-gen.

Perintah Tindakan
npm run start Mulai server lokal dan pratinjau visualisasi Anda
npm run update_message Mengupdate pesan menggunakan objectFormat
npm run build:dev Build file dari ./src ke ./build dengan cache dinonaktifkan.
npm run push:dev Salin file dari build ke bucket dev Anda.
npm run build:prod Build file dari ./src ke ./build dengan cache diaktifkan.
npm run push:prod Salin file dari build ke bucket prod Anda.

Perintah update_message ditetapkan secara default ke objectFormat. Untuk menggunakan tableFormat, edit parameter dalam skrip update_message di package.json dari -f object menjadi -f table.

Codelab

Untuk mempelajari cara menggunakan alat ini, tinjau codelab generasi dscc.

codelab dscc-gen