एपीआई की खास जानकारी
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
फ़िलहाल, सिर्फ़ FILTER ही InteractionType मान्य है.
| नाम | Type | ब्यौरा |
|---|---|---|
| dscc.InteractionType.FILTER | Enum | 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 की कैटगरी |
| वैल्यू | Array<Array>
|
डेटा वैल्यू का नेस्ट किया गया कलेक्शन. हर सबअरे,
concepts कलेक्शन की लंबाई होनी चाहिए.
सबअरे की हर वैल्यू, एक डाइमेंशन वैल्यू से मेल खाती है. |
नमूना interactionData:
var interactionData = {
"concepts": ["dim1Id", "dim2Id"],
"values": [
["dim1Val1", "dim2Val1"],
["dim1Val2", "dim2Val2"]
]
}
ऊपर दिए गए interactionData के साथ dscc.sendInteraction का इस्तेमाल करना,
इस SQL स्टेटमेंट के बराबर है:
SELECT data WHERE
(dim1 == dim1Val1 AND dim2 == dim2Val1)
OR
(dim1 == dim1Val2 AND dim2 == dim2Val2);
clearInteraction()
clearInteraction() फ़ंक्शन, इस विज़ुअलाइज़ेशन से पहले सेट किए गए फ़िल्टर को हटाने के लिए Looker Studio को एक मैसेज भेजता है.
पैरामीटर:
| नाम | Type | ब्यौरा |
|---|---|---|
| actionID | string
|
ऐसी स्ट्रिंग जो कॉन्फ़िगरेशन में मौजूद actionId से जुड़ी है |
| इंटरैक्शन | 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 | ब्यौरा |
|---|---|---|
| कॉलबैक(डेटा) | function
|
एक ऐसा फ़ंक्शन जो subscribeToData से मिला डेटा लेता है. |
| विकल्प | object |
यह नीति दिखाता है कि आपको डेटा वापस पाने के लिए कौनसा फ़ॉर्मैट चाहिए |
विकल्प ऑब्जेक्ट ऐसा दिखता है:
{
transform: dscc.tableTransform | dscc.objectTransform
}
रिटर्न वैल्यू:
| Type | ब्यौरा |
|---|---|
function |
Looker Studio के अगले मैसेज पाने के लिए, callback की सदस्यता छोड़ दें |
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
यह ऑब्जेक्ट,
dscc.subscribeToData के साथ रजिस्टर किए गए callback को पास किया गया है. ये वे फ़ील्ड हैं जिन्हें
dscc.objectFormat और dscc.tableFormat के बीच शेयर किया जाता है.
{
fields: object(fieldsByConfigId),
style: object(styleById),
interactions: object(interactionsById),
theme: object(themeStyle),
tables: object(tablesById),
dateRanges: object(dateRangesById)
}
| फ़ील्ड | Type | ब्यौरा |
|---|---|---|
| फ़ील्ड्स | object(fieldsByConfigId)
|
ऐसा ऑब्जेक्ट जिसमें फ़ील्ड, उनके कॉन्फ़िगरेशन आईडी से इंडेक्स किए गए होते हैं |
| शैलीकृत करें | object(styleById)
|
ऐसा ऑब्जेक्ट जिसमें स्टाइल ऑब्जेक्ट हों, जिन्हें उनके कॉन्फ़िगरेशन आईडी से इंडेक्स किया गया हो |
| इंटरैक्शन | 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 ऑब्जेक्ट, स्टाइल की जानकारी देता है. इस जानकारी को विज़ुअलाइज़ेशन कॉन्फ़िगरेशन में बताए गए "आईडी" से इंडेक्स किया गया है.
| फ़ील्ड | Type | ब्यौरा |
|---|---|---|
| configId | styleValue
|
एक ऑब्जेक्ट, जिसमें स्टाइल वैल्यू और कॉन्फ़िगरेशन से तय की गई डिफ़ॉल्ट स्टाइल वैल्यू होती है |
styleValue
{
value: string | object | bool | number,
defaultValue: string | object | bool | number
}
styleValue ऑब्जेक्ट, उपयोगकर्ता की चुनी गई स्टाइल वैल्यू और कॉन्फ़िगरेशन में तय की गई डिफ़ॉल्ट वैल्यू, दोनों उपलब्ध कराता है. value और defaultValue का टाइप,
स्टाइल एलिमेंट पर निर्भर करता है.
| फ़ील्ड | Type | ब्यौरा |
|---|---|---|
| value | 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 ऑब्जेक्ट में, कॉन्फ़िगरेशन में बताई गई काम करने वाली कार्रवाइयों की सूची होती है. साथ ही, इंटरैक्शन के लिए उपयोगकर्ता की चुनी गई वैल्यू भी होती हैं.
| फ़ील्ड | Type | ब्यौरा |
|---|---|---|
| value | 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 हर पंक्ति के लिए शीर्षक और डेटा की जानकारी देता है. "डिफ़ॉल्ट"
हमेशा डेटा दिखाएगा और "तुलना करें" सिर्फ़ तभी भरेगा, जब उपयोगकर्ता डेटा को तुलना वाली पंक्तियों के साथ कॉन्फ़िगर करेगा.
टेबलऑब्जेक्ट के फ़ॉर्मैट में ही, dscc.tableFormat और dscc.objectFormat के बीच का अंतर है.
| फ़ील्ड | 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.tableFormat विकल्प के साथ dscc.subscribeToData() का इस्तेमाल करके लौटाया गया है.
{
"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"
]
}
}
}
Objectफ़ॉर्मैट का रेफ़रंस
objectRow
{
configId1: array(string | bool | number),
configId2: array(string | bool | number)
}
| फ़ील्ड | Type | ब्यौरा |
|---|---|---|
| configId | श्रेणी | किसी खास कॉन्फ़िगरेशन आईडी से जुड़े वैल्यू का कलेक्शन |
ऑब्जेक्ट के फ़ॉर्मैट का सैंपल डेटा
यह data का सैंपल है, जिसे dscc.objectFormat विकल्प के साथ dscc.subscribeToData() का इस्तेमाल करके लौटाया गया है.
{
"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"
]
}
}
}