مرجع ضبط مرئيات المنتدى

تحدد تهيئة التصورات سمات البيانات والنمط التي يتطلبها مؤثرات عرض البيانات.

ويُتوقَّع ضبط هذه الإعدادات كملف JSON بالبنية التالية:

{
  "data": [{
    "id": string,
    "label": string,
    "elements": [{
      "type": enum(DataElement),
      "id": string,
      "label": string,
      "options": object(DataElementOptions)
    }]
  }],
  "style": [{
    "id": string,
    "label": string,
    "elements": [{
      "type": enum(StyleElement),
      "id": string,
      "label": string,
      "defaultValue": string | object
    }]
  }],
  "interactions": [{
    "id": string,
    "supportedActions": array(enum(InteractionType))
  }],
  "features": {
   "enableComparisonDateRange": boolean
  }
}
اسم الحقل النوع الوصف
data[] Array(object) تكوين البيانات للتصور. تؤثِّر هذه الإعدادات في جزء البيانات في لوحة المواقع.
data[].id string رقم تعريف قسم البيانات. ويجب أن تكون سلسلة غير فارغة بدون مسافات.
data[].label string تسمية قسم البيانات.
data[].elements[] string عناصر البيانات المطلوب عرضها.
data[].elements[].type تعداد string(DataElement) نوع عنصر البيانات المطلوب عرضه.
data[].elements[].id string رقم تعريف عنصر البيانات. ويجب أن تكون سلسلة غير فارغة بدون مسافات.
data[].elements[].label string تصنيف التلميح لعنصر البيانات.
data[].elements[].options object(DataElementOptions) خيارات البيانات للعنصر. ويعتمد ذلك على نوع عنصر البيانات.
style[] Array(object) تهيئة النمط التي يتطلبها التصور. تؤثر هذه الإعدادات في جزء النمط في لوحة الخصائص. يمثل كل كائن في الصفيف عنصر نمط لعرضه. ويحدِّد ترتيب العناصر الترتيب الذي سيتم عرضها به.
style[].id string رقم تعريف قسم النمط. ويجب أن تكون سلسلة غير فارغة بدون مسافات.
style[].label string تسمية قسم النمط.
style[].elements Array(object) عناصر النمط المراد عرضها.
style[].elements[].id string معرف عنصر النمط. يجب أن تكون سلسلة غير فارغة بدون مسافات.
style[].elements[].type تعداد string(StyleElement) نوع عنصر النمط. مثلاً: محدد الخط.
style[].elements[].label string التلميح أو التصنيف لعنصر النمط. هذا هو نص التصنيف لعنصر مربّع الاختيار ونص التلميح لأنواع العناصر الأخرى.
style[].elements[].options Array(object) تمثّل هذه السمة options للعنصر. لا يسري هذا إلا على نوعَي عناصر النمط SELECT_SINGLE وSELECT_RADIO.
style[].elements[].defaultValue string OR object القيمة الافتراضية لعنصر النمط. وسيتم تجاهل القيم غير الصالحة.*
interactions[] Array(object) تكوين التفاعلات للتصور. تحدِّد هذه الإعدادات ما إذا كان يمكن استخدام الفلتر كفلتر أم لا.
interactions[].id string رقم تعريف عنصر التفاعل. ويجب أن تكون سلسلة غير فارغة بدون مسافات.
interactions[].supportedActions Array (enum(InteractionType) التفاعلات المحتملة المدعومة
features object الميزات التي تريد تفعيلها أو إيقافها في التمثيل البصري
features.enableComparisonDateRange boolean فعِّل النطاقات الزمنية للمقارنة. ويتم ضبط القيمة التلقائية على false في حال عدم تحديدها.

*defaultValue هي سلسلة لكل العناصر ما عدا أدوات اختيار الألوان. بالنسبة الألوان، يجب أن تكون defaultValue كائنًا بالتنسيق:

{
    color: `string`
}

DataElement

يمكن أن تكون قيم عناصر البيانات واحدة مما يلي:

قيمة التعداد الوصف
المقياس لعرض عنصر حقل مقياسي.
السمة يعرض عنصر حقل بُعد.
MAX_RESULTS تحدد الحد الأقصى لصفوف البيانات التي يمكن طلبها من خلال هذه التصورات

خيارات DataElement

يمكن أن تكون قيم عناصر البيانات واحدة مما يلي:

قيمة التعداد نوع الخيار الخيارات المتاحة
المقياس الكائن الحد الأقصى: العدد - الحد الأقصى لعدد المقاييس
دقيقة: العدد - الحد الأدنى لعدد المقاييس المطلوبة
السمة الكائن الحد الأقصى: العدد - الحد الأقصى لعدد السمات المتوافقة.
دقيقة: العدد - الحد الأدنى للأبعاد المطلوبة
نوع متوافق: قائمة الأنواع المتوافقة. يمكن أن تتضمن السمة supportedTypes TIME أو GEO أو DEFAULT
MAX_RESULTS الكائن الحد الأقصى: العدد - الحد الأقصى لعدد الصفوف التي يمكن أن يطلبها التصور. القيمة التلقائية: 2500

StyleElement

يمكن أن تكون قيم عناصر النمط واحدة مما يلي:

قيمة التعداد الوصف نوع البيانات "defaultValue" (الإعداد) value نوع البيانات (رسالة) القيمة الافتراضية
FONT_COLOR تعرِض أداة اختيار ألوان الخط. القيم الصالحة هي رموز ألوان سداسية عشرية. STRING | OBJECT<Color> STRING | OBJECT<Color> يتم تحديده حسب الموضوع.
FONT_SIZE لعرض أداة اختيار حجم الخط القيم الصالحة هي وحدات البكسل التالية: 8 و9 و10 و11 و12 و14 و16 و18 و20 و24 و28 و30 و32 و36 و40 و44 و48 و60 و72 و84 و96. NUMBER NUMBER 12
FONT_FAMILY عرض أداة اختيار مجموعة الخطوط STRING STRING يتم تحديده حسب الموضوع.
CHECKBOX عرض مربّع اختيار BOOLEAN BOOLEAN false
TEXTINPUT لعرض مربّع إدخال نص STRING STRING ""
TEXTAREA يعرض منطقة إدخال نص كبيرة. STRING STRING ""
SELECT_SINGLE يعرض قائمة منسدلة بقيم محددة مسبقًا. STRING (لكلّ من defaultValue وOptions.label وOptions.value) STRING غير محدّدة
SELECT_RADIO تعرض أداة اختيار الراديو بقيم محدّدة مسبقًا. STRING (لكلّ من defaultValue وOptions.label وOptions.value) STRING غير محدّدة
FILL_COLOR تعرض أداة اختيار لون التعبئة القيم الصالحة هي رموز ألوان ست عشرية. STRING | OBJECT<Color> OBJECT<Color> يتم تحديده حسب الموضوع.
BORDER_COLOR لعرض أداة اختيار لون الحدود القيم الصالحة هي رموز ألوان ست عشرية. STRING | OBJECT<Color> OBJECT<Color> يتم تحديده حسب الموضوع.
AXIS_COLOR لعرض أداة اختيار ألوان المحور القيم الصالحة هي رموز ألوان ست عشرية. STRING | OBJECT<Color> OBJECT<Color> يتم تحديده حسب الموضوع.
GRID_COLOR تعرض أداة اختيار ألوان الشبكة القيم الصالحة هي رموز ألوان ست عشرية. STRING | OBJECT<Color> OBJECT<Color> يتم تحديده حسب الموضوع.
تعتيم تعرض أداة اختيار التعتيم، الوحدة هي %. تتراوح القيم الصالحة من 0 إلى 1 بزيادات 0.1. NUMBER NUMBER 1
LINE_WEIGHT يعرض أداة اختيار عرض الخط. تتراوح القيم الصالحة من 0 إلى 5. سيتم عرض القيمة "0" على أنّه "بدون" في القائمة المنسدلة. NUMBER NUMBER
LINE_STYLE لعرض أداة اختيار نمط الخط. القيم التلقائية المقبولة: solid وdashed وdotted وdouble. STRING STRING "solid"
BORDER_RADIUS لعرض أداة اختيار نصف قطر الحد القيم الصالحة هي: 0، 1، 2، 3، 4، 5، 10، 15، 20، 25، 30، 40، 50، 60، 70، 80، 90، 100 NUMBER NUMBER يتم تحديده حسب الموضوع.
الفترة الزمنية لعرض أداة اختيار الفاصل الزمني القيم هي أعداد صحيحة. NUMBER NUMBER 0

تضبط عناصر النمط الرموز المعروضة في علامة التبويب Style في الموقع. اللوحة.

خيارات عناصر النمط

تدعم بعض عناصر النمط الخيارات

options: array(options)
قيمة التعداد كائن الخيارات
SELECT_SINGLE
        {
            label: `string`,
            value: `string`
        }
        
SELECT_RADIO
        {
            label: `string`,
            value: `string`
        }
        
الفترة الزمنية
        {
            max: `number`,
            min: `number`
        }
        

أنواع البيانات

الكائن<Color>

{
  color: STRING<Color>,
  opacity: NUMBER<Opacity>
}

STRING&lt;Color&gt;

قيمة سلسلة تحتوي على رمز لون ست عشري.

مثال

"color": "#0000ff"

NUMBER<معدل الشفافية>

قيمة رقم من 0 إلى 1 بزيادات 0.10

مثال

"opacity": 0.2

InteractionType

تعمل InteractionTypes على ضبط خيارات التفاعل المتاحة في نمط Data. في لوحة الموقع. في الوقت الحالي، يُسمح فقط باستخدام "FILTER".

قيمة التعداد الوصف
"FILTER" يسمح هذا الخيار للمستخدمين باستخدام التمثيل البصري كفلتر.

مثال على الإعدادات

{
  "data": [{
    "id": "concepts",
    "label": "concepts",
    "elements": [
      {
        "id": "dimension1",
        "label": "first dimension",
        "type": "DIMENSION",
        "options": {
          "min": 1,
          "max": 3,
          "supportedTypes": ["DEFAULT"]
        }
      },
      {
        "id": "metric",
        "label": "metric",
        "type": "METRIC",
        "options": {
          "min": 1,
          "max": 3
        }
      }
    ]
  }],
  "style": [
    {
      "id": "colors",
      "label": "Highlight Colors",
      "elements": [
        {
          "id": "accentColor",
          "label": "Accent Color",
          "type": "SELECT_SINGLE",
          "defaultValue": "rain",
          "options": [
            {
              "label": "Summer",
              "value": "summer"
            },
            {
              "label": "Fall",
              "value": "fall"
            }
          ]
        },
        {
          "id": "reverseColor",
          "label": "Show reverse color",
          "defaultValue": false,
          "type": "CHECKBOX"
        },
        {
          "id": "fillColor",
          "label": "Fill Color",
          "defaultValue": {
            "color": "#0000ff"
          },
          "type": "FILL_COLOR"
        },
        {
          "id": "textOpacity",
          "label": "Text Opacity",
          "defaultValue": 0.2,
          "type": "OPACITY"
        },
        {
          "id": "customText",
          "label": "Custom Text",
          "defaultValue": "0.2",
          "type": "TEXTINPUT"
        }
      ]
    },
    {
      "id": "text",
      "label": "Highlight Text",
      "elements": [
        {
          "id": "textFontSize",
          "label": "Font size",
          "defaultValue": 10,
          "type": "FONT_SIZE"
        },
        {
          "id": "font",
          "label": "Font family",
          "defaultValue": "Arial",
          "type": "FONT_FAMILY"
        }
      ]
    }
  ],
  "interactions": [
    {
      "id": "interactionsConfigId",
      "supportedActions": ["FILTER"]
    }
  ],
  "features": {
    "enableComparisonDateRange": false
  }
}