Google Charts API এবং GWT (Google Web Toolkit) এর মাধ্যমে ডেটা ভিজ্যুয়ালাইজেশন করার সময় Date এবং Time Formatting খুবই গুরুত্বপূর্ণ। কারণ অনেক সময় ডেটাতে সময়, তারিখ বা তারিখ এবং সময়ের যৌথ উপস্থাপনা থাকে, যা সঠিকভাবে প্রদর্শন করতে পারলে ডাটা আরও স্পষ্ট এবং সহজবোধ্য হয়।
এই টিউটোরিয়ালে আমরা দেখব কিভাবে Date এবং Time Formatting গুগল চার্টের মধ্যে সঠিকভাবে ব্যবহার করা যায় GWT এর মাধ্যমে।
Date Formatting
Date Formatting এর মাধ্যমে আমরা ডেটাতে ব্যবহৃত তারিখের ধরন কাস্টমাইজ করতে পারি। GWT এবং Google Charts API-এর মাধ্যমে তারিখের উপস্থাপনাকে আরো পরিষ্কার এবং সহজবোধ্য করা সম্ভব। উদাহরণস্বরূপ, আপনি তারিখকে "DD/MM/YYYY" ফরম্যাটে, অথবা "MM-DD-YYYY" ফরম্যাটে প্রদর্শন করতে পারেন।
Date Formatting-এর উদাহরণ
public class DateFormattingExample {
public native void drawDateChart() /*-{
var data = new $wnd.google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Value');
// Add rows with dates
data.addRow([new $wnd.Date(2023, 0, 1), 100]);
data.addRow([new $wnd.Date(2023, 0, 2), 120]);
data.addRow([new $wnd.Date(2023, 0, 3), 150]);
var options = {
title: 'Date Formatting Example',
hAxis: {
format: 'MMM dd, yyyy', // Custom date format
},
vAxis: {
title: 'Value'
},
};
var chart = new $wnd.google.visualization.LineChart($doc.getElementById('chart_div'));
chart.draw(data, options);
}-*/;
}
এখানে, hAxis.format ব্যবহার করে Date-এর কাস্টম ফরম্যাট "MMM dd, yyyy" নির্ধারণ করা হয়েছে, যাতে "Jan 01, 2023" অথবা "Feb 20, 2023" এর মতো তারিখ প্রদর্শিত হয়। Google Charts এই ফরম্যাট অনুযায়ী তারিখটি রেন্ডার করবে।
Time Formatting
Time Formatting এর মাধ্যমে আপনি সময়ের উপস্থাপনও কাস্টমাইজ করতে পারেন। আপনি সময়কে "HH:MM:SS" বা "hh:mm a" ফরম্যাটে অথবা আরও কাস্টম ফরম্যাটে দেখাতে পারবেন। সময়ের ফরম্যাটিং ব্যবহার করলে বিশেষত ডাটা টাইম সিরিজ এবং টাইম-বেসড ডাটা ভিজ্যুয়ালাইজেশন অনেক সহজ হয়।
Time Formatting-এর উদাহরণ
public class TimeFormattingExample {
public native void drawTimeChart() /*-{
var data = new $wnd.google.visualization.DataTable();
data.addColumn('timeofday', 'Time');
data.addColumn('number', 'Value');
// Add rows with time (hour, minute, second)
data.addRow([[8, 0, 0], 100]);
data.addRow([[9, 30, 0], 120]);
data.addRow([[10, 0, 0], 150]);
var options = {
title: 'Time Formatting Example',
hAxis: {
format: 'HH:mm a', // Time format
},
vAxis: {
title: 'Value'
},
};
var chart = new $wnd.google.visualization.LineChart($doc.getElementById('chart_div'));
chart.draw(data, options);
}-*/;
}
এখানে, hAxis.format ব্যবহার করে Time এর কাস্টম ফরম্যাট "HH:mm a" নির্ধারণ করা হয়েছে, যাতে সময় 08:00 AM, 09:30 AM বা 10:00 AM এর মতো প্রদর্শিত হয়।
Date এবং Time Formatting-এর গুরুত্বপূর্ণ পয়েন্টসমূহ
১. Date এবং Time Format String
Google Charts-এর Date এবং Time Formatting কাস্টমাইজ করার জন্য বিভিন্ন ধরনের ফরম্যাট স্ট্রিং ব্যবহার করা যায়। কিছু সাধারণ ফরম্যাট স্ট্রিং হলো:
- Date Formatting:
'yyyy-MM-dd': 2023-01-01'MM/dd/yyyy': 01/01/2023'MMM dd, yyyy': Jan 01, 2023'dd MMM yyyy': 01 Jan 2023
- Time Formatting:
'HH:mm': 08:00'HH:mm:ss': 08:00:00'HH:mm a': 08:00 AM'h:mm a': 8:00 AM
২. Date এবং Time Data Types
Google Charts API-তে Date এবং Time এর জন্য বিশেষ ডাটা টাইপ ব্যবহৃত হয়:
- Date টাইপ:
new Date(year, month, day)এর মাধ্যমে তারিখ তৈরি করা হয়। - Time টাইপ:
timeofdayকলামের মাধ্যমেnew Date(hour, minute, second)টাইপ ব্যবহার করে সময় সেট করা হয়।
৩. Time Zone
Google Charts API তারিখ এবং সময়ের জন্য ডিফল্ট UTC (Coordinated Universal Time) সময় অঞ্চল ব্যবহার করে। তবে, আপনি স্থানীয় সময় অঞ্চল ব্যবহার করতে চাইলে, ব্রাউজারের সময় অঞ্চল সেটিংস অনুসারে স্বয়ংক্রিয়ভাবে সময় রূপান্তরিত হবে।
Date এবং Time Formatting এর সুবিধা
- কাস্টম ডাটা ভিজ্যুয়ালাইজেশন: Date এবং Time Formatting আপনাকে কাস্টম সময় এবং তারিখ ফরম্যাটে ডাটা প্রদর্শন করতে সহায়তা করে, যা ডাটা বিশ্লেষণ সহজ করে তোলে।
- ইউজার ফ্রেন্ডলি: যখন ডেটা সময় এবং তারিখের মধ্যে থাকবে, তখন তা ইউজার ফ্রেন্ডলি এবং বোঝার জন্য সুবিধাজনক হয়ে ওঠে।
- ইন্টারেকটিভ চার্ট: GWT এবং Google Charts ব্যবহার করে কাস্টম টাইম এবং ডেটা ফরম্যাটের মাধ্যমে আরও ইন্টারেকটিভ এবং তথ্যপূর্ণ চার্ট তৈরি করা যায়।
Date এবং Time Formatting GWT Google Charts-এ অত্যন্ত গুরুত্বপূর্ণ এবং ব্যবহারকারীদের ডেটা সঠিকভাবে প্রদর্শন করার জন্য এটি একটি গুরুত্বপূর্ণ টুল। কাস্টম ফরম্যাটিং এর মাধ্যমে সময় এবং তারিখের উপস্থাপনাকে আরও স্পষ্ট এবং আকর্ষণীয় করা সম্ভব, যা ডাটা বিশ্লেষণে সহায়ক হয়।
Read more