كتابة العروض المرئية بشكل أسرع باستخدام dscc-gen

تتمثّل خطوات سير العمل النموذجية للاطّلاع على التغييرات في العرض المرئي لبيانات المنتدى في تحميل ملفاتك إلى GCS، ثم إعادة تحميل تقرير Data Studio. هذا الإجراء فعّال، ولكنّه يستغرق وقتًا طويلاً. تتيح أداة dscc-gen سير عمل يتيح الاطّلاع على تغييرات رمز التمثيل المرئي على الفور، ما يقلّل الوقت المستغرَق في كتابة العرض المرئي لبيانات المنتدى.

للبدء، تأكَّد من تثبيت الإصدار 5.2.0 أو إصدار أحدث من npm وgsutil. بعد ذلك، نفِّذ الأمر التالي:

npx @google/dscc-gen viz

الإعداد لأول مرة

تتضمّن dscc-gen مجموعة بيانات محلية تلقائية قد لا تكون تمثّل البيانات التي تريد عرضها. لتعديل مجموعة البيانات هذه بما يتناسب مع احتياجاتك، اتّبِع الخطوات التالية:

  1. عدِّل إعداداتك على src/index.json.
  2. تشغيل npm run update_message يؤدي ذلك إلى نشر تمثيل مرئي في حزمة dev يعرض الرسالة بتنسيق يسهل نسخه.
  3. أنشئ تقريرًا جديدًا واربطه بمجموعة بيانات تمثّل البيانات التي تريد عرضها.
  4. أضِف العرض المرئي لبيانات المنتدى باستخدام حزمة dev كمعرّف للمكوّن.
  5. انسخ محتوى التمثيل المرئي إلى scripts/data/localData.js. سيتم استخدام هذه البيانات عند التطوير على الجهاز.

النصوص البرمجية

تتوفّر النصوص البرمجية التالية لمشاريع التصوّر التي تم إنشاؤها باستخدام dscc-gen.

Command الإجراء
npm run start بدء الخادم المحلي ومعاينة التمثيل المرئي
npm run update_message عدِّل الرسالة باستخدام objectFormat
npm run build:dev إنشاء ملفات من ./src إلى ./build مع إيقاف التخزين المؤقت
npm run push:dev انسخ الملفات من الحزمة build إلى الحزمة dev.
npm run build:prod إنشاء ملفات من ./src في ./build مع تفعيل التخزين المؤقت
npm run push:prod انسخ الملفات من build إلى حزمة prod.

يتم ضبط الأمر update_message تلقائيًا على objectFormat. لاستخدام tableFormat، عدِّل المَعلمات في النص البرمجي update_message في package.json من -f object إلى -f table.

درس تطبيقي حول الترميز

للتعرّف على كيفية استخدام الأدوات، راجِع الدرس التطبيقي حول الترميز dscc-gen.

dscc-gen codelab