ขั้นตอนการทำงานทั่วไปในการดูการเปลี่ยนแปลงในการแสดงภาพข้อมูลจากชุมชนของคุณคือ อัปโหลดไฟล์ไปยัง GCS แล้วรีเฟรชรายงาน Looker Studio วิธีนี้ได้ผล แต่หมายความว่าคุณจะต้องใช้เวลา เพื่อรอดูการเปลี่ยนแปลง dscc-gen ทำให้เวิร์กโฟลว์ดูการเปลี่ยนแปลงโค้ดภาพของคุณได้ทันที ซึ่งช่วยลด เวลาที่ใช้ในการเขียนการแสดงภาพข้อมูลจากชุมชน
ในการเริ่มต้นใช้งาน ให้ตรวจสอบว่าได้ติดตั้ง npm 5.2.0 หรือใหม่กว่าและ gsutil ไว้แล้ว จากนั้นให้ทำดังนี้ เรียกใช้:
npx @google/dscc-gen viz
การกำหนดค่าครั้งแรก
dscc-gen มาพร้อมกับชุดข้อมูลในเครื่องเริ่มต้นซึ่งอาจไม่ได้เป็นตัวแทน
ของข้อมูลที่ต้องการให้เห็นภาพ หากต้องการอัปเดตชุดข้อมูลนี้ให้ตรงตามความต้องการของคุณ ให้ทำดังนี้
- อัปเดตการกำหนดค่าที่
src/index.json - เรียกใช้
npm run update_messageซึ่งจะทำให้การแสดงข้อมูลผ่านภาพไปยัง ที่เก็บข้อมูลdevที่แสดงข้อความในรูปแบบที่คัดลอกได้ง่าย - สร้างรายงานใหม่และเชื่อมต่อกับชุดข้อมูลที่เป็นตัวแทนของชุดข้อมูล ข้อมูลที่ต้องการแสดงเป็นภาพ
- เพิ่มการแสดงภาพข้อมูลจากชุมชนโดยใช้ที่เก็บข้อมูล
devเป็นคอมโพเนนต์ ID - คัดลอกเนื้อหาของการแสดงภาพไปที่
scripts/data/localData.jsช่วงเวลานี้ ข้อมูล จะถูกใช้เมื่อคุณพัฒนาภายในท้องถิ่น
สคริปต์
สคริปต์ต่อไปนี้ใช้ได้กับโปรเจ็กต์การแสดงภาพที่สร้างด้วย
dscc-gen
| คำสั่ง | การดำเนินการ |
|---|---|
npm run start
|
เริ่มต้นเซิร์ฟเวอร์ภายในและดูตัวอย่าง การแสดงข้อมูลผ่านภาพ |
npm run update_message |
อัปเดตข้อความโดยใช้ objectFormat |
npm run build:dev
|
สร้างไฟล์จาก ./src ไปยัง ./build ด้วย
caching ปิดอยู่ |
npm run push:dev |
คัดลอกไฟล์จาก build ไปยังที่เก็บข้อมูล dev |
npm run build:prod
|
สร้างไฟล์จาก ./src ไปยัง ./build ด้วย
caching เปิดใช้งาน |
npm run push:prod
|
คัดลอกไฟล์จาก build ไปยัง prod
|
คำสั่ง update_message มีค่าเริ่มต้นเป็น objectFormat วิธีใช้
tableFormat ให้แก้ไขพารามิเตอร์ในสคริปต์ update_message ใน
package.json จาก -f object ถึง -f table
Codelab
หากต้องการดูวิธีใช้เครื่องมือ โปรดดู codelab ของ dscc-gen
