ভিজ্যুয়ালাইজেশন কনফিগারেশন একটি ভিজ্যুয়ালাইজেশনের জন্য প্রয়োজনীয় ডেটা এবং শৈলী বৈশিষ্ট্যগুলিকে সংজ্ঞায়িত করে।
নিম্নলিখিত কাঠামো সহ একটি 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 enum ( ডেটা এলিমেন্ট ) | রেন্ডার করার জন্য ডেটা উপাদানের ধরন। |
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 enum ( স্টাইল এলিমেন্ট ) | শৈলী উপাদান প্রকার. যেমন ফন্ট নির্বাচক। |
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 ( ইন্টারঅ্যাকশন টাইপ ) | সম্ভাব্য মিথস্ক্রিয়া সমর্থিত |
features | object | আপনার ভিজ্যুয়ালাইজেশনে আপনি যে বৈশিষ্ট্যগুলি সক্ষম বা অক্ষম করতে চান। |
features.enableComparisonDateRange | boolean | তুলনা তারিখের ব্যাপ্তি সক্ষম করুন৷ অনির্দিষ্ট থাকলে ডিফল্ট false । |
* defaultValue
হল রঙ নির্বাচক ছাড়া সব কিছুর জন্য একটি স্ট্রিং। রঙের জন্য, defaultValue
বিন্যাসের একটি বস্তু হওয়া উচিত:
{
color: `string`
}
ডেটা এলিমেন্ট
ডেটা উপাদানগুলির মানগুলি নিম্নলিখিতগুলির মধ্যে একটি হতে পারে:
এনাম মান | বর্ণনা |
---|---|
মেট্রিক | একটি মেট্রিক ক্ষেত্র উপাদান রেন্ডার করে। |
ডাইমেনশন | একটি মাত্রা ক্ষেত্রের উপাদান রেন্ডার করে। |
MAX_RESULTS | এই ভিজুয়ালাইজেশন দ্বারা অনুরোধ করা যেতে পারে এমন ডেটার সর্বাধিক সারিগুলিকে সংজ্ঞায়িত করে৷ |
ডেটা এলিমেন্ট বিকল্প
ডেটা উপাদানগুলির মানগুলি নিম্নলিখিতগুলির মধ্যে একটি হতে পারে:
এনাম মান | বিকল্প প্রকার | বিকল্প উপলব্ধ |
---|---|---|
মেট্রিক | অবজেক্ট | সর্বোচ্চ: সংখ্যা - মেট্রিক্সের সর্বাধিক সংখ্যা ন্যূনতম: সংখ্যা - প্রয়োজনীয় মেট্রিক্সের ন্যূনতম সংখ্যা |
ডাইমেনশন | অবজেক্ট | সর্বোচ্চ: সংখ্যা - সমর্থিত মাত্রার সর্বাধিক সংখ্যা। মিন: সংখ্যা - প্রয়োজনীয় মাত্রার ন্যূনতম সংখ্যা supportedTypes: সমর্থিত প্রকারের তালিকা। supportedTypes মধ্যে TIME , GEO , বা DEFAULT অন্তর্ভুক্ত থাকতে পারে৷ |
MAX_RESULTS | অবজেক্ট | সর্বাধিক: সংখ্যা - ভিজ্যুয়ালাইজেশন অনুরোধ করতে পারে এমন সারিগুলির সর্বাধিক সংখ্যা৷ ডিফল্ট: 2500 |
স্টাইল এলিমেন্ট
শৈলী উপাদানগুলির মানগুলি নিম্নলিখিতগুলির মধ্যে একটি হতে পারে:
এনাম মান | বর্ণনা | 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 | ফন্ট ফ্যামিলি সিলেক্টর রেন্ডার করে। বৈধ মান হল নিম্নলিখিত ফন্ট: Arial, Boogaloo, Bubblegum Sans, Chewy, Comic Sans MS, Coming Soon, Cormorant Unicase, Courier New, Droid, Droid Sans, Eater, Georgia, Google Sans, Great Vibes, Indie Flower, Lato, Lora , Montserrat, Oleo Script, Open Sans, Orbitron, Oswald, Permanent Marker, Quicksand, Raleway, Reenie Beanie, Roboto, Roboto Condensed, Syncopate, Times New Roman, Ubuntu, Ubuntu Mono, Verdana. | STRING | STRING | থিম দ্বারা নির্ধারিত. |
চেকবক্স | একটি চেকবক্স রেন্ডার করে। | BOOLEAN | BOOLEAN | false |
TEXTINPUT | একটি পাঠ্য ইনপুট বাক্স রেন্ডার করে। | STRING | STRING | "" |
টেক্সটেরিয়া | একটি বড় টেক্সট ইনপুট এলাকা রেন্ডার করে। | 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 ড্রপডাউনে None হিসেবে রেন্ডার হবে। | 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 | থিম দ্বারা নির্ধারিত. |
INTERVAL | একটি ব্যবধান নির্বাচক রেন্ডার করে। মান হল পূর্ণসংখ্যা। | NUMBER | NUMBER | 0 |
স্টাইল উপাদানগুলি প্রপার্টি প্যানেলের Style
ট্যাবে প্রদর্শিত আইকনগুলিকে কনফিগার করে।
শৈলী উপাদান বিকল্প
কিছু শৈলী উপাদান বিকল্প সমর্থন করে
options: array(options)
এনাম মান | অপশন অবজেক্ট |
---|---|
SELECT_SINGLE | { label: `string`, value: `string` } |
SELECT_RADIO | { label: `string`, value: `string` } |
INTERVAL | { max: `number`, min: `number` } |
ডেটা প্রকার
বস্তু<রঙ>
{
color: STRING<Color>,
opacity: NUMBER<Opacity>
}
STRING<রঙ>
হেক্স কালার কোড ধারণকারী একটি স্ট্রিং মান।
উদাহরণ
"color": "#0000ff"
NUMBER<অস্বচ্ছতা>
0.10 এর বৃদ্ধিতে 0 থেকে 1 পর্যন্ত একটি সংখ্যার মান
উদাহরণ
"opacity": 0.2
ইন্টারঅ্যাকশন টাইপ
ইন্টারঅ্যাকশন টাইপগুলি প্রপার্টি প্যানেলের 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
}
}