লুকার স্টুডিওতে আপনার সমস্ত ডেটা সংযুক্ত করুন এবং কল্পনা করুন৷

1. ভূমিকা

লুকার স্টুডিও আপনাকে বিনামূল্যে সুন্দর ডেটা ভিজ্যুয়ালাইজেশন সহ লাইভ, ইন্টারেক্টিভ ড্যাশবোর্ড তৈরি করতে দেয়। বিভিন্ন উত্স থেকে আপনার ডেটা আনুন এবং সম্পূর্ণ সম্পাদনা এবং ভাগ করার ক্ষমতা সহ লুকার স্টুডিওতে সীমাহীন প্রতিবেদন তৈরি করুন৷ নিম্নলিখিত স্ক্রিনশটটি একটি উদাহরণ লুকার স্টুডিও ড্যাশবোর্ড:

2f296fddf6af7393.png

( লুকার স্টুডিওতে এই উদাহরণ প্রতিবেদনটি দেখতে এখানে ক্লিক করুন )

কমিউনিটি কানেক্টর হল লুকার স্টুডিওর একটি বৈশিষ্ট্য যা আপনাকে যেকোনো ইন্টারনেট অ্যাক্সেসযোগ্য ডেটা উৎসে সংযোগকারী তৈরি করতে Apps Script ব্যবহার করতে দেয়। কমিউনিটি সংযোগকারীগুলি লুকার স্টুডিও সম্প্রদায় দ্বারা নির্মিত। তার মানে যে কেউ কমিউনিটি সংযোগকারী তৈরি করতে পারে। আপনি অন্যান্য লোকেদের সাথে সম্প্রদায় সংযোগকারীগুলিকে ভাগ করতে পারেন যাতে তারা লুকার স্টুডিও থেকে তাদের নিজস্ব ডেটা অ্যাক্সেস করতে পারে৷

আপনি বিভিন্ন ব্যবহারের ক্ষেত্রে কমিউনিটি সংযোগকারী ব্যবহার করতে পারেন:

  • আপনি একটি বাণিজ্যিক প্ল্যাটফর্ম থেকে ডেটা ভিজ্যুয়ালাইজ করছেন (যেমন সোশ্যাল মিডিয়া, মার্কেটিং, অ্যানালিটিক্স ইত্যাদি)
  • আপনি অন-প্রিমাইজ এন্টারপ্রাইজ ডেটা ভিজ্যুয়ালাইজ করছেন (যেমন একটি অন-প্রিমিস মাইএসকিউএল ডাটাবেস থেকে বিক্রয় ডেটা)
  • আপনি আপনার গ্রাহকদের আপনার পরিষেবা থেকে তাদের ডেটা কল্পনা করার জন্য একটি উপায় প্রদান করছেন
  • আপনি একটি পুশ বোতাম রিপোর্টিং প্ল্যাটফর্ম তৈরি করছেন
  • আপনি একটি ওয়েব উৎস থেকে আপনার নিজের ডেটা ভিজ্যুয়ালাইজ করছেন (যেমন আপনার Google Fit ড্যাশবোর্ড তৈরি করা)

আপনি কি শিখবেন

  • লুকার স্টুডিও কমিউনিটি সংযোগকারী কীভাবে কাজ করে
  • একটি সম্প্রদায় সংযোগকারী তৈরি করতে Google Apps স্ক্রিপ্ট কীভাবে ব্যবহার করবেন
  • লুকার স্টুডিওতে সম্প্রদায় সংযোগকারীগুলি কীভাবে ব্যবহার করবেন

আপনি কি প্রয়োজন হবে

  • ইন্টারনেট এবং একটি ওয়েব ব্রাউজারে অ্যাক্সেস
  • একটি Google অ্যাকাউন্ট
  • মৌলিক জাভাস্ক্রিপ্ট এবং ওয়েব API এর সাথে পরিচিতি

2. দ্রুত সমীক্ষা

কেন আপনি এই কোডল্যাব চয়ন করেছেন?

আমি সাধারণভাবে ডেটা ভিজ্যুয়ালাইজেশনে আগ্রহী। আমি লুকার স্টুডিও সম্পর্কে আরও জানতে চাই আমি আমার নিজস্ব কমিউনিটি সংযোগকারী তৈরি করতে চাই। আমি অন্য প্ল্যাটফর্মের সাথে লুকার স্টুডিওকে সংহত করার চেষ্টা করছি। আমি গুগল ক্লাউড সমাধানে আগ্রহী।

আপনি কিভাবে এই কোডল্যাব/টিউটোরিয়াল ব্যবহার করার পরিকল্পনা করছেন?

শুধুমাত্র মাধ্যমে স্কিম এটি পড়ুন এবং ব্যায়াম সম্পূর্ণ করুন

লুকার স্টুডিওর সাথে আপনার পরিচিতিকে আপনি কীভাবে মূল্যায়ন করবেন?

এটা কখনো শুনিনি আমি জানি এটা কি কিন্তু আমি এটা ব্যবহার করি না। আমি এটি নিয়মিত ব্যবহার করি। আমি একজন বিশেষজ্ঞ ব্যবহারকারী।

আপনার ব্যাকগ্রাউন্ডকে কী সেরা বর্ণনা করে?

বিকাশকারী ব্যবসা / আর্থিক / ডেটা বিশ্লেষক ডেটা সায়েন্টিস্ট/ডেটা ইঞ্জিনিয়ার মার্কেটিং / সোশ্যাল মিডিয়া / ডিজিটাল অ্যানালিটিক্স বিশেষজ্ঞ ডিজাইনার অন্যান্য

সমীক্ষার তথ্য জমা দিতে আপনি পরবর্তী পৃষ্ঠায় যেতে পারেন।

3. সম্প্রদায় সংযোগকারীর ওভারভিউ

লুকার স্টুডিও কমিউনিটি সংযোগকারীরা লুকার স্টুডিও থেকে যেকোনো ইন্টারনেট অ্যাক্সেসযোগ্য ডেটা উৎসে সরাসরি সংযোগ সক্ষম করে। আপনি বাণিজ্যিক প্ল্যাটফর্ম, পাবলিক ডেটাসেট বা আপনার নিজস্ব অন-প্রিমিস ব্যক্তিগত ডেটাতে সংযোগ করতে পারেন। কমিউনিটি সংযোগকারীরা ওয়েব API, JDBC API, ফ্ল্যাট ফাইল (CSV, JSON, XML) এবং Apps স্ক্রিপ্ট পরিষেবাগুলির মাধ্যমে ডেটা আনতে পারে৷

b25b8d6bea6da54b.png

এমন একটি পরিস্থিতি বিবেচনা করুন যেখানে আপনি npm- এ একটি প্যাকেজ প্রকাশ করেছেন এবং আপনি দিনে দিনে প্যাকেজের ডাউনলোড সংখ্যা ট্র্যাক করতে চান। এই কোডল্যাবে, আপনি একটি কমিউনিটি সংযোগকারী তৈরি করবেন যা npm প্যাকেজ ডাউনলোড গণনা API ব্যবহার করে ডেটা নিয়ে আসে। কমিউনিটি কানেক্টর তারপরে লুকার স্টুডিওতে ব্যবহার করা যেতে পারে একটি ড্যাশবোর্ড তৈরি করতে যাতে ডাউনলোডের সংখ্যা কল্পনা করা যায়।

4. সম্প্রদায় সংযোগকারী কর্মপ্রবাহ

একটি মৌলিক সম্প্রদায় সংযোগকারীতে, আপনি চারটি ফাংশন সংজ্ঞায়িত করবেন:

  • getAuthType()
  • getConfig()
  • getSchema()
  • getData()

কর্মপ্রবাহের বর্তমান ধাপের উপর নির্ভর করে, লুকার স্টুডিও এই সংযোগকারী ফাংশনগুলি সম্পাদন করে এবং পরবর্তী ধাপে প্রতিক্রিয়া ব্যবহার করে। নীচের ভিডিওটি এর একটি ওভারভিউ দেয়:

  • একটি সম্প্রদায় সংযোগকারী কিভাবে কাজ করে
  • কর্মপ্রবাহের বিভিন্ন ধাপ
  • যখন বিভিন্ন ফাংশন বলা হয়
  • যখন লুকার স্টুডিও বিভিন্ন ইউজার ইন্টারফেস দেখায়
  • বিভিন্ন ধাপে ব্যবহারকারীর ক্রিয়া প্রত্যাশিত৷

ভিডিওটি দেখার পর আপনি কোডল্যাব পুনরায় চালু করতে পারেন।

এই ওয়ার্কফ্লো মুখস্ত করার কোন প্রয়োজন নেই, শুধু একটি সংযোজকের মধ্যে কি ঘটছে তা বোঝার জন্য একবার দেখুন। আপনি সবসময় এই চিত্রে ফিরে আসতে পারেন।

cc6688bf38749e5.png

পরবর্তী ধাপে, আপনি Google Apps স্ক্রিপ্টে আপনার সংযোগকারী তৈরি করা শুরু করবেন। আপনাকে Apps Script UI এবং এই কোডল্যাবের মধ্যে সামনে পিছনে সুইচ করতে হবে।

5. আপনার Apps স্ক্রিপ্ট প্রকল্প সেট আপ করুন

ধাপ 1: Google Apps স্ক্রিপ্ট দেখুন।

ধাপ 2: উপরের বাম বিভাগে " + নতুন প্রকল্প " ক্লিক করে একটি নতুন অ্যাপ স্ক্রিপ্ট প্রকল্প তৈরি করুন।

fb12d7318d0946cf.png

আপনি Code.gs ফাইলে একটি ফাঁকা myFunction ফাংশন সহ একটি শেল প্রকল্প দেখতে পাবেন।

b245ce5eb3dd2ee2.png

ধাপ 3: myFunction ফাংশন মুছুন।

ধাপ 4: প্রকল্পের একটি নাম দিন:

  1. পৃষ্ঠার উপরের বাম দিকে Untitled project ক্লিক করুন
  2. একটি প্রকল্প শিরোনাম লিখুন.

7172aebc181c91d4.png

Code.gs ফাইলে আপনার সংযোগকারী কোড লিখতে শুরু করুন।

6. getAuthType() সংজ্ঞায়িত করুন

যখন সংযোগকারীর দ্বারা ব্যবহৃত প্রমাণীকরণ পদ্ধতি জানতে হবে তখন Looker Studio getAuthType() ফাংশনটিকে কল করবে। এই ফাংশনটি 3য়-পক্ষের পরিষেবা অনুমোদন করার জন্য সংযোগকারীর দ্বারা প্রয়োজনীয় প্রমাণীকরণ পদ্ধতিটি ফিরিয়ে দেওয়া উচিত।

আপনি যে এনপিএম ডাউনলোড সংযোগকারীটি তৈরি করছেন তার জন্য, আপনাকে কোনও তৃতীয় পক্ষের পরিষেবার সাথে প্রমাণীকরণ করতে হবে না কারণ আপনি যে APIটি ব্যবহার করছেন তার কোনও প্রমাণীকরণের প্রয়োজন নেই৷ নিম্নলিখিত কোডটি অনুলিপি করুন এবং আপনার Code.gs ফাইলে যোগ করুন:

Code.gs 

var cc = DataStudioApp.createCommunityConnector();

function getAuthType() {
  var AuthTypes = cc.AuthType;
  return cc
    .newAuthTypeResponse()
    .setAuthType(AuthTypes.NONE)
    .build();
}

এখানে, আপনি ইঙ্গিত দিচ্ছেন যে আপনার সংযোগকারীর কোনো তৃতীয় পক্ষের প্রমাণীকরণের প্রয়োজন নেই ( AuthTypes.NONE )। সমস্ত সমর্থিত প্রমাণীকরণ পদ্ধতি দেখতে, AuthType() রেফারেন্স দেখুন।

7. getConfig() সংজ্ঞায়িত করুন

আপনার সংযোগকারীর ব্যবহারকারীরা এটি ব্যবহার শুরু করার আগে সংযোগকারীটিকে কনফিগার করতে হবে৷ getConfig() ফাংশন প্রতিক্রিয়া ব্যবহারকারীরা যে কনফিগারেশন বিকল্পগুলি দেখতে পাবে তা সংজ্ঞায়িত করে। কানেক্টরের কনফিগারেশনের বিবরণ পেতে Looker Studio getConfig() ফাংশনকে কল করে। getConfig() দ্বারা প্রদত্ত প্রতিক্রিয়ার উপর ভিত্তি করে, Looker Studio কানেক্টর কনফিগারেশন স্ক্রীন রেন্ডার করবে এবং নির্দিষ্ট সংযোগকারী আচরণ পরিবর্তন করবে।

কনফিগারেশন স্ক্রিনে, আপনি তথ্য প্রদান করতে পারেন বা নিম্নলিখিত ফর্ম উপাদানগুলি ব্যবহার করে ব্যবহারকারীর ইনপুট পেতে পারেন:

TEXTINPUT

ইনপুট উপাদান

একটি একক-লাইন পাঠ্য বাক্স।

TEXTAREA

ইনপুট উপাদান

একটি মাল্টি-লাইন টেক্সটেরিয়া বক্স।

SELECT_SINGLE

ইনপুট উপাদান

একক-নির্বাচন বিকল্পগুলির জন্য একটি ড্রপডাউন।

SELECT_MULTIPLE

ইনপুট উপাদান

বহু-নির্বাচন বিকল্পগুলির জন্য একটি ড্রপডাউন।

CHECKBOX

ইনপুট উপাদান

একটি একক চেকবক্স যা বুলিয়ান মান ক্যাপচার করতে ব্যবহার করা যেতে পারে।

INFO

ডিসপ্লে এলিমেন্ট

একটি স্ট্যাটিক প্লেইন-টেক্সট বক্স যা ব্যবহারকারীকে নির্দেশাবলী বা তথ্য প্রদান করতে ব্যবহার করা যেতে পারে।

ব্যবহারকারীর নির্দেশাবলী প্রদান করতে INFO উপাদান এবং ব্যবহারকারীর কাছ থেকে ইনপুট প্যাকেজের নাম পেতে একটি TEXTINPUT উপাদান ব্যবহার করুন৷ getConfig() প্রতিক্রিয়াতে, আপনি configParams কী-এর অধীনে এই ফর্ম উপাদানগুলিকে গোষ্ঠীভুক্ত করবেন।

যেহেতু আপনি যে API-এর সাথে সংযোগ করছেন সেটিকে একটি প্যারামিটার হিসাবে তারিখের প্রয়োজন, getConfig() প্রতিক্রিয়াতে dateRangeRequired true হিসাবে সেট করুন। এটি লুকার স্টুডিওকে সমস্ত ডেটা অনুরোধের সাথে তারিখ পরিসীমা প্রদান করতে বলে। যদি আপনার ডেটা উৎসের প্যারামিটার হিসাবে তারিখের প্রয়োজন না হয়, আপনি এটি বাদ দিতে পারেন।

getAuthType() এর বিদ্যমান কোডের নিচে আপনার Code.gs ফাইলে নিম্নলিখিত getConfig() কোড যোগ করুন:

Code.gs 

function getConfig(request) {
  var config = cc.getConfig();
  
  config.newInfo()
    .setId('instructions')
    .setText('Enter npm package names to fetch their download count.');
  
  config.newTextInput()
    .setId('package')
    .setName('Enter a single package name')
    .setHelpText('e.g. googleapis or lighthouse')
    .setPlaceholder('googleapis');
  
  config.setDateRangeRequired(true);
  
  return config.build();
}

এই কনফিগারেশনপ্যারামের উপর ভিত্তি করে, আপনি যখন লুকার স্টুডিওতে সংযোগকারী ব্যবহার করেন, তখন আপনি নিম্নলিখিতগুলির মতো একটি কনফিগারেশন স্ক্রীন দেখার আশা করতে পারেন। কিন্তু পরে যে আরো.

7de872f17e59e92.png

চলুন পরবর্তী ফাংশনে যাওয়া যাক - getSchema() ।

8. getSchema() সংজ্ঞায়িত করুন

সংযোগকারীর জন্য ব্যবহারকারী-নির্বাচিত কনফিগারেশনের সাথে যুক্ত স্কিমা পেতে Looker Studio getSchema() ফাংশনকে কল করে। getSchema() দ্বারা প্রদত্ত প্রতিক্রিয়ার উপর ভিত্তি করে, Looker স্টুডিও সংযোগকারীর সমস্ত ক্ষেত্র তালিকাভুক্ত ব্যবহারকারীকে ফিল্ড স্ক্রীন দেখাবে।

আপনার সংযোগকারীর কোনো নির্দিষ্ট কনফিগারেশনের জন্য, স্কিমা হল সমস্ত ক্ষেত্রের একটি তালিকা যার জন্য সংযোগকারী ডেটা প্রদান করতে পারে। একটি সংযোগকারী বিভিন্ন কনফিগারেশনের উপর ভিত্তি করে বিভিন্ন ক্ষেত্র সহ একটি ভিন্ন স্কিমা ফেরত দিতে পারে। স্কিমাতে এমন ক্ষেত্র থাকতে পারে যেগুলি আপনি আপনার API উত্স থেকে আনেন, যে ক্ষেত্রগুলি আপনি Apps স্ক্রিপ্টে গণনা করেন এবং যে ক্ষেত্রগুলি একটি গণনা করা ক্ষেত্র সূত্র ব্যবহার করে Looker Studio-তে গণনা করা হয়৷ আপনার সংযোগকারী স্কিমার প্রতিটি ক্ষেত্রের মেটাডেটা প্রদান করে, যার মধ্যে রয়েছে:

  • মাঠের নাম
  • ক্ষেত্রের জন্য ডেটা টাইপ
  • শব্দার্থিক তথ্য

আরও জানতে পরে getSchema() এবং Field রেফারেন্স পর্যালোচনা করুন।

আপনার সংযোগকারী কীভাবে আনে তার উপর নির্ভর করে, getSchema() কল করার সময় স্কিমা স্থির বা গতিশীলভাবে গণনা করা হতে পারে। getConfig() থেকে কনফিগারেশন প্যারামিটার যা ব্যবহারকারী দ্বারা সংজ্ঞায়িত করা হয় getSchema () ফাংশনের জন্য request আর্গুমেন্টে প্রদান করা হবে।

এই কোডল্যাবের জন্য, আপনাকে request আর্গুমেন্ট অ্যাক্সেস করতে হবে না। আপনি যখন পরবর্তী সেগমেন্টে getData() ফাংশনের জন্য কোড লিখবেন তখন আপনি request আর্গুমেন্ট সম্পর্কে আরও জানতে পারবেন।

আপনার সংযোগকারীর জন্য, স্কিমা স্থির করা হয়েছে এবং এতে নিম্নলিখিত 3টি ক্ষেত্র রয়েছে:

packageName

npm প্যাকেজের নাম যা ব্যবহারকারী প্রদান করে

downloads

npm প্যাকেজের ডাউনলোড গণনা

day

ডাউনলোড গণনার তারিখ

নীচে আপনার সংযোগকারীর জন্য getSchema() কোড রয়েছে। getFields() হেল্পার ফাংশনটি ক্ষেত্র তৈরিকে বিমূর্ত করে কারণ এই কার্যকারিতা getSchema() এবং getData() উভয়ের জন্যই প্রয়োজন। আপনার Code.gs ফাইলে নিম্নলিখিত কোড যোগ করুন:

Code.gs 

function getFields(request) {
  var cc = DataStudioApp.createCommunityConnector();
  var fields = cc.getFields();
  var types = cc.FieldType;
  var aggregations = cc.AggregationType;
  
  fields.newDimension()
    .setId('packageName')
    .setType(types.TEXT);
  
  fields.newMetric()
    .setId('downloads')
    .setType(types.NUMBER)
    .setAggregation(aggregations.SUM);
  
  fields.newDimension()
    .setId('day')
    .setType(types.YEAR_MONTH_DAY);
  
  return fields;
}

function getSchema(request) {
  var fields = getFields(request).build();
  return { schema: fields };
}

এই স্কিমার উপর ভিত্তি করে, আপনি লুকার স্টুডিওতে সংযোগকারী ব্যবহার করার সময় লুকার স্টুডিও ফিল্ড স্ক্রিনে নিম্নলিখিত ক্ষেত্রগুলি দেখতে পাবেন। কিন্তু পরবর্তীতে যখন আপনি আপনার সংযোগকারী পরীক্ষা করবেন তখন আরও বেশি কিছু।

c7cd7057b202be59.png

চলুন আমাদের শেষ ফাংশনে চলে যাই - getData() ।

9. getData(): পার্ট 1 সংজ্ঞায়িত করুন

লুকার স্টুডিও ডেটা আনার প্রয়োজন হলে getData() ফাংশনকে কল করে। getData() দ্বারা প্রদত্ত প্রতিক্রিয়ার উপর ভিত্তি করে, লুকার স্টুডিও ড্যাশবোর্ডে চার্ট রেন্ডার এবং আপডেট করবে। getData() এই ইভেন্টগুলির সময় কল করা যেতে পারে:

  • ব্যবহারকারী ড্যাশবোর্ডে একটি চার্ট যোগ করে
  • ব্যবহারকারী একটি চার্ট সম্পাদনা করে
  • ব্যবহারকারী ড্যাশবোর্ড দেখে
  • ব্যবহারকারী একটি ফিল্টার বা সম্পর্কিত একটি ডেটা নিয়ন্ত্রণ সম্পাদনা করে
  • লুকার স্টুডিও ডেটার একটি নমুনা প্রয়োজন

এই পৃষ্ঠা থেকে কোন কোড কপি করার কোন প্রয়োজন নেই যেহেতু আপনি সম্পূর্ণ কপি করবেন

getData()

পরবর্তী ধাপে কোড।

request অবজেক্ট বোঝা

লুকার স্টুডিও প্রতিটি getData() কলের সাথে request অবজেক্ট পাস করে। নীচের request বস্তুর গঠন পর্যালোচনা করুন. এটি আপনাকে আপনার getData() ফাংশনের জন্য কোড লিখতে সাহায্য করবে।

request বস্তু গঠন 

{
  configParams: object,
  scriptParams: object,
  dateRange: {
    startDate: string,
    endDate: string
  },
  fields: [
    {
      name: Field.name
    }
  ]
}
  • configParams অবজেক্টে getConfig() এ সংজ্ঞায়িত এবং ব্যবহারকারীর দ্বারা কনফিগার করা পরামিতিগুলির জন্য কনফিগারেশন মান থাকবে।
  • scriptParams অবজেক্টে কানেক্টর এক্সিকিউশনের সাথে প্রাসঙ্গিক তথ্য থাকবে। এই কোডল্যাবের জন্য আপনাকে এটি ব্যবহার করতে হবে না।
  • getConfig() প্রতিক্রিয়াতে অনুরোধ করা হলে dateRange অনুরোধ করা তারিখের সীমা থাকবে।
  • fields সেই ক্ষেত্রগুলির নামের তালিকা থাকবে যার জন্য ডেটা অনুরোধ করা হয়েছে।

আপনার সংযোগকারীর জন্য, getData() ফাংশন থেকে একটি উদাহরণ request এইরকম দেখতে পারে:

{
  configParams: {
    package: 'jquery'
  },
  dateRange: {
    startDate: '2017-07-16',
    endDate: '2017-07-18'
  },
  fields: [
    {
      name: 'day',
    },
    {
      name: 'downloads',
    }
  ]
}

উপরের request getData() কলের জন্য, সংযোগকারী স্কিমার অতিরিক্ত ক্ষেত্র থাকা সত্ত্বেও শুধুমাত্র দুটি ক্ষেত্রের অনুরোধ করা হচ্ছে। পরবর্তী পৃষ্ঠায় এই getData() কলের উদাহরণ প্রতিক্রিয়া এবং সাধারণ getData() প্রতিক্রিয়া কাঠামো থাকবে।

10. getData(): পার্ট 2 সংজ্ঞায়িত করুন

getData() প্রতিক্রিয়াতে, আপনাকে অনুরোধ করা ক্ষেত্রগুলির জন্য স্কিমা এবং ডেটা উভয়ই প্রদান করতে হবে। আপনি কোডটিকে তিনটি ভাগে ভাগ করবেন:

  • অনুরোধ করা ক্ষেত্রগুলির জন্য স্কিমা তৈরি করুন।
  • API থেকে ডেটা আনুন এবং পার্স করুন।
  • অনুরোধ করা ক্ষেত্রগুলির জন্য পার্স করা ডেটা এবং ফিল্টার রূপান্তর করুন।

এই পৃষ্ঠা থেকে কোন কোড কপি করার কোন প্রয়োজন নেই যেহেতু আপনি সম্পূর্ণ কপি করবেন

getData()

পরবর্তী পৃষ্ঠায় কোড।

এটি আপনার সংযোগকারীর জন্য getData() এর গঠন।

function getData(request) {

  // TODO: Create schema for requested fields.
  
  // TODO: Fetch and parse data from API.
  
  // TODO: Transform parsed data and filter for requested fields.

  return {
    schema: <filtered schema>,
    rows: <transformed and filtered data>
  };
}

অনুরোধ করা ক্ষেত্রগুলির জন্য স্কিমা তৈরি করুন 

// Create schema for requested fields
  var requestedFieldIds = request.fields.map(function(field) {
    return field.name;
  });
  var requestedFields = getFields().forIds(requestedFieldIds);

API থেকে ডেটা আনুন এবং পার্স করুন

npm API URL এই বিন্যাসে হবে:

https://api.npmjs.org/downloads/point/{start_date}:{end_date}/{package}

Looker Studio দ্বারা প্রদত্ত request.dateRange.startDate , request.dateRange.endDate , এবং request.configParams.package ব্যবহার করে API-এর জন্য URL তৈরি করুন৷ তারপরে UrlFetchApp (অ্যাপস স্ক্রিপ্ট ক্লাস: রেফারেন্স ) ব্যবহার করে API থেকে ডেটা আনুন। তারপর আনা প্রতিক্রিয়া পার্স করুন.

  // Fetch and parse data from API
  var url = [
    'https://api.npmjs.org/downloads/range/',
    request.dateRange.startDate,
    ':',
    request.dateRange.endDate,
    '/',
    request.configParams.package
  ];
  var response = UrlFetchApp.fetch(url.join(''));
  var parsedResponse = JSON.parse(response).downloads;

অনুরোধ করা ক্ষেত্রগুলির জন্য পার্স করা ডেটা এবং ফিল্টার রূপান্তর করুন

npm API থেকে প্রতিক্রিয়া নিম্নলিখিত বিন্যাসে হবে: 

{
  downloads: [
    {
    day: '2014-02-27',
    downloads: 1904088
    },
    ..
    {
    day: '2014-03-04',
    downloads: 7904294
    }
  ],
  start: '2014-02-25',
  end: '2014-03-04',
  package: 'somepackage'
}

npm API থেকে প্রতিক্রিয়া রূপান্তর করুন এবং নিম্নলিখিত বিন্যাসে getData() প্রতিক্রিয়া প্রদান করুন। যদি এই বিন্যাসটি অস্পষ্ট হয় তবে নিম্নলিখিত অনুচ্ছেদে উদাহরণের প্রতিক্রিয়াটি দেখুন। 

{
  schema: [
    {
      object(Field)
    }
  ],
  rows: [
    {
      values: [string]
    }
  ]
}

প্রতিক্রিয়াতে, schema বৈশিষ্ট্য ব্যবহার করে শুধুমাত্র অনুরোধ করা ক্ষেত্রগুলির জন্য স্কিমা ফেরত দিন। আপনি সারিগুলির একটি তালিকা হিসাবে rows বৈশিষ্ট্য ব্যবহার করে ডেটা ফেরত দেবেন। প্রতিটি সারির জন্য, values ক্ষেত্রের ক্রমটি schema ক্ষেত্রের ক্রমগুলির সাথে মেলে। আমাদের পূর্বের request উদাহরণের উপর ভিত্তি করে, getData() এর প্রতিক্রিয়াটি এরকম দেখাবে: 

{
  schema: requestedFields.build(),
  rows: [
    {
      values: [ 38949, '20170716']
    },
    {
      values: [ 165314, '20170717']
    },
    {
      values: [ 180124, '20170718']
    },
  ]
}

আপনি ইতিমধ্যে স্কিমার উপসেট তৈরি করেছেন। পার্স করা ডেটা রূপান্তর করতে নিম্নলিখিত ফাংশনটি ব্যবহার করুন এবং অনুরোধ করা ক্ষেত্রগুলির জন্য এটি ফিল্টার করুন। 

function responseToRows(requestedFields, response, packageName) {
  // Transform parsed data and filter for requested fields
  return response.map(function(dailyDownload) {
    var row = [];
    requestedFields.asArray().forEach(function (field) {
      switch (field.getId()) {
        case 'day':
          return row.push(dailyDownload.day.replace(/-/g, ''));
        case 'downloads':
          return row.push(dailyDownload.downloads);
        case 'packageName':
          return row.push(packageName);
        default:
          return row.push('');
      }
    });
    return { values: row };
  });
}

11. getData(): পার্ট 3 সংজ্ঞায়িত করুন

সম্মিলিত getData() কোড নিচের মত দেখাবে। আপনার Code.gs ফাইলে নিম্নলিখিত কোড যোগ করুন:

Code.gs 

function responseToRows(requestedFields, response, packageName) {
  // Transform parsed data and filter for requested fields
  return response.map(function(dailyDownload) {
    var row = [];
    requestedFields.asArray().forEach(function (field) {
      switch (field.getId()) {
        case 'day':
          return row.push(dailyDownload.day.replace(/-/g, ''));
        case 'downloads':
          return row.push(dailyDownload.downloads);
        case 'packageName':
          return row.push(packageName);
        default:
          return row.push('');
      }
    });
    return { values: row };
  });
}

function getData(request) {
  var requestedFieldIds = request.fields.map(function(field) {
    return field.name;
  });
  var requestedFields = getFields().forIds(requestedFieldIds);

  // Fetch and parse data from API
  var url = [
    'https://api.npmjs.org/downloads/range/',
    request.dateRange.startDate,
    ':',
    request.dateRange.endDate,
    '/',
    request.configParams.package
  ];
  var response = UrlFetchApp.fetch(url.join(''));
  var parsedResponse = JSON.parse(response).downloads;
  var rows = responseToRows(requestedFields, parsedResponse, request.configParams.package);

  return {
    schema: requestedFields.build(),
    rows: rows
  };
}

আপনি Code.gs ফাইলের সাথে সম্পন্ন! পরবর্তী, ম্যানিফেস্ট আপডেট করুন।

12. ম্যানিফেস্ট আপডেট করুন

অ্যাপস স্ক্রিপ্ট এডিটরে, প্রজেক্ট সেটিংস নির্বাচন করুন > সম্পাদকে "appsscript.json" ম্যানিফেস্ট ফাইল দেখান।

90a68a58bbbb63c4.png

এটি একটি নতুন appsscript.json ম্যানিফেস্ট ফাইল তৈরি করবে।

1081c738d5d577a6.png

নিম্নলিখিত দিয়ে আপনার appscript.json ফাইলটি প্রতিস্থাপন করুন:

appsscript.json 

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",

  "dataStudio": {
    "name": "npm Downloads - From Codelab",
    "logoUrl": "https://raw.githubusercontent.com/npm/logos/master/npm%20logo/npm-logo-red.png",
    "company": "Codelab user",
    "companyUrl": "https://developers.google.com/looker-studio/",
    "addonUrl": "https://github.com/googledatastudio/example-connectors/tree/master/npm-downloads",
    "supportUrl": "https://github.com/googledatastudio/community-connectors/issues",
    "description": "Get npm package download counts.",
    "sources": ["npm"]
  }
}

অ্যাপস স্ক্রিপ্ট প্রকল্প সংরক্ষণ করুন.

5701ece1c89415c.png

অভিনন্দন! আপনি আপনার প্রথম সম্প্রদায় সংযোগকারী তৈরি করেছেন এবং এটি একটি টেস্ট ড্রাইভের জন্য প্রস্তুত!

13. লুকার স্টুডিওতে আপনার সংযোগকারী পরীক্ষা করুন

স্থাপনা ব্যবহার করুন

ধাপ 1: অ্যাপস স্ক্রিপ্ট ডেভেলপমেন্ট এনভায়রনমেন্টে, টেস্ট ডিপ্লয়মেন্ট ডায়ালগ খুলতে Deploy > Test deployments- এ ক্লিক করুন।

3f57ea0feceb2596.png

ডিফল্ট স্থাপনা, প্রধান স্থাপনা , তালিকাভুক্ত করা হবে।

ধাপ 2: হেড ডিপ্লয়মেন্ট আইডি কপি করতে কপি ক্লিক করুন।

ধাপ 3: লুকার স্টুডিওতে আপনার সংযোগকারী লোড করতে, আপনার সংযোগকারীর প্রধান স্থাপনার আইডি দিয়ে নিচের লিঙ্কে <HEAD_DEPLOYMENT_ID> স্থানধারকটি প্রতিস্থাপন করুন এবং আপনার ব্রাউজারে লিঙ্কটি অনুসরণ করুন: 

https://lookerstudio.google.com/datasources/create?connectorId=<HEAD_DEPLOYMENT_ID>

সংযোগকারীকে অনুমোদন করুন

প্রথমবার লুকার স্টুডিও ব্যবহারকারী: আপনি যদি আগে লুকার স্টুডিও ব্যবহার না করে থাকেন, তাহলে আপনাকে লুকার স্টুডিও অনুমোদন করতে এবং শর্তাবলীতে সম্মত হতে বলা হবে। অনুমোদন প্রক্রিয়া সম্পূর্ণ করুন। আপনি যখন প্রথম লুকার স্টুডিও ব্যবহার করেন, তখন আপনি আপনার বিপণন পছন্দগুলি আপডেট করার জন্য একটি ডায়ালগও দেখতে পারেন৷ আপনি যদি ইমেলের মাধ্যমে সাম্প্রতিক বৈশিষ্ট্য, আপডেট এবং পণ্যের ঘোষণা সম্পর্কে জানতে চান তাহলে পণ্যের ঘোষণার জন্য সাইন আপ করুন।

একবার লোড হয়ে গেলে, আপনি আপনার সংযোগকারীকে অনুমোদন করার জন্য একটি প্রম্পট দেখতে পাবেন।

d7e66726a1e64c05.png

অনুমোদন ক্লিক করুন এবং সংযোগকারীকে প্রয়োজনীয় অনুমোদন প্রদান করুন।

সংযোগকারী কনফিগার করুন

অনুমোদন সম্পূর্ণ হলে, এটি কনফিগারেশন স্ক্রীন দেখাবে। টেক্সট ইনপুট এলাকায় " বাতিঘর " টাইপ করুন এবং উপরের ডানদিকে সংযোগ ক্লিক করুন৷

ec7416d6dbeabc8f.png

স্কিমা নিশ্চিত করুন

আপনি ক্ষেত্রের পর্দা দেখতে পাবেন. উপরে ডানদিকে রিপোর্ট তৈরি করুন ক্লিক করুন।

4a9084bd51d2fbb8.png

আপনার ড্যাশবোর্ড তৈরি করুন

আপনি লুকার স্টুডিও ড্যাশবোর্ড পরিবেশে থাকবেন। রিপোর্টে যোগ করুন ক্লিক করুন।

1ca21e327308237c.png

লুকার স্টুডিওতে, যখনই একজন ব্যবহারকারী একটি সংযোগকারী অ্যাক্সেস করে এবং একটি নতুন কনফিগারেশন যোগ করে, ব্যবহারকারীর লুকার স্টুডিও অ্যাকাউন্টে একটি নতুন ডেটা উৎস তৈরি করা হয়। আপনি একটি নির্দিষ্ট কনফিগারেশনের উপর ভিত্তি করে সংযোগকারীর একটি ইনস্ট্যান্টিয়েশন হিসাবে একটি ডেটা উৎসের কথা ভাবতে পারেন। ব্যবহারকারীর নির্বাচিত সংযোগকারী এবং কনফিগারেশনের উপর ভিত্তি করে, একটি ডেটা উৎস একটি নির্দিষ্ট ক্ষেত্র সহ একটি ডেটা টেবিল ফেরত দেবে। ব্যবহারকারীরা একই সংযোগকারী থেকে একাধিক ডেটা উত্স তৈরি করতে পারেন। একটি ডেটা উত্স একাধিক প্রতিবেদনে ব্যবহার করা যেতে পারে এবং একই প্রতিবেদন একাধিক ডেটা উত্স ব্যবহার করতে পারে।

এখন একটি টাইম সিরিজ চার্ট যোগ করুন! মেনুতে, সন্নিবেশ > সময় সিরিজে ক্লিক করুন। তারপর ক্যানভাসে টাইম সিরিজ রাখুন। আপনি নির্বাচিত প্যাকেজের জন্য npm ডাউনলোড গণনার একটি টাইম সিরিজ চার্ট দেখতে পাবেন। একটি তারিখ ফিল্টার নিয়ন্ত্রণ যোগ করুন এবং নীচে দেখানো হিসাবে ড্যাশবোর্ড দেখুন।

4c076e07665f57aa.gif

তাই তো! আপনি এইমাত্র আপনার প্রথম সম্প্রদায় সংযোগকারী তৈরি করেছেন! এটি আপনাকে এই কোডল্যাবের শেষে নিয়ে আসে। এখন, আপনি পরবর্তী পদক্ষেপ নিতে পারেন দেখুন.

14. পরবর্তী পদক্ষেপ

আপনার নির্মিত সংযোগকারী উন্নত করুন

আপনার তৈরি করা সংযোগকারীর উন্নতি করুন:

  • লুকার স্টুডিওতে, আপনি যদি আপনার সংযোগকারীর জন্য কনফিগারেশন স্ক্রিনে একটি প্যাকেজ নাম প্রদান না করেন, আপনি সময় সিরিজের চার্ট আঁকার সময় একটি ত্রুটি বার্তা দেখতে পাবেন। আপনার সংযোগকারী কনফিগারেশনে ইনপুট বৈধতা বা একটি ডিফল্ট বিকল্প যোগ করার চেষ্টা করুন।
  • আপনার সংযোগকারী কনফিগারেশনে একই সময়ে একাধিক প্যাকেজের নাম জিজ্ঞাসা করার জন্য সমর্থন যোগ করার চেষ্টা করুন। ইঙ্গিত: npm প্যাকেজ ডাউনলোড গণনা API কমা দ্বারা পৃথক করা একাধিক প্যাকেজ নামের ইনপুট সমর্থন করে।
  • আপনি আমাদের npm সংযোগকারী কোডে এই উভয়ের সমাধান পেতে পারেন।

কমিউনিটি সংযোগকারীর সাথে আরও অনেক কিছু করুন

অতিরিক্ত সম্পদ

নীচে বিভিন্ন সংস্থান রয়েছে যা আপনি এই কোডল্যাবে আচ্ছাদিত উপাদানটি আরও খনন করতে সহায়তা করতে অ্যাক্সেস করতে পারেন।

সম্পদের ধরন

ব্যবহারকারী বৈশিষ্ট্য

বিকাশকারী বৈশিষ্ট্য

ডকুমেন্টেশন

সহায়তা কেন্দ্র

বিকাশকারী ডকুমেন্টেশন

খবর এবং আপডেট

লুকার স্টুডিও > ব্যবহারকারী সেটিংসে সাইন আপ করুন

বিকাশকারী মেইলিং তালিকা

প্রশ্ন জিজ্ঞাসা করুন

ব্যবহারকারী ফোরাম

স্ট্যাক ওভারফ্লো [দর্শক-স্টুডিও]

ভিডিও

DataVis DevTalk

উদাহরণ

ওপেন সোর্স রিপোজিটরি