تمت ترجمة هذه الصفحة بواسطة Cloud Translation API‏.

مرجع مكتبة مكوِّن منتدى Looker Studio (dscc)

نظرة عامة على واجهة برمجة التطبيقات

dscc (مكوِّن منتدى Looker Studio) هي مكتبة تساعدك في إنشاء مكوّنات المنتديات لـ Looker Studio. يمكن العثور على رمز المصدر على GitHub.

وتعرض dscc ثلاث دوال: getWidth() وgetHeight() وsubscribeToData().

`getWidth()`

الاسم	المَعلمات	نوع القيمة التي يتم عرضها	الوصف
getWidth()	لا ينطبق	`number`	تعرض عرض iframe بالبكسل

جارٍ استخدام `getWidth()`

// to get the width of the iframe
var width = dscc.getWidth();

`getHeight()`

الاسم	المَعلمات	نوع القيمة التي يتم عرضها	الوصف
getHeight()	لا ينطبق	`int`	تعرض ارتفاع iframe بالبكسل

جارٍ استخدام `getHeight()`

// to get the height of the iframe
var height = dscc.getHeight();

sendInteraction()

ترسل الدالة sendInteraction() رسالة إلى Looker Studio تحتوي على بيانات لفلتر.

المَعلمات:

الاسم	Type	الوصف
actionID	`string`	السلسلة التي تتوافق مع actionId في ملف الإعداد
تفاعل	`enum(InteractionType)`	يخبر Looker Studio عن التفاعل
البيانات	`object(InteractionData)`	يوفر البيانات المطلوبة للتفاعل

`InteractionType`

في الوقت الحالي، سمة InteractionType الوحيدة الصالحة هي FILTER.

الاسم	Type	الوصف
dscc.InteractionType.FILTER	قيم التعداد	وصف التفاعل مع "`FILTER`"

جارٍ استخدام `sendInteraction`


// the actionID can either be hardcoded or parsed from the returned data
var actionId = "interactionConfigId";

// dscc provides enums for the interaction types
var FILTER = dscc.InteractionType.FILTER;

var fieldID = "qt_m9dtntutsb";
var dataValue = "Asia";

// sendInteraction expects data that tells you the concepts and the values of
// those concepts to use in constructing a filter.
var interactionData = {
  "concepts": [fieldId],
  "values": [[dataValue]]
}

dscc.sendInteraction(actionId, FILTER, interactionData);

`interactionData`

var interactionData = {
  "concepts": array(fieldId),
  "values": array(array(dataValue))
}

الحقل	Type	الوصف
المفاهيم	`Array`	مصفوفة `fieldIds`
values	`Array<Array>`	مصفوفة متداخلة من قيم البيانات. يجب أن يكون كل مصفوفة فرعية بطول صفيف `concepts`. تتجاوب كل قيمة في الصفيف الفرعي مع قيمة البُعد.

نموذج interactionData:

var interactionData = {
  "concepts": ["dim1Id", "dim2Id"],
  "values": [
    ["dim1Val1", "dim2Val1"],
    ["dim1Val2", "dim2Val2"]
    ]
}

يعادل استخدام dscc.sendInteraction مع عبارة interactionData أعلاه عبارة SQL التالية:

SELECT data WHERE
  (dim1 == dim1Val1 AND dim2 == dim2Val1)
  OR
  (dim1 == dim1Val2 AND dim2 == dim2Val2);

clearInteraction()

ترسل الدالة clearInteraction() رسالة إلى Looker Studio لمحو فلتر تم إعداده سابقًا من خلال هذا العرض المرئي.

المَعلمات:

الاسم	Type	الوصف
actionID	`string`	السلسلة التي تقابل actionId في ملف config
تفاعل	`enum(InteractionType)`	يطلع Looker Studio على التفاعل

جارٍ استخدام `clearInteraction()`


// the actionID can either be hardcoded or parsed from the returned data
var actionId = "interactionConfigId";

// dscc provides enums for the interaction types
var FILTER = dscc.InteractionType.FILTER;

dscc.clearInteraction(actionId, FILTER);

`subscribeToData(callback, options)`

تشترك الدالة subscribeToData() في الرسائل الواردة من Looker Studio.

المَعلمات:

الاسم	Type	الوصف
Callback(data)	`function`	دالة تأخذ البيانات التي يعرضها `subscribeToData`.
الخيارات	`object`	تحديد تنسيق عرض البيانات المطلوب

يبدو كائن الخيارات كما يلي:

{
  transform: dscc.tableTransform | dscc.objectTransform
}

القيمة المعروضة:

Type	الوصف
`function`	إلغاء اشتراك "`callback`" في الرسائل الأخرى من Looker Studio

جارٍ استخدام `subscribeToData()`

// define and use a callback
var unsubscribe = dscc.subscribeToData(function(data){
  // console.log the returned data
  console.log(data);
}, {transform: dscc.tableTransform});

// to unsubscribe

unsubscribe();

`data`

هذا هو الكائن الذي تم تمريره إلى callback المسجَّل في dscc.subscribeToData. في ما يلي الحقول التي تتم مشاركتها بين dscc.objectFormat وdscc.tableFormat.

{
  fields: object(fieldsByConfigId),
  style: object(styleById),
  interactions: object(interactionsById),
  theme: object(themeStyle),
  tables: object(tablesById),
  dateRanges: object(dateRangesById)
}

الحقل	Type	الوصف
fields	`object(fieldsByConfigId)`	يشير هذا المصطلح إلى كائن يحتوي على حقول تمت فهرستها باستخدام معرّف config.
style	`object(styleById)`	يشير هذا المصطلح إلى كائن يحتوي على كائنات نمط تمت فهرستها باستخدام configId.
التفاعلات	`object(interactionsById)`	يشير هذا المصطلح إلى كائن يحتوي على كائنات التفاعل.
مظهر	`themeStyle`	كائن themeStyle يحتوي على معلومات نمط المظهر في تقرير
مناضد	`object(tablesById)`	كائن يحتوي على tableObjects
dateRanges	`object(dateRangesById)`	يشير هذا المصطلح إلى كائن يحتوي على dateRanges.

fieldsByConfigId

{
   configId: array(field)
}

يحتوي الكائن fieldsByConfigId على مصفوفات من كائنات حقل تمت فهرستها بواسطة "id" المحدّد في إعدادات العرض المرئي. هناك إدخال واحد في هذا الكائن لكل dataField تم تحديده في ملف الإعداد.

الحقل	Type	الوصف
configId	`Array<field>`	مصفوفة من الحقول المرتبطة بحقل البيانات

الحقل

{
  id: fieldId,
  name: string,
  description: string,
  type: fieldType,
  concept: enum(conceptType)
}

يوفّر الكائن field معلومات حول الحقل الذي يختاره المستخدم في لوحة الخصائص.

الحقل	Type	الوصف
id	`string`	رقم التعريف الذي أنشأته أداة Looker Studio للحقل
اسم	`string`	اسم الحقل الذي يمكن لشخص عادي قراءته
الوصف	`string`	وصف الحقل
كتابة	`enum(fieldType)`	semanticType للحقل
مفهوم	`enum(conceptType)`	conceptType للحقل

styleById

{
   configId: styleValue
}

يوفّر الكائن styleById معلومات النمط المفهرَسة من خلال "id" المحدّد في إعداد العرض المرئي.

الحقل	Type	الوصف
configId	`styleValue`	يشير هذا المصطلح إلى كائن يحتوي على قيمة النمط وقيمة النمط التلقائي المحدَّدة من قِبل config.

styleValue

{
  value: string | object | bool | number,
  defaultValue: string | object | bool | number
}

يوفّر الكائن styleValue قيمة النمط التي اختارها المستخدم والقيمة التلقائية المحدّدة في ملف الإعداد. يعتمد نوع value وdefaultValue على عنصر النمط.

الحقل	Type	الوصف
القيمة	`string OR object OR bool OR number`	قيمة عنصر النمط الناتجة من اختيار المستخدم في لوحة الخصائص
defaultValue	`string OR object OR bool OR number`	القيمة الافتراضية لعنصر النمط المحدّد في تهيئة التصور

interactionsById

{

}

يوفر الكائن interactionsById بيانات التفاعل المفهرَسة من خلال interactionId إعدادات العروض المرئية.

الفهرس	Type	الوصف
configId	`interaction`	يشير هذا المصطلح إلى كائن يحتوي على بيانات مرتبطة بتفاعل معيَّن.

interactionField

{
  value: object(interactionValue),
  supportedActions: array(InteractionType)
}

يحتوي الكائن interactionField على مجموعة من SupportActions المحددة في الإعداد، بالإضافة إلى القيم التي اختارها المستخدم للتفاعل.

الحقل	Type	الوصف
القيمة	`string OR object OR bool OR number`	قيمة عنصر النمط الناتجة من اختيار المستخدم في لوحة الخصائص
supportedActions	`Array<InteractionType>`	إنّ الإجراءات التي يتيحها هذا التفاعل، كما هو موضّح في ملف الإعداد

interactionValue

يوفّر الكائن interactionValue قيمًا من اختيار المستخدم لنوع التفاعل. في حال توفّر المفتاح data، يعكس الكائن InteractionData الحالة الحالية للفلتر. في حال عدم توفّر مفتاح data، لم يتم حاليًا إعداد العرض المرئي كفلتر.

{
  type: enum(InteractionType)
  data: object(interactionData) | None
}

الحقل	Type	الوصف
كتابة	`enum(InteractionType)`	InteractionType من اختيار المستخدم
البيانات	`object(InteractionData)`	البيانات المرتبطة بالحالة الحالية للفلتر. هذا المفتاح غير موجود إذا تم محو الفلتر حاليًا.

مظهر

{
  fillColor: {
    color: string,
    opacity: number
  },
  fontColor: {
    color: string,
    opacity: number
  },
  accentFillColor: {
    color: string,
    opacity: number
  },
  accentFontColor: {
    color: string,
    opacity: number
  },
  fontFamily: string,
  accentFontFamily: string,
  increaseColor: {
    color: string,
    opacity: number
  },
  decreaseColor: {
    color: string,
    opacity: number
  },
  gridColor: {
    color: string,
    opacity: number
  },
  seriesColor: [
    {
      color: string,
      opacity: number
    }
  ]
}

يمرّر الكائن themeStyle معلومات مظهر التقرير إلى التمثيل البصري.

الحقل	Type	الوصف
fillColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
fontColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
accentFillColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
accentFontColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
fontFamily	`string`	سلسلة تصف مجموعة الخطوط
accentFontFamily	`string`	وهي سلسلة تصف مجموعة خطوط التشكيل
increaseColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
decreaseColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
gridColor	`object`	كائن بالتنسيق `{color: string, opacity: number}`
seriesColor	`Array<object>`	مصفوفة من كائنات التنسيق`{color: string, opacity: number}`

tablesById

{
  "DEFAULT": object(tableObject),
  "COMPARISON": object(tableObject) | undefined
}

توفِّر tableObject معلومات العنوان والبيانات لكل صف. ستعرض القيمة "DEFAULT" دائمًا البيانات، ولن تتم تعبئة "COMPARISON" إلا إذا قام المستخدم بتكوين البيانات بصفوف المقارنة.

الفرق الوحيد بين dscc.tableFormat وdscc.objectFormat هو تنسيق tableObject.

الحقل	Type	الوصف
"DEFAULT"	`object(tableObject) OR Array<objectRow>`	سمة `tableObject` المرتبطة بالبيانات التي يضيفها المستخدم إلى أحد التصورات
"مقارنة"	`object(tableObject) OR Array<objectRow>`	تمثّل هذه السمة `tableObject` المرتبطة ببيانات مقارنة التواريخ، إذا كانت سارية.

dateRangesById

{
  "DEFAULT": object(dateRange),
  "COMPARISON": object(dateRange)
}

يقدّم العنصر dateRangesById معلومات عن النطاقات الزمنية التلقائية والمقارنة. وفي حال عدم وجود نطاقات زمنية، سيكون العنصر فارغًا. لن تتم تعبئة DEFAULT وCOMPARISON إلا إذا ضبط المستخدم النطاقات الزمنية المعنيّة. وتكون البيانات في النطاقات الزمنية مرتبطة بالبيانات التلقائية وبيانات المقارنة كما هو محدّد في tablesById.

الحقل	Type	الوصف
"DEFAULT"	`object(dateRange)`	السمة `dateRange` المرتبطة بالنطاق الزمني التلقائي، إذا كان ذلك منطبقًا.
"مقارنة"	`object(dateRange)`	السمة `dateRange` المرتبطة بالنطاق الزمني للمقارنة، إذا كان ذلك منطبقًا.

dateRange

{
  start: string,
  end: string
}

يقدّم العنصر dateRange معلومات عن تاريخَي البدء والانتهاء لنطاق زمني تلقائي أو للمقارنة.

الحقل	Type	الوصف
بدء	`string`	تاريخ بدء النطاق الزمني بالتنسيق YYYYMMDD.
إنهاء	`string`	تاريخ انتهاء النطاق الزمني بالتنسيق YYYYMMDD.

مرجع واحد (`tableFormat`)

tableObject

{
  headers: array(object),
  rows: array(array)
}

الحقل	Type	الوصف
headers	`Array`	مصفوفة من عناصر الحقول. وتحتوي كائنات الحقول هذه أيضًا على سمة `configId` تتوافق مع المعرّفات الواردة في الإعداد.
صف	`Array<Array>`	صفيف من الصفائف: كل صفيف هو صف من البيانات

نموذج بيانات `tableFormat`

هذا هو نموذج data الذي تم عرضه باستخدام dscc.subscribeToData() مع الخيار dscc.tableFormat.

{
  "tables": {
    "DEFAULT": {
      "headers": [{
        "id": "qt_ky8sltutsb",
        "name": "dimension",
        "type": "TEXT",
        "concept": "DIMENSION",
        "configId": "configId1"
      }, {
        "id": "qt_b5bvmtutsb",
        "name": "second dim",
        "type": "TEXT",
        "concept": "DIMENSION"
        "configId": "configId1"
      }, {
        "id": "qt_m9dtntutsb",
        "name": "metric",
        "type": "NUMBER",
        "concept": "METRIC",
        "configId": "configId2"
      }],
      "rows": [
        ["Week 4", "lm", 55]
      ]
    },
    "COMPARISON": {
      "headers": [{
        "id": "qt_ky8sltutsb",
        "name": "dimension",
        "type": "TEXT",
        "concept": "DIMENSION",
        "configId": "configId1"
      }, {
        "id": "qt_b5bvmtutsb",
        "name": "second dim",
        "type": "TEXT",
        "concept": "DIMENSION"
        "configId": "configId1"
      }, {
        "id": "qt_m9dtntutsb",
        "name": "metric",
        "type": "NUMBER",
        "concept": "METRIC",
        "configId": "configId2"
      }],
      "rows": [
        ["Week 5", "no", 123]
      ]
    }
  },
  "fields": {
    "configId1": [
      {
        "id": "qt_ky8sltutsb",
        "name": "week",
        "type": "TEXT",
        "concept": "DIMENSION"
      },
      {
        "id": "qt_b5bvmtutsb",
        "name": "textId",
        "type": "TEXT",
        "concept": "DIMENSION"
      }
    ],
    "configId2": [
      {
        "id": "qt_m9dtntutsb",
        "name": "orders",
        "type": "NUMBER",
        "concept": "METRIC"
      }
    ]
  },
  "style": {
    "nodeColor": {
      "value": {
        "color": "#000000"
      }
    }
  },
  "theme": {},
  "dateRanges": {
    "DEFAULT": {
      "start": "20210501",
      "end": "20210531"
    },
    "COMPARISON": {
      "start": "20200501",
      "end": "20200531"
    }
  },
  "interactions": {
    "onClick": {
      "value": {
        "type": "FILTER",
        "data": {
          "concepts": [
            "qt_h6oibrb6wb",
            "qt_i6oibrb6wb"
          ],
          "values": [
            [
              "Afternoon",
              "Sunday"
            ],
            [
              "Afternoon",
              "Thursday"
            ],
            [
              "Morning",
              "Tuesday"
            ]
          ]
        }
      },
      "supportedActions": [
        "FILTER"
      ]
    }
  }
}

مرجع objectFormat

objectRow

{
  configId1: array(string | bool | number),
  configId2: array(string | bool | number)
}

الحقل	Type	الوصف
configId	صفيف	مصفوفة من القيم المرتبطة بمعرّف إعداد معيّن

نموذج بيانات objectFormat

هذا هو نموذج data الذي تم عرضه باستخدام dscc.subscribeToData() مع الخيار dscc.objectFormat.

{
  "tables": {
    "COMPARISON": [
      {
        "configId1": ["Week 5", "cd"],
        "configId2": [123]
      }
    ],
    "DEFAULT": [
      {
        "configId1": ["Week 1", "ab"],
        "configId2": [24]
      }
    ]
  },
  "fields": {
    "configId1": [
      {
        "id": "qt_h6oibrb6wb",
        "name": "time of day",
        "type": "TEXT",
        "concept": "DIMENSION"
      },
      {
        "id": "qt_i6oibrb6wb",
        "name": "day",
        "type": "TEXT",
        "concept": "DIMENSION"
      }
    ],
    "configId2": [
      {
        "id": "qt_m9dtntutsb",
        "name": "metric",
        "type": "NUMBER",
        "concept": "METRIC"
      }
    ]
  },
  "style": {
    "nodeColor": {
      "value": {
        "color": "#000000"
      }
    }
  },
  "theme": {},
  "dateRanges": {
    "DEFAULT": {
      "start": "20210501",
      "end": "20210531"
    },
    "COMPARISON": {
      "start": "20200501",
      "end": "20200531"
    }
  },
  "interactions": {
    "onClick": {
      "value": {
        "type": "FILTER",
        "data": {
          "concepts": [
            "qt_h6oibrb6wb",
            "qt_i6oibrb6wb"
          ],
          "values": [
            [
              "Afternoon",
              "Sunday"
            ],
            [
              "Afternoon",
              "Thursday"
            ],
            [
              "Morning",
              "Tuesday"
            ]
          ]
        }
      },
      "supportedActions": [
        "FILTER"
      ]
    }
  }
}

مرجع مكتبة مكوِّن منتدى Looker Studio (dscc)

نظرة عامة على واجهة برمجة التطبيقات

getWidth()

جارٍ استخدام getWidth()

getHeight()

جارٍ استخدام getHeight()

sendInteraction()

InteractionType

جارٍ استخدام sendInteraction

interactionData

clearInteraction()

جارٍ استخدام clearInteraction()

subscribeToData(callback, options)

جارٍ استخدام subscribeToData()

data

fieldsByConfigId

الحقل

styleById

styleValue

interactionsById

interactionField

interactionValue

مظهر

tablesById

dateRangesById

dateRange

مرجع واحد (tableFormat)

tableObject

نموذج بيانات tableFormat

مرجع objectFormat

objectRow

نموذج بيانات objectFormat

`getWidth()`

جارٍ استخدام `getWidth()`

`getHeight()`

جارٍ استخدام `getHeight()`

`InteractionType`

جارٍ استخدام `sendInteraction`

`interactionData`

جارٍ استخدام `clearInteraction()`

`subscribeToData(callback, options)`

جارٍ استخدام `subscribeToData()`

`data`

مرجع واحد (`tableFormat`)

نموذج بيانات `tableFormat`