Google Charts আপনাকে বিভিন্ন ধরনের চার্ট তৈরি করার সুযোগ দেয় এবং একই সময়ে বিভিন্ন Chart Types এর সংমিশ্রণ ও কাস্টমাইজেশন করার সুবিধা প্রদান করে। এটি ডেটাকে আরও আকর্ষণীয় এবং অর্থপূর্ণ উপস্থাপনার জন্য সাহায্য করে, যেখানে একাধিক চার্ট একই পৃষ্ঠায় একসাথে ব্যবহার করা যেতে পারে। এখানে আমরা দেখব কিভাবে Chart Types এর সংমিশ্রণ এবং Customization করা যায়।
১. Chart Types এর সংমিশ্রণ (Combination of Chart Types)
Google Charts আপনাকে একাধিক চার্ট টিপের সংমিশ্রণ করতে দেয়, যেমন বার চার্ট এবং লাইন চার্ট একসাথে, বা পাই চার্টের সাথে অন্যান্য চার্টের সংমিশ্রণ। এই সংমিশ্রণগুলি ডেটা বিশ্লেষণকে আরও গভীরভাবে উপস্থাপন করতে সহায়ক।
সংমিশ্রিত চার্ট তৈরি করার জন্য:
- আপনি একাধিক series ব্যবহার করতে পারেন, যেখানে প্রতিটি সিরিজের জন্য আলাদা ধরনের চার্ট নির্ধারণ করা হয়।
- Combo Chart ব্যবহার করে বার, লাইন, এবং অন্যান্য চার্টের সংমিশ্রণ করা সম্ভব।
উদাহরণ: বার চার্ট এবং লাইন চার্টের সংমিশ্রণ
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses'],
['2020', 1000, 400],
['2021', 1170, 460],
['2022', 660, 1120],
['2023', 1030, 540]
]);
var options = {
title: 'Company Performance',
hAxis: {title: 'Year'},
vAxis: {title: 'Amount (in USD)'},
seriesType: 'bars', // Default series type: Bar Chart
series: {
1: {type: 'line'} // Second series (Expenses) as Line Chart
},
legend: { position: 'top' }
};
var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);
এখানে ComboChart ব্যবহার করে Sales (বার চার্ট) এবং Expenses (লাইন চার্ট) কে একসাথে প্রদর্শন করা হয়েছে। seriesType দিয়ে প্রথম সিরিজের জন্য bar এবং দ্বিতীয় সিরিজের জন্য line নির্ধারণ করা হয়েছে।
২. Customization (কাস্টমাইজেশন)
Google Charts এ চার্ট কাস্টমাইজ করার অনেক সুযোগ রয়েছে। আপনি চার্টের লেআউট, রঙ, লাইন স্টাইল, লেবেল, অক্ষ এবং অন্যান্য ভিজ্যুয়াল উপাদান কাস্টমাইজ করতে পারেন।
কিছু গুরুত্বপূর্ণ কাস্টমাইজেশন অপশন:
- Title (শিরোনাম): চার্টের শিরোনাম কাস্টমাইজ করা।
- Axis Titles (অক্ষের শিরোনাম): এক্স-অ্যাক্সিস এবং ওয়াই-অ্যাক্সিসের শিরোনাম।
- Legend (লেজেন্ড): চার্টের লেজেন্ডের অবস্থান এবং স্টাইল কাস্টমাইজ করা।
- Line and Point Styles (লাইন এবং পয়েন্ট স্টাইল): লাইন চওড়া, রং, পয়েন্ট আকার এবং শেপ কাস্টমাইজ করা।
উদাহরণ:
var options = {
title: 'Sales vs Expenses',
hAxis: {
title: 'Year',
titleTextStyle: { color: 'blue' } // এক্স-অ্যাক্সিসের শিরোনামের রং
},
vAxis: {
title: 'Amount (in USD)',
titleTextStyle: { color: 'green' } // ওয়াই-অ্যাক্সিসের শিরোনামের রং
},
legend: { position: 'top', textStyle: { color: 'red', fontSize: 14 } }, // লেজেন্ডের কাস্টমাইজেশন
series: {
0: { color: '#ff5733', lineWidth: 4, pointSize: 10 }, // প্রথম সিরিজের কাস্টমাইজেশন
1: { color: '#33c1ff', lineWidth: 2, pointSize: 6 } // দ্বিতীয় সিরিজের কাস্টমাইজেশন
}
};
এখানে আমরা:
- হরিজেন্টাল (এক্স-অ্যাক্সিস) ও ভারটিকাল (ওয়াই-অ্যাক্সিস) শিরোনামের রং পরিবর্তন করেছি।
- লেজেন্ডের অবস্থান এবং স্টাইল কাস্টমাইজ করেছি।
- প্রতিটি সিরিজের জন্য রং, লাইন ওয়েডথ এবং পয়েন্টের আকার কাস্টমাইজ করেছি।
৩. একমাত্র চার্টের মধ্যে একাধিক সিরিজ (Multiple Series in a Single Chart)
একই চার্টে একাধিক সিরিজ (যেমন, Sales, Expenses, Profit) উপস্থাপন করতে Google Charts ব্যবহার করা যেতে পারে। প্রতিটি সিরিজের জন্য আলাদা চার্ট টাইপ, রং এবং অন্যান্য ভিজ্যুয়াল উপাদান কাস্টমাইজ করা সম্ভব।
উদাহরণ:
var options = {
title: 'Company Performance',
hAxis: { title: 'Year' },
vAxis: { title: 'Amount (in USD)' },
seriesType: 'line', // Default type for all series: Line Chart
series: {
0: { type: 'line', color: 'green' }, // Sales as line chart
1: { type: 'bar', color: 'blue' }, // Expenses as bar chart
2: { type: 'area', color: 'orange' } // Profit as area chart
}
};
এখানে Sales, Expenses, এবং Profit সিরিজ গুলিকে আলাদা আলাদা চার্ট টাইপের মাধ্যমে উপস্থাপন করা হয়েছে:
- Sales - লাইন চার্ট
- Expenses - বার চার্ট
- Profit - এরিয়া চার্ট
৪. চালু করা বিভিন্ন চার্ট টাইপের সংমিশ্রণ (Combining Different Chart Types)
এছাড়া আপনি বার চার্ট, লাইন চার্ট এবং পাই চার্ট একত্রে ব্যবহার করতে পারেন একটি ড্যাশবোর্ড বা রিপোর্টে ডেটার ভিন্ন ভিন্ন দিক দেখানোর জন্য।
উদাহরণ:
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit'],
['2020', 1000, 400, 600],
['2021', 1170, 460, 710],
['2022', 660, 1120, 80],
['2023', 1030, 540, 490]
]);
var options = {
title: 'Company Performance',
hAxis: { title: 'Year' },
vAxis: { title: 'Amount (in USD)' },
seriesType: 'bars', // Default type for all series: Bar Chart
series: {
0: { type: 'line' }, // Sales as line chart
1: { type: 'bar' }, // Expenses as bar chart
2: { type: 'area' } // Profit as area chart
}
};
var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);
এখানে ComboChart ব্যবহার করে তিনটি আলাদা সিরিজের সংমিশ্রণ তৈরি করা হয়েছে, যেখানে Sales লাইন চার্ট, Expenses বার চার্ট এবং Profit এরিয়া চার্ট হিসাবে প্রদর্শিত হচ্ছে।
উপসংহার
Google Charts এর Chart Types এর সংমিশ্রণ এবং Customization এর মাধ্যমে আপনি আপনার ডেটাকে আরও আকর্ষণীয় ও বিস্তারিতভাবে উপস্থাপন করতে পারবেন। এটি ডেটার বিভিন্ন দিক দেখতে সাহায্য করে এবং একটি পৃষ্ঠায় একাধিক তথ্য উপস্থাপন করতে সক্ষম। আপনি যখন Chart Types সংমিশ্রণ করেন, তখন এটি ডেটার বিশ্লেষণ ও উপস্থাপনার জন্য আরও কার্যকরী হয়ে ওঠে।
Read more
