API'ye genel bakış
dscc
(Looker Studio Topluluk Bileşeni), geliştirme ve uygulama
topluluk bileşenlerinden faydalanabilirsiniz. Kaynak kodu şu adreste bulunabilir:
GitHub'a gidin.
dscc
üç işlev sunar: getWidth()
, getHeight()
ve
subscribeToData()
.
getWidth()
Ad | Parametreler | Dönüş Türü | Açıklama |
---|---|---|---|
getWidth() | Yok | number
|
iframe'in genişliğini döndürür, piksel |
getWidth()
kullanılıyor
// to get the width of the iframe
var width = dscc.getWidth();
getHeight()
Ad | Parametreler | Dönüş Türü | Açıklama |
---|---|---|---|
getHeight() | Yok | int
|
iframe'in yüksekliğini döndürür. piksel cinsinden |
getHeight()
kullanılıyor
// to get the height of the iframe
var height = dscc.getHeight();
sendInteraction()
sendInteraction()
işlevi, Looker Studio'ya verileri içeren bir mesaj gönderir.
kullanabilirsiniz.
Parametreler:
Ad | Tür | Açıklama |
---|---|---|
actionID | string
|
Oluşturulan dize şununla karşılık gelir: eylem kimliği yapılandırma |
etkileşim | enum(InteractionType)
|
Looker'a bilgi verir Studio hakkında etkileşim |
veri | object(InteractionData)
|
Şunu sağlar: gerekli veriler - etkileşim |
InteractionType
Şu anda yalnızca FILTER
InteractionType
geçerli.
Ad | Tür | Açıklama |
---|---|---|
dscc.InteractionType.FILTER | Enum | FILTER etkileşimini açıklar |
sendInteraction
kullanılıyor
// 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))
}
Alan | Tür | Açıklama |
---|---|---|
kavramlar | Array |
fieldIds dizisi |
values | Array<Array>
|
İç içe yerleştirilmiş veri değerleri dizisi. Her bir alt dizi
concepts dizisinin uzunluğu olmalıdır.
Alt dizideki her değer bir
boyut değeri. |
Örnek interactionData
:
var interactionData = {
"concepts": ["dim1Id", "dim2Id"],
"values": [
["dim1Val1", "dim2Val1"],
["dim1Val2", "dim2Val2"]
]
}
dscc.sendInteraction
alanını yukarıdaki interactionData
ile kullanmak şuna eşdeğerdir:
aşağıdaki SQL deyimi:
SELECT data WHERE
(dim1 == dim1Val1 AND dim2 == dim2Val1)
OR
(dim1 == dim1Val2 AND dim2 == dim2Val2);
clearInteraction()
clearInteraction()
işlevi, bir öğeyi temizlemek için Looker Studio'ya mesaj gönderir.
filtre uygulayabilirsiniz.
Parametreler:
Ad | Tür | Açıklama |
---|---|---|
actionID | string
|
Öğeye karşılık gelen dize yapılandırmadaki actionId |
etkileşim | enum(InteractionType)
|
Looker Studio'ya etkileşim |
clearInteraction()
kullanılıyor
// 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()
işlevi, Looker Studio'dan gelen mesajlara abone olur.
Parametreler:
Ad | Tür | Açıklama |
---|---|---|
geri çağırma(veri) | function
|
Döndürülen verileri alan
subscribeToData |
seçenekler | object |
İstenen veri döndürme biçimini tanımlar |
Seçenekler nesnesi şöyle görünür:
{
transform: dscc.tableTransform | dscc.objectTransform
}
Döndürülen değer:
Tür | Açıklama |
---|---|
function |
callback adlı kullanıcının, Looker Studio'daki diğer iletilerin e-posta listesinden çıkmasını sağlar |
subscribeToData()
kullanılıyor
// 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
Bu, kayıtlı callback
öğesine iletilen nesnedir
dscc.subscribeToData
. Bunlar, her bir işletme için
dscc.objectFormat
ve dscc.tableFormat
.
{
fields: object(fieldsByConfigId),
style: object(styleById),
interactions: object(interactionsById),
theme: object(themeStyle),
tables: object(tablesById),
dateRanges: object(dateRangesById)
}
Alan | Tür | Açıklama |
---|---|---|
Fields | object(fieldsByConfigId)
|
Şunları içeren bir nesne dizine eklenen alanlar: configId'leri |
stil | object(styleById)
|
Şunları içeren bir nesne stil nesneleri configId tarafından dizine eklendi |
etkileşimler | object(interactionsById)
|
Şunları içeren bir nesne etkileşim nesneler |
tema | themeStyle
|
themeStyle nesnesi tema stili içeren raporla ilgili bilgiler |
tablolar | object(tablesById)
|
Şunları içeren bir nesne tableObjects |
dateRanges | object(dateRangesById)
|
Şunları içeren bir nesne dateRanges |
fieldsByConfigId
{
configId: array(field)
}
fieldsByConfigId
nesnesi, dizine eklenen field nesnelerinden oluşan dizileri içerir
"id"ye göre
görselleştirme yapılandırmasını devreye sokun. Her biri 100'den az gösterim alan
yapılandırmada tanımlanan her dataField
için bu nesnede bir giriş.
Alan | Tür | Açıklama |
---|---|---|
configId | Array<field> |
dataField ile ilişkili alan dizisi |
alan
{
id: fieldId,
name: string,
description: string,
type: fieldType,
concept: enum(conceptType)
}
field
nesnesi, kullanıcının seçtiği alan hakkında bilgi sağlar
özellik panelini açın.
Alan | Tür | Açıklama |
---|---|---|
id | string |
Alan için Looker Studio tarafından oluşturulan kimlik |
ad | string |
Kullanıcıların okuyabileceği alan adı |
açıklama | string |
Alanın açıklaması |
tür | enum(fieldType) |
Alanın semanticType değeri |
kavram | enum(conceptType) |
Alanın conceptType |
styleById
{
configId: styleValue
}
styleById
nesnesi, "id" tarafından dizine eklenen stil bilgilerini sağlar şurada tanımlandığı:
görselleştirme yapılandırmasını inceleyin.
Alan | Tür | Açıklama |
---|---|---|
configId | styleValue
|
Stil değerini ve yapılandırma tanımlı varsayılan stil değeri |
styleValue
{
value: string | object | bool | number,
defaultValue: string | object | bool | number
}
styleValue
nesnesi, hem kullanıcı tarafından seçilen stil değerini hem de
yapılandırmada tanımlanan varsayılan değere sahiptir. value
ve defaultValue
türü
stil öğesine bağlıdır.
Alan | Tür | Açıklama |
---|---|---|
value | string OR object OR bool OR
number
|
Stil öğesinin değeri kullanıcı seçiminden döndürüldü özellik panelinde |
defaultValue | string OR object OR bool OR
number
|
Stilin varsayılan değeri öğesi görselleştirme yapılandırması |
interactionsById
{
}
interactionsById
nesnesi,
interactionId
görselleştirme yapılandırmasını inceleyin.
Dizin | Tür | Açıklama |
---|---|---|
configId | interaction
|
Bir etkileşim |
interactionField
{
value: object(interactionValue),
supportedActions: array(InteractionType)
}
interactionField
nesnesi, şurada tanımlanan supportedActions dizisini içerir:
yapılandırmanın yanı sıra etkileşim için kullanıcı tarafından seçilen değerleri içerir.
Alan | Tür | Açıklama |
---|---|---|
value | string OR object OR
bool OR number
|
Stil öğesinin değeri kullanıcı seçiminden döndürüldü özellik panelinde |
supportedActions | Array<InteractionType>
|
Bu API'nin desteklediği işlemler ve etkileşimin ( yapılandırma |
interactionValue
interactionValue
nesnesi, etkileşim için kullanıcı tarafından seçilen değerleri sağlar
türü. data
anahtarı varsa InteractionData
nesnesi
durumunu öğrenebilirsiniz. data
anahtarı yoksa görselleştirme
şu anda filtre olarak yapılandırılmış değil.
{
type: enum(InteractionType)
data: object(interactionData) | None
}
Alan | Tür | Açıklama |
---|---|---|
tür | enum(InteractionType)
|
Kullanıcı tarafından seçilen InteractionType |
veri | object(InteractionData)
|
Veriler mevcut durumuyla ilişkilidir seçin. Bu anahtar mevcut değil filtrenin geçerli olup olmadığını kontrol edin. |
tema
{
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
nesnesi, rapor teması bilgilerini görselleştirmeye iletir.
Alan | Tür | Açıklama |
---|---|---|
fillColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
fontColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
accentFillColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
accentFontColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
fontFamily | string |
Yazı tipi ailesini açıklayan bir dize |
accentFontFamily | string
|
Vurgu yazı tipini açıklayan bir dize aile |
increaseColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
decreaseColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
gridColor | object
|
{color:
string, opacity: number} biçimine sahip bir nesne |
seriesColor | Array<object>
|
Nesne dizisi
biçim{color: string, opacity:
number} |
tablesById
{
"DEFAULT": object(tableObject),
"COMPARISON": object(tableObject) | undefined
}
tableObject
, her bir satır için başlık ve veri bilgileri sağlar. "VARSAYILAN"
her zaman verileri döndürür ve "COMPARISON" girildiğinde, yalnızca kullanıcı
Verileri karşılaştırma satırlarıyla yapılandırır.
tableObject biçimi, dscc.tableFormat
arasındaki tek farktır
ve dscc.objectFormat
.
Alan | Tür | Açıklama |
---|---|---|
"VARSAYILAN" | object(tableObject) OR
Array<objectRow>
|
İlişkili tableObject
kullanıcının bir reklam grubuna eklediği veriler
görselleştirme |
"KARŞILAŞTIRMA" | object(tableObject) OR
Array<objectRow>
|
İlişkili tableObject
tarih karşılaştırma verileri (varsa)
geçerli |
dateRangesById
{
"DEFAULT": object(dateRange),
"COMPARISON": object(dateRange)
}
dateRangesById
nesnesi, varsayılan ve karşılaştırma hakkında bilgi sağlar
tarih aralıkları başlıklı makaleyi inceleyin. Herhangi bir tarih aralığı yoksa nesne
boştur. DEFAULT
ve COMPARISON
yalnızca ilgili tarihle doldurulur
aralıklar kullanıcı tarafından yapılandırıldığından emin olun. Tarih aralıklarındaki veriler,
tablesById'de tanımlandığı gibi varsayılan verileri ve karşılaştırma verilerini içerir.
Alan | Tür | Açıklama |
---|---|---|
"VARSAYILAN" | object(dateRange)
|
Şununla ilişkili dateRange
varsayılan tarih aralığı (varsa) belirleyin. |
"KARŞILAŞTIRMA" | object(dateRange)
|
Bir dateRange ile ilişkilendirilmiş
karşılaştırma tarih aralığı (varsa). |
dateRange
{
start: string,
end: string
}
dateRange
nesnesi, bir başlangıç ve bitiş tarihleri hakkında bilgi sağlar:
varsayılan veya karşılaştırma tarih aralığını seçin.
Alan | Tür | Açıklama |
---|---|---|
start | string |
Tarih aralığının YYYYAAGG biçimindeki başlangıç tarihi. |
end | string |
Tarih aralığının YYYYAAGG biçimindeki bitiş tarihi. |
tableFormat
referansı
tableObject
{
headers: array(object),
rows: array(array)
}
Alan | Tür | Açıklama |
---|---|---|
üst bilgiler | Array
|
Bir fields nesnesi dizisi. Bu alan
nesnelerin de bir configId özelliği vardır
yapılandırmadaki kimliklere karşılık gelir. |
satırlar | Array<Array> |
Diziler: Her dizi, bir veri satırıdır |
Örnek tableFormat
verileri
Bu, şu seçenekle dscc.subscribeToData()
kullanılarak döndürülen örnek data
örneğidir:
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"
]
}
}
}
nesneFormat referansı
objectRow
{
configId1: array(string | bool | number),
configId2: array(string | bool | number)
}
Alan | Tür | Açıklama |
---|---|---|
configId | dizi | belirli bir yapılandırma kimliğiyle ilişkili değerler dizisi |
Örnek nesneFormat verileri
Bu, şu seçenekle dscc.subscribeToData()
kullanılarak döndürülen örnek data
örneğidir:
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"
]
}
}
}