dscc-gen দিয়ে আপনার ভিজ্যুয়ালাইজেশন দ্রুত লিখুন

আপনার সম্প্রদায়ের ভিজ্যুয়ালাইজেশনে পরিবর্তনগুলি দেখার জন্য সাধারণ ওয়ার্কফ্লো হল আপনার ফাইলগুলি GCS-এ আপলোড করা , তারপরে আপনার লুকার স্টুডিও রিপোর্ট রিফ্রেশ করা। এটি কাজ করে, তবে এর অর্থ হল আপনি পরিবর্তনগুলি দেখার জন্য অপেক্ষা করতে অনেক সময় ব্যয় করতে পারেন। dscc-gen আপনার ভিজ্যুয়ালাইজেশন কোডের পরিবর্তনগুলি অবিলম্বে দেখতে একটি ওয়ার্কফ্লো সক্ষম করে, একটি কমিউনিটি ভিজ্যুয়ালাইজেশন লিখতে যে সময় লাগে তা হ্রাস করে।

শুরু করতে, নিশ্চিত করুন যে npm 5.2.0 বা তার পরে এবং 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 দিয়ে তৈরি ভিজ্যুয়ালাইজেশন প্রকল্পগুলির জন্য উপলব্ধ।

আদেশ কর্ম
npm run start স্থানীয় সার্ভার শুরু করুন এবং আপনার ভিজ্যুয়ালাইজেশনের পূর্বরূপ দেখুন
npm run update_message অবজেক্ট ফরম্যাট ব্যবহার করে বার্তা আপডেট করুন
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 কমান্ড অবজেক্ট ফরম্যাটে ডিফল্ট। tableFormat ব্যবহার করতে, package.jsonupdate_message স্ক্রিপ্টে -f object থেকে -f table প্যারামিটারগুলি সম্পাদনা করুন।

কোডল্যাব

টুলিং কিভাবে ব্যবহার করবেন তা জানতে, dscc-gen codelab পর্যালোচনা করুন।

ডিএসসিসি-জেন কোডল্যাব