كتابة التعليمة البرمجية التصور
توفّر مكتبة مساعد Looker Studio واجهةً بينك وبين Looker Studio. لاستخدام المكتبة، قدِّم دالة استدعاء تعرض التصور.
والوظيفة الأبرز في المكتبة هي subscribeToData
، والتي تستند إلى وسيطتين: هما callback
التي تعرض التمثيل المرئي، وكائن options
الذي يحدّد نوع التحويل الذي تريد إجراء البيانات عليه. لمعرفة المزيد من المعلومات، يمكنك الاطّلاع على مرجع المكتبة.
يقدم ما يلي مخططًا تفصيليًا لما يمكن أن يبدو عليه التمثيل المرئي الخاص بك في JavaScript.
function drawViz(vizData){
var height = dscc.getHeight();
var width = dscc.getWidth();
console.log(vizData);
// this is where you write your viz code
}
dscc.subscribeToData(drawViz, {transform: dscc.objectTransform})
هناك بعض الأشياء الأساسية التي يجب وضعها في الاعتبار عند كتابة تصور للمجتمع.
وتحدث التحديثات من الدالة subscribeToData
عند تغيُّر البيانات أو النمط أو
حجم إطار iframe.
مثال:
// create and add the canvas
// do this one time
var canvasElement = document.createElement('canvas');
var ctx = canvasElement.getContext('2d');
canvasElement.id = 'myViz';
document.body.appendChild(canvasElement);
function drawViz(data){
// clear the canvas
var ctx = canvasElement.getContext('2d');
ctx.clearRect(0, 0, canvasElement.width, canvasElement.height);
// viz code goes here
}
تُحمّل أداة Looker Studio ملفات JavaScript وتشغّلها، وليس ملفات HTML. يجب أن تحدث كل معالجة DOM من خلال JavaScript.
على سبيل المثال، يحدِّد الرمز التالي عنصر div
ويضيفه إلى نموذج العناصر في المستند (DOM).
// create and add the canvas
var chartElement = document.createElement('div');
chartElement.id = 'myViz';
document.body.appendChild(chartElement);
تجميع الرمز
من خلال العروض المرئية لمنتدى Looker Studio، يمكنك تحميل ملف JavaScript واحد فقط. يجب أن يكون الرمز الذي تم تحميله ملفًا واحدًا يحتوي على مكتبة المساعدة في dscc، وأي مكتبات لمؤثرات عرض JavaScript، ورمز العرض المرئي الخاص بك.
ولإجراء ذلك في bash، يمكنك استخدام الأمر cat
على النحو الموضّح أدناه.
cat dscc.min.js vizLibrary.js myVizSource.js > myViz.js
تعريف البيان
يوفر ملف بيان التصور بيانات وصفية حول التصور، بالإضافة إلى معلومات حول موقع موارد التصور. يُشار إلى موقع ملف البيان باسم "معرِّف المكوِّن"، ويُستخدم لتحميل مرئيات المنتدى.
يمكنك مراجعة مرجع البيان للاطّلاع على نموذج للبيان.
.تحدد المعلمة devMode
للبيان سلوك التخزين المؤقت
للتصور. أثناء تطوير التمثيل البصري، يجب ضبط السمة devMode
على السمة true
لضمان تحميل أحدث نسخة من الموارد في عمليات إعادة التحميل الثابتة. عندما يكون الرمز البرمجي ثابتًا، يجب أن تكون devMode
مضبوطة على false
لضمان سرعة تحميل التقارير التي تتضمّن رسومات بيانية للمجتمع. لمزيد من المعلومات حول التخزين المؤقت، يمكنك الاطّلاع على الدليل المتقدم حول التخزين المؤقت.
الخطوات التالية
الآن بعد أن كتبت رمز العرض المرئي، تعرَّف على كيفية استضافة العرض المرئي.