Dual-Axis Chart হল এমন একটি চার্ট যা একে অপরের সাথে সম্পর্কিত দুটি ভিন্ন ডেটাসেটের ভিজ্যুয়ালাইজেশন প্রদর্শন করে। এটি সাধারণত ব্যবহার করা হয় যখন দুটি ভিন্ন ধরনের ডেটার মধ্যে সম্পর্ক বা তুলনা করা দরকার, যেমন সেলস ডেটা এবং তাপমাত্রা, বা স্টক প্রাইস এবং বাজারের ভলিউম। Google Charts এ Dual-Axis Chart তৈরি করার মাধ্যমে আপনি দুটি ভিন্ন অক্ষের (এক্স-অ্যাক্সিস এবং ওয়াই-অ্যাক্সিস) মাধ্যমে ডেটা ভিজ্যুয়ালাইজ করতে পারেন।
Dual-Axis Chart এর প্রয়োজনীয়তা
- বিভিন্ন ডেটা ভেরিয়েবলের তুলনা: যখন আপনার কাছে দুটি ভিন্ন ভেরিয়েবল থাকে যা একটি নির্দিষ্ট সময় বা ক্যাটাগরির সাথে সম্পর্কিত, তখন Dual-Axis Chart ব্যবহার করা যেতে পারে। উদাহরণস্বরূপ, একটি কোম্পানির সেলস এবং মার্কেটিং বাজেটের তুলনা।
- বিভিন্ন স্কেলে ডেটা উপস্থাপন: কখনও কখনও, দুটি ডেটা সেটের মানের স্কেল এতটাই ভিন্ন হতে পারে যে একক অক্ষ ব্যবহার করলে তুলনা করা কঠিন হয়ে পড়ে। যেমন একটি ডেটা সেট সেলসের সংখ্যা হতে পারে, যা হাজারে পরিমাপ করা হয়, এবং আরেকটি ডেটা সেট তাপমাত্রা, যা সেলসিয়াসে পরিমাপ করা হয়। এমন অবস্থায়, Dual-Axis Chart খুবই কার্যকরী।
- ডেটার মধ্যে সম্পর্ক দেখানো: Dual-Axis Chart দুটি ভিন্ন ডেটাসেটের মধ্যে সম্পর্ক এবং কোরিলেশন দেখাতে সাহায্য করে। যেমন একটি ডেটা সেট প্রাথমিকভাবে বৃদ্ধি পাওয়ার সাথে সাথে আরেকটি ডেটা সেট কীভাবে তার সাথে সম্পর্কিত হচ্ছে তা পর্যবেক্ষণ করা।
- ভিজ্যুয়াল কনসোলিডেশন: একই চার্টে দুটি ভিন্ন ডেটা প্রদর্শন করা হলে, আপনার ডেটার ভিজ্যুয়াল উপস্থাপনা আরও সংগঠিত এবং স্পষ্ট হতে পারে।
Google Charts এ Dual-Axis Chart তৈরি করা
Google Charts ব্যবহার করে একটি Dual-Axis Chart তৈরি করা খুবই সহজ। এখানে আমরা একটি Combo Chart ব্যবহার করব, যা দুটি ভিন্ন ধরনের ডেটা সেট এবং দুইটি ভিন্ন অক্ষের মাধ্যমে ডেটা প্রদর্শন করতে সক্ষম।
উদাহরণ: Dual-Axis Chart
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dual-Axis Chart Example</title>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {packages: ['corechart', 'combo']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Temperature'],
['2019', 1000, 30],
['2020', 1170, 32],
['2021', 660, 35],
['2022', 1030, 33]
]);
var options = {
title: 'Sales and Temperature Over Time',
vAxis: {title: 'Sales', format: 'currency'},
vAxis: {title: 'Temperature (°C)', format: 'number'},
hAxis: {title: 'Year'},
seriesType: 'line', // লাইন চার্টে ডেটা দেখানোর জন্য
series: {
0: {targetAxisIndex: 0}, // প্রথম ডেটা সেট (Sales) এর জন্য প্রথম অক্ষ
1: {targetAxisIndex: 1} // দ্বিতীয় ডেটা সেট (Temperature) এর জন্য দ্বিতীয় অক্ষ
},
width: 900,
height: 500
};
var chart = new google.visualization.ComboChart(document.getElementById('dual_axis_chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<h2>Dual-Axis Chart Example</h2>
<div id="dual_axis_chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
ব্যাখ্যা:
- Data Preparation: ডেটা তৈরি করার জন্য
google.visualization.arrayToDataTable()ফাংশন ব্যবহার করা হয়েছে। এখানে দুটি ভিন্ন ডেটা সেট রয়েছে - সেলস এবং তাপমাত্রা (Temperature)। - Options:
- vAxis এবং hAxis: এক্স-অ্যাক্সিস (Year) এবং ওয়াই-অ্যাক্সিসের শিরোনাম এবং টাইটেল সেট করা হয়েছে।
- seriesType: এই অপশন দ্বারা আপনি কি ধরনের চার্ট ব্যবহার করবেন তা নির্ধারণ করা হয়। এখানে এটি লাইন চার্ট (line) হিসেবে সেট করা হয়েছে।
- series: এখানে দুইটি ভিন্ন অক্ষ নির্ধারণ করা হয়েছে - একটি সেলস ডেটার জন্য এবং অন্যটি তাপমাত্রা ডেটার জন্য।
- Rendering:
google.visualization.ComboChartফাংশন ব্যবহার করে Combo Chart তৈরি করা হয়েছে এবং এটি HTML ডকুমেন্টের একটিdivএলিমেন্টে প্রদর্শিত হয়েছে।
Dual-Axis Chart এর সুবিধা
- সহজ তুলনা: দুটি ভিন্ন ডেটা সেটের তুলনা করা সহজ হয়ে যায়।
- স্পষ্ট উপস্থাপনা: বিভিন্ন স্কেলে ডেটা প্রদর্শনের জন্য Dual-Axis Chart কার্যকরী, যেখানে একক অক্ষ ব্যবহার করা সম্ভব নয়।
- ইন্টারঅ্যাকটিভ ভিজ্যুয়ালাইজেশন: Google Charts এর মাধ্যমে ইন্টারঅ্যাকটিভ চার্ট তৈরি করা যায়, যা ব্যবহারকারীদের ডেটার সঙ্গে ইন্টারঅ্যাক্ট করতে দেয়।
- দ্বৈত অক্ষের সাপোর্ট: দুটি ভিন্ন অক্ষ ব্যবহার করে, আপনি ভিন্ন ধরনের ডেটা আরো স্পষ্টভাবে প্রদর্শন করতে পারেন।
উপসংহার
Dual-Axis Chart হল একটি গুরুত্বপূর্ণ টুল যা দুটি সম্পর্কিত ডেটা সেটের তুলনা এবং বিশ্লেষণে সহায়ক। Google Charts-এ এই ধরনের চার্ট তৈরি করা খুবই সহজ এবং এর মাধ্যমে আপনি ডেটাকে আরও কার্যকরী এবং তুলনামূলকভাবে উপস্থাপন করতে পারেন। বিভিন্ন স্কেলে ডেটা তুলনা এবং সম্পর্কের বিশ্লেষণে এটি অত্যন্ত কার্যকরী।
Read more
