این صفحه به‌وسیله ‏Cloud Translation API‏ ترجمه شده است.

تمام داده های خود را در استودیو Looker متصل کرده و تجسم کنید

۱. مقدمه

Looker Studio به شما امکان می‌دهد داشبوردهای زنده و تعاملی با تجسم داده‌های زیبا را به صورت رایگان بسازید. داده‌های خود را از منابع مختلف دریافت کنید و گزارش‌های نامحدودی را در Looker Studio با قابلیت‌های ویرایش و اشتراک‌گذاری کامل ایجاد کنید. تصویر زیر نمونه‌ای از داشبورد Looker Studio است:

( برای مشاهده این نمونه گزارش در Looker Studio اینجا کلیک کنید )

اتصالات اجتماعی (Community Connectors) یک ویژگی برای Looker Studio است که به شما امکان می‌دهد از Apps Script برای ساخت اتصالات به هر منبع داده قابل دسترسی به اینترنت استفاده کنید. اتصالات اجتماعی توسط جامعه Looker Studio ساخته شده‌اند. این بدان معناست که هر کسی می‌تواند اتصالات اجتماعی بسازد. همچنین می‌توانید اتصالات اجتماعی را با افراد دیگر به اشتراک بگذارید تا آنها بتوانند از طریق Looker Studio به داده‌های خود دسترسی داشته باشند.

شما می‌توانید از Community Connectors در موارد استفاده مختلف استفاده کنید:

شما در حال مصورسازی داده‌ها از یک پلتفرم تجاری (مثلاً رسانه‌های اجتماعی، بازاریابی، تجزیه و تحلیل و غیره) هستید.
شما در حال مصورسازی داده‌های سازمانی داخلی هستید (مثلاً داده‌های فروش از یک پایگاه داده MySQL داخلی)
شما راهی را برای مشتریان خود فراهم می‌کنید تا داده‌های خود را از خدمات شما تجسم کنند.
شما در حال ایجاد یک پلتفرم گزارش‌دهی دکمه‌ای هستید
شما در حال مصورسازی داده‌های خود از یک منبع وب هستید (مثلاً داشبورد Google Fit خود را ایجاد می‌کنید)

آنچه یاد خواهید گرفت

نحوه کار رابط اجتماعی Looker Studio
نحوه استفاده از اسکریپت Google Apps برای ساخت یک رابط انجمن
نحوه استفاده از Community Connectors در Looker Studio

آنچه نیاز دارید

دسترسی به اینترنت و مرورگر وب
یک حساب گوگل
آشنایی با اصول اولیه جاوا اسکریپت و API های وب

۲. بررسی سریع

چرا این آزمایشگاه کد را انتخاب کردید؟

من به طور کلی به مصورسازی داده‌ها علاقه‌مند هستم.

می‌خواهم درباره استودیو Looker بیشتر بدانم

می‌خواهم رابط اجتماعی خودم را بسازم.

من در حال تلاش برای ادغام Looker Studio با یک پلتفرم دیگر هستم.

من به راهکارهای گوگل کلود علاقه‌مند هستم.

چگونه قصد دارید از این آزمایشگاه کد/آموزش استفاده کنید؟

فقط مرور اجمالی

آن را بخوانید و تمرین‌ها را انجام دهید

آشنایی خود با استودیو Looker را چگونه ارزیابی می‌کنید؟

تا حالا نشنیده بودمش

من میدونم چیه ولی ازش استفاده نمیکنم.

من مرتباً از آن استفاده می‌کنم.

من یک کاربر متخصص هستم.

چه چیزی پیشینه شما را به بهترین شکل توصیف می‌کند؟

توسعه‌دهنده

تحلیلگر کسب و کار / مالی / داده

دانشمند داده / مهندس داده

متخصص بازاریابی / رسانه‌های اجتماعی / تحلیل دیجیتال

طراح

دیگر

برای ارسال اطلاعات نظرسنجی می‌توانید به صفحه بعد بروید.

۳. مروری بر رابط‌های اجتماعی

رابط‌های اجتماعی Looker Studio امکان اتصال مستقیم Looker Studio به هر منبع داده قابل دسترسی در اینترنت را فراهم می‌کنند. می‌توانید به پلتفرم‌های تجاری، مجموعه داده‌های عمومی یا داده‌های خصوصی داخلی خود متصل شوید. رابط‌های اجتماعی می‌توانند داده‌ها را از طریق APIهای وب، APIهای JDBC، فایل‌های مسطح (CSV، JSON، XML) و سرویس‌های اسکریپت برنامه‌ها دریافت کنند.

سناریویی را در نظر بگیرید که در آن یک بسته را در npm منتشر کرده‌اید و می‌خواهید تعداد دانلودهای بسته را در طول زمان و به صورت روزانه پیگیری کنید. در این آزمایشگاه کد، یک Community Connector خواهید ساخت که با استفاده از API تعداد دانلودهای بسته npm ، داده‌ها را دریافت می‌کند. سپس می‌توان از Community Connector در Looker Studio برای ساخت داشبوردی برای نمایش بصری تعداد دانلودها استفاده کرد.

۴. گردش کار رابط جامعه

در یک رابط انجمن پایه، شما چهار تابع تعریف خواهید کرد:

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

بسته به مرحله فعلی گردش کار، Looker Studio این توابع رابط را اجرا می‌کند و از پاسخ در مراحل بعدی استفاده می‌کند. ویدیوی زیر مروری بر موارد زیر دارد:

نحوه کار رابط اجتماعی
مراحل مختلف در گردش کار
وقتی توابع مختلف فراخوانی می‌شوند
وقتی Looker Studio رابط‌های کاربری متفاوتی را نشان می‌دهد
اقدامات مورد انتظار کاربر در مراحل مختلف

بعد از تماشای ویدیو می‌توانید codelab را از سر بگیرید.

نیازی به حفظ کردن این گردش کار نیست، فقط نگاهی به آن بیندازید تا بفهمید در یک کانکتور چه اتفاقی می‌افتد. همیشه می‌توانید به این نمودار مراجعه کنید.

در مرحله بعد، شما شروع به ایجاد رابط خود در Google Apps Script خواهید کرد. شما باید بین رابط کاربری Apps Script و این codelab به طور مداوم در حال جابجایی باشید.

۵. پروژه اسکریپت برنامه‌ها (Apps Script) خود را راه‌اندازی کنید

مرحله ۱: به Google Apps Script مراجعه کنید.

مرحله ۲: با کلیک روی « + پروژه جدید » در قسمت بالا سمت چپ، یک پروژه اسکریپت برنامه‌ها جدید ایجاد کنید.

شما یک پروژه پوسته با یک تابع myFunction خالی در فایل Code.gs خواهید دید.

مرحله ۳: تابع myFunction را حذف کنید.

مرحله ۴: نام پروژه را مشخص کنید:

روی Untitled project در بالا سمت چپ صفحه کلیک کنید
عنوان پروژه را وارد کنید.

شروع به نوشتن کد کانکتور خود در فایل Code.gs کنید.

۶. تعریف تابع getAuthType()

Looker Studio زمانی که نیاز به دانستن روش احراز هویت مورد استفاده توسط کانکتور داشته باشد، تابع getAuthType() را فراخوانی می‌کند. این تابع باید روش احراز هویت مورد نیاز کانکتور برای تأیید سرویس شخص ثالث را برگرداند.

برای کانکتور دانلود npm که در حال ساخت آن هستید، نیازی به احراز هویت با هیچ سرویس شخص ثالثی ندارید زیرا API مورد استفاده شما نیازی به احراز هویت ندارد. کد زیر را کپی کرده و به فایل Code.gs خود اضافه کنید:

کد.gs

var cc = DataStudioApp.createCommunityConnector();

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

در اینجا، شما نشان می‌دهید که کانکتور شما به هیچ احراز هویت شخص ثالثی ( AuthTypes.NONE ) نیاز ندارد. برای مشاهده‌ی تمام روش‌های احراز هویت پشتیبانی‌شده، به مرجع AuthType() مراجعه کنید.

۷. تعریف getConfig()

کاربران کانکتور شما قبل از شروع استفاده از آن، باید آن را پیکربندی کنند. پاسخ تابع getConfig() گزینه‌های پیکربندی را که کاربران مشاهده خواهند کرد، تعریف می‌کند. Looker Studio تابع getConfig() را برای دریافت جزئیات پیکربندی کانکتور فراخوانی می‌کند. بر اساس پاسخ ارائه شده توسط getConfig() ، Looker Studio صفحه پیکربندی کانکتور را رندر کرده و رفتار خاص کانکتور را تغییر می‌دهد.

در صفحه پیکربندی، می‌توانید با استفاده از عناصر فرم زیر، اطلاعات را ارائه دهید یا ورودی کاربر را دریافت کنید:

`TEXTINPUT`	عنصر ورودی	یک کادر متنی تک خطی.
`TEXTAREA`	عنصر ورودی	یک کادر متن چند خطی.
`SELECT_SINGLE`	عنصر ورودی	یک منوی کشویی برای گزینه‌های تک انتخابی.
`SELECT_MULTIPLE`	عنصر ورودی	یک منوی کشویی برای گزینه‌های چند انتخابی.
`CHECKBOX`	عنصر ورودی	یک چک‌باکس واحد که می‌تواند برای ثبت مقادیر بولی استفاده شود.
`INFO`	عنصر نمایش	یک کادر متنی ثابت که می‌تواند برای ارائه دستورالعمل‌ها یا اطلاعات به کاربر استفاده شود.

از عنصر INFO برای ارائه دستورالعمل‌های کاربر و از عنصر TEXTINPUT برای دریافت نام بسته ورودی از کاربر استفاده کنید. در پاسخ getConfig() ، این عناصر فرم را تحت کلید configParams گروه‌بندی خواهید کرد.

از آنجایی که API که به آن متصل می‌شوید به تاریخ به عنوان پارامتر نیاز دارد، در پاسخ getConfig() dateRangeRequired را روی true تنظیم کنید. این به Looker Studio می‌گوید که محدوده‌های زمانی را با تمام درخواست‌های داده ارائه دهد. اگر منبع داده شما به تاریخ به عنوان پارامتر نیاز ندارد، می‌توانید این را حذف کنید.

کد getConfig() زیر را به فایل Code.gs خود، زیر کد موجود برای getAuthType() اضافه کنید:

کد.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();
}

بر اساس این configParams، وقتی از کانکتور در Looker Studio استفاده می‌کنید، می‌توانید انتظار داشته باشید که صفحه پیکربندی مانند زیر را ببینید. اما بعداً در مورد آن بیشتر صحبت خواهیم کرد.

بیایید به سراغ تابع بعدی برویم - getSchema() .

۸. تابع getSchema() را تعریف کنید.

Looker Studio تابع getSchema() را فراخوانی می‌کند تا طرحواره مرتبط با پیکربندی انتخاب‌شده توسط کاربر برای کانکتور را دریافت کند. بر اساس پاسخ ارائه شده توسط getSchema() ، Looker Studio صفحه فیلدها را به کاربر نشان می‌دهد که تمام فیلدهای موجود در کانکتور را فهرست می‌کند.

برای هر پیکربندی خاص از کانکتور شما، طرحواره (schema) فهرستی از تمام فیلدهایی است که کانکتور می‌تواند برای آنها داده ارائه دهد. یک کانکتور ممکن است طرحواره متفاوتی با فیلدهای مختلف را بر اساس پیکربندی‌های مختلف برگرداند. طرحواره می‌تواند شامل فیلدهایی باشد که شما از منبع API خود دریافت می‌کنید، فیلدهایی که در Apps Script محاسبه می‌کنید و فیلدهایی که در Looker Studio با استفاده از فرمول فیلد محاسبه شده محاسبه می‌شوند. کانکتور شما فراداده (metadata) مربوط به هر فیلد در طرحواره را ارائه می‌دهد، از جمله:

نام فیلد
نوع داده برای فیلد
اطلاعات معنایی

برای کسب اطلاعات بیشتر، بعداً مرجع getSchema() و Field را مرور کنید.

بسته به نحوه‌ی واکشی کانکتور شما، طرحواره ممکن است هنگام فراخوانی getSchema() ثابت یا به صورت پویا محاسبه شود. پارامترهای پیکربندی getConfig() که توسط کاربر تعریف می‌شوند، در آرگومان request برای تابع getSchema () ارائه می‌شوند.

برای این کدلاگ، نیازی به دسترسی به آرگومان request ندارید. در بخش بعدی، هنگام نوشتن کد برای تابع getData() اطلاعات بیشتری در مورد آرگومان request کسب خواهید کرد.

برای کانکتور شما، طرحواره ثابت است و شامل 3 فیلد زیر است:

`packageName`	نام بسته npm که کاربر ارائه می‌دهد
`downloads`	تعداد دانلودهای بسته npm
`day`	تاریخ تعداد دانلودها

در زیر کد getSchema() برای کانکتور شما آمده است. تابع کمکی getFields() ایجاد فیلدها را خلاصه می‌کند زیرا این قابلیت توسط هر دو getSchema() و getData() مورد نیاز است. کد زیر را به فایل Code.gs خود اضافه کنید:

کد.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 };
}

بر اساس این طرح، می‌توانید انتظار داشته باشید که هنگام استفاده از کانکتور در Looker Studio، فیلدهای زیر را در صفحه فیلدهای Looker Studio مشاهده کنید. اما بعداً هنگام آزمایش کانکتور خود، در این مورد بیشتر توضیح خواهیم داد.

بیایید به آخرین تابع خود یعنی getData() بپردازیم.

۹. تعریف getData(): بخش ۱

Looker Studio هر زمان که نیاز به واکشی داده‌ها داشته باشد، تابع getData() را فراخوانی می‌کند. بر اساس پاسخی که توسط getData() ارائه می‌شود، Looker Studio نمودارها را در داشبورد رندر و به‌روزرسانی می‌کند. getData() ممکن است در طول این رویدادها فراخوانی شود:

کاربر نموداری را به داشبورد اضافه می‌کند
کاربر یک نمودار را ویرایش می‌کند
کاربر داشبورد را مشاهده می‌کند
کاربر یک فیلتر یا یک کنترل داده مرتبط را ویرایش می‌کند
استودیوی Looker به نمونه‌ای از داده‌ها نیاز دارد

نیازی به کپی کردن هیچ کدی از این صفحه نیست زیرا شما کد تکمیل شده را کپی خواهید کرد.

getData()

کد را در مرحله بعد وارد کنید.

درک شیء `request`

Looker Studio با هر فراخوانی getData() شیء request را ارسال می‌کند. ساختار شیء request زیر را بررسی کنید. این به شما کمک می‌کند تا کد تابع getData() خود را بنویسید.

ساختار شیء `request`

{
  configParams: object,
  scriptParams: object,
  dateRange: {
    startDate: string,
    endDate: string
  },
  fields: [
    {
      name: Field.name
    }
  ]
}

شیء configParams شامل مقادیر پیکربندی برای پارامترهای تعریف شده در getConfig() و پیکربندی شده توسط کاربر خواهد بود.
شیء scriptParams حاوی اطلاعات مربوط به اجرای کانکتور خواهد بود. نیازی به استفاده از آن در این آزمایشگاه کد ندارید.
اگر در پاسخ getConfig() درخواست شود، dateRange شامل محدوده تاریخ درخواستی خواهد بود.
fields شامل فهرستی از نام فیلدهایی هستند که داده‌ها برای آنها درخواست می‌شود.

برای کانکتور شما، یک request نمونه از تابع getData() می‌تواند چیزی شبیه به این باشد:

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

برای فراخوانی getData() در request بالا، تنها دو فیلد درخواست می‌شود، اگرچه طرحواره کانکتور فیلدهای اضافی دارد. صفحه بعد شامل پاسخ نمونه برای این فراخوانی getData() و ساختار پاسخ کلی getData() خواهد بود.

۱۰. تعریف تابع getData(): بخش ۲

در پاسخ 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

آدرس URL مربوط به API مربوط به npm به این شکل خواهد بود:

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

با استفاده از request.dateRange.startDate ، request.dateRange.endDate و request.configParams.package که توسط Looker Studio ارائه شده است، URL مربوط به API را ایجاد کنید. سپس داده‌ها را با استفاده از UrlFetchApp (Apps Script Class: reference ) از 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'
}

پاسخ را از API npm تبدیل کنید و پاسخ getData() را در قالب زیر ارائه دهید. اگر این قالب مشخص نیست، به پاسخ نمونه در پاراگراف زیر نگاهی بیندازید.

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

در پاسخ، با استفاده از ویژگی schema ، طرحواره (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 };
  });
}

۱۱. تعریف تابع getData(): بخش ۳

کد ترکیبی getData() مانند کد زیر خواهد بود. کد زیر را به فایل Code.gs خود اضافه کنید:

کد.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 تمام شد! در مرحله بعد، مانیفست را به‌روزرسانی کنید.

۱۲. به‌روزرسانی مانیفست

در ویرایشگر Apps Script، گزینه Project Settings > Show "appsscript.json" manifest file in editor را انتخاب کنید.

این یک فایل مانیفست جدید appsscript.json ایجاد می‌کند.

فایل 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"]
  }
}

پروژه Apps Script را ذخیره کنید.

تبریک! شما اولین رابط انجمن خود را ساختید و آماده‌ی آزمایش است!

۱۳. کانکتور خود را در Looker Studio تست کنید

از استقرار استفاده کنید

مرحله ۱: در محیط توسعه Apps Script، روی Deploy > Test deployments کلیک کنید تا کادر محاوره‌ای Test deployments باز شود.

استقرار پیش‌فرض، Head Deployment ، فهرست خواهد شد.

مرحله ۲: برای کپی کردن Head Deployment ID روی Copy کلیک کنید.

مرحله ۳: برای بارگذاری کانکتور خود در Looker Studio، عبارت <HEAD_DEPLOYMENT_ID> را در لینک زیر با شناسه Head Deployment کانکتور خود جایگزین کنید و لینک را در مرورگر خود دنبال کنید:

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

اتصال دهنده را مجاز کنید

کاربران جدید Looker Studio: اگر قبلاً از Looker Studio استفاده نکرده‌اید، از شما خواسته می‌شود که Looker Studio را تأیید کنید و با شرایط و ضوابط آن موافقت کنید. مراحل تأیید را تکمیل کنید. وقتی برای اولین بار از Looker Studio استفاده می‌کنید، ممکن است کادر محاوره‌ای برای به‌روزرسانی تنظیمات بازاریابی خود نیز مشاهده کنید. اگر می‌خواهید از آخرین ویژگی‌ها، به‌روزرسانی‌ها و اطلاعیه‌های محصول از طریق ایمیل مطلع شوید، در خبرنامه محصولات ثبت‌نام کنید.

پس از بارگیری، اعلانی برای تأیید اتصال خود مشاهده خواهید کرد.

روی Authorize کلیک کنید و مجوز لازم را به رابط بدهید.

پیکربندی کانکتور

پس از اتمام مجوز، صفحه پیکربندی نمایش داده می‌شود. در قسمت ورودی متن، عبارت « lighthouse » را تایپ کنید و در بالا سمت راست روی «اتصال» کلیک کنید.

طرحواره را تأیید کنید

صفحه فیلدها را مشاهده خواهید کرد. روی ایجاد گزارش در بالا سمت راست کلیک کنید.

داشبورد خود را ایجاد کنید

شما در محیط داشبورد Looker Studio خواهید بود. روی «افزودن به گزارش» کلیک کنید.

در Looker Studio، هر بار که کاربر به یک کانکتور دسترسی پیدا می‌کند و پیکربندی جدیدی اضافه می‌کند، یک منبع داده جدید در حساب Looker Studio کاربر ایجاد می‌شود. می‌توانید یک منبع داده را به عنوان نمونه‌ای از کانکتور بر اساس یک پیکربندی خاص در نظر بگیرید. بر اساس کانکتور و پیکربندی انتخاب شده توسط کاربر، یک منبع داده یک جدول داده با مجموعه‌ای خاص از فیلدها را برمی‌گرداند. کاربران می‌توانند چندین منبع داده را از یک کانکتور ایجاد کنند. یک منبع داده می‌تواند در چندین گزارش استفاده شود و یک گزارش می‌تواند از چندین منبع داده استفاده کند.

حالا یک نمودار سری زمانی اضافه کنید! در منو، روی Insert > Time Series کلیک کنید. سپس سری زمانی را در بوم قرار دهید. باید یک نمودار سری زمانی از تعداد دانلودهای npm برای بسته انتخاب شده ببینید. یک کنترل فیلتر تاریخ اضافه کنید و داشبورد را مانند شکل زیر مشاهده کنید.

همین! شما اولین رابط جامعه خود را ایجاد کردید! به پایان این آزمایشگاه کد رسیدیم. حالا، ببینیم قدم‌های بعدی که می‌توانید بردارید چیست.

۱۴. مراحل بعدی

کانکتور ساخته شده خود را بهبود بخشید

کانکتوری که تازه ساخته‌اید را بهبود ببخشید:

در Looker Studio، اگر نام بسته را در صفحه پیکربندی برای کانکتور خود ارائه ندهید، هنگام رسم نمودار سری زمانی، پیام خطایی مشاهده خواهید کرد. سعی کنید اعتبارسنجی ورودی یا یک گزینه پیش‌فرض را به پیکربندی کانکتور خود اضافه کنید.
سعی کنید پشتیبانی از پرس‌وجوی همزمان چندین نام بسته را در پیکربندی کانکتور خود اضافه کنید. نکته: API شمارش تعداد دانلودهای بسته npm از ورودی چندین نام بسته که با کاما از هم جدا شده‌اند، پشتیبانی می‌کند.
می‌توانید راه‌حل‌های هر دوی این موارد را در کد کانکتور npm ما بیابید.

با رابط‌های اجتماعی کارهای بیشتری انجام دهید

مرجع API کانکتور و مانیفست را مشاهده کنید .
برای درک بهترین شیوه‌ها، کد رابط نمونه را در مخزن متن‌باز ما بررسی کنید.
کلاس Codelab را تکمیل کنید تا بتوانید رابط‌های اجتماعی را در محیط محلی خود توسعه دهید.
پس از اینکه یک رابط اجتماعی کامل ساختید، گزینه‌های انتشار موجود را در نظر بگیرید.
یک تجسم اجتماعی برای استودیوی Looker بسازید .

منابع اضافی

در زیر منابع مختلفی وجود دارد که می‌توانید برای کمک به شما در درک بیشتر مطالب پوشش داده شده در این آزمایشگاه کد به آنها دسترسی پیدا کنید.

نوع منبع	ویژگی‌های کاربر	ویژگی‌های توسعه‌دهنده
مستندات	مرکز راهنما	مستندات توسعه‌دهنده
اخبار و به‌روزرسانی‌ها	ثبت نام در Looker Studio > تنظیمات کاربر	لیست پستی توسعه‌دهندگان
سوال بپرسید	انجمن کاربران	سرریز پشته [looker-studio]
ویدیوها	دیتاویس دوتاک
مثال‌ها	گزارش گالری گالری کانکتور	مخزن متن‌باز

تمام داده های خود را در استودیو Looker متصل کرده و تجسم کنید

۱. مقدمه

آنچه یاد خواهید گرفت

آنچه نیاز دارید

۲. بررسی سریع

چرا این آزمایشگاه کد را انتخاب کردید؟

چگونه قصد دارید از این آزمایشگاه کد/آموزش استفاده کنید؟

آشنایی خود با استودیو Looker را چگونه ارزیابی می‌کنید؟

چه چیزی پیشینه شما را به بهترین شکل توصیف می‌کند؟

۳. مروری بر رابط‌های اجتماعی

۴. گردش کار رابط جامعه

۵. پروژه اسکریپت برنامه‌ها (Apps Script) خود را راه‌اندازی کنید

۶. تعریف تابع getAuthType()

کد.gs

۷. تعریف getConfig()

کد.gs

۸. تابع getSchema() را تعریف کنید.

کد.gs

۹. تعریف getData(): بخش ۱

درک شیء request

ساختار شیء request

۱۰. تعریف تابع getData(): بخش ۲

ایجاد طرحواره برای فیلدهای درخواستی

واکشی و تجزیه داده‌ها از API

تبدیل داده‌های تجزیه‌شده و فیلتر کردن فیلدهای درخواستی

۱۱. تعریف تابع getData(): بخش ۳

کد.gs

۱۲. به‌روزرسانی مانیفست

appsscript.json

۱۳. کانکتور خود را در Looker Studio تست کنید

از استقرار استفاده کنید

اتصال دهنده را مجاز کنید

پیکربندی کانکتور

طرحواره را تأیید کنید

داشبورد خود را ایجاد کنید

۱۴. مراحل بعدی

کانکتور ساخته شده خود را بهبود بخشید

با رابط‌های اجتماعی کارهای بیشتری انجام دهید

منابع اضافی

درک شیء `request`

ساختار شیء `request`