Logarithmic এবং Time Scales ব্যবহার করা

Chart.js একটি শক্তিশালী লাইব্রেরি যা বিভিন্ন ধরণের স্কেল সাপোর্ট করে, যার মধ্যে Logarithmic এবং Time Scales অন্যতম। এই স্কেলগুলো আপনাকে ডেটা ভিজ্যুয়ালাইজেশনের ক্ষেত্রে আরও কার্যকরী এবং উপকারী ফলাফল দিতে সহায়তা করে। নিচে এই দুটি স্কেল এবং তাদের ব্যবহারের পদ্ধতি বিস্তারিতভাবে আলোচনা করা হলো।

1. Logarithmic Scale

Logarithmic Scale ব্যবহার করা হয় যখন ডেটা খুব বেশি ভ্যারিয়েশন থাকে এবং আপনি চান যে চার্টের স্কেলকে লিনিয়ার নয়, বরং লগারিদমিকভাবে দেখানো হোক। এটি সাধারণত বিজ্ঞান, অর্থনীতি, বা অন্যান্য ক্ষেত্রে ব্যবহৃত হয় যেখানে ডেটার বড় পার্থক্য থাকে এবং আপনি সেগুলির তুলনা করতে চান।

Logarithmic Scale সাধারণত Y-axis এ ব্যবহৃত হয়, তবে এটি X-axis-এও ব্যবহার করা যেতে পারে।

উদাহরণ: Logarithmic Scale ব্যবহার করে চার্ট তৈরি

const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
    type: 'line', // লাইন চার্ট
    data: {
        labels: [1, 10, 100, 1000, 10000], // X-axis লেবেল
        datasets: [{
            label: 'Logarithmic Data',
            data: [0.1, 1, 10, 100, 1000], // Y-axis ডেটা
            borderColor: 'rgba(75, 192, 192, 1)',
            fill: false
        }]
    },
    options: {
        responsive: true,
        scales: {
            y: {
                type: 'logarithmic', // Y-axis কে লগারিদমিক স্কেলে সেট করা
                ticks: {
                    callback: function(value) {
                        return value; // Y-axis এর ticks কাস্টমাইজ করা
                    }
                }
            },
            x: {
                type: 'linear', // X-axis লিনিয়ার থাকবে
            }
        }
    }
});

কাস্টমাইজেশন:

• type: 'logarithmic': Y-axis কে লগারিদমিক স্কেলে সেট করা।
• ticks: এখানে টিকসের জন্য কাস্টম ফাংশন ব্যবহার করা হয়েছে যাতে আপনি যেভাবে চান টিকগুলো প্রদর্শন করতে পারেন।
• X-axis: সাধারণত লিনিয়ার স্কেল ব্যবহার করা হয়, তবে আপনি X-axis-এও লগারিদমিক স্কেল ব্যবহার করতে পারেন যদি প্রয়োজন হয়।

2. Time Scale

Time Scale ব্যবহার করা হয় যখন আপনার ডেটা টাইমস্ট্যাম্পের উপর ভিত্তি করে থাকে। এর মাধ্যমে আপনি টাইম-বেজড ডেটাকে সহজেই ভিজ্যুয়ালাইজ করতে পারবেন, যেমন দিন, মাস, বছর বা ঘণ্টা ভিত্তিক ডেটা।

Chart.js Time Scale ব্যবহারের জন্য moment.js বা luxon.js লাইব্রেরি ব্যবহার করতে পারে। তবে, Chart.js 3 থেকে moment.js ব্যবহার বন্ধ করা হয়েছে এবং এখন Day.js ব্যবহৃত হচ্ছে টাইম ডেটা প্রসেস করার জন্য।

উদাহরণ: Time Scale ব্যবহার করে চার্ট তৈরি

const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
    type: 'line', // লাইন চার্ট
    data: {
        datasets: [{
            label: 'Monthly Sales',
            data: [
                { x: '2023-01-01', y: 10 },
                { x: '2023-02-01', y: 20 },
                { x: '2023-03-01', y: 30 },
                { x: '2023-04-01', y: 40 },
                { x: '2023-05-01', y: 50 }
            ],
            borderColor: 'rgba(75, 192, 192, 1)',
            fill: false
        }]
    },
    options: {
        responsive: true,
        scales: {
            x: {
                type: 'time', // X-axis টাইম স্কেলে সেট করা
                time: {
                    unit: 'month', // মাস ভিত্তিক টাইম ইউনিট
                    tooltipFormat: 'll', // টুলটিপ ফরম্যাট
                    displayFormats: {
                        month: 'MMM YYYY', // মাসের ফরম্যাট
                    }
                },
                title: {
                    display: true,
                    text: 'Date'
                }
            },
            y: {
                title: {
                    display: true,
                    text: 'Sales'
                }
            }
        }
    }
});

কাস্টমাইজেশন:

• type: 'time': X-axis টাইম স্কেলে সেট করা হয়েছে।
• unit: 'month': টাইম ইউনিট মাস হিসেবে নির্ধারণ করা হয়েছে (দিন, মাস, বছর ইত্যাদি হতে পারে)।
• tooltipFormat: টুলটিপের জন্য ফরম্যাট সেট করা।
• displayFormats: ট্যাগে ডিসপ্লে ফরম্যাট কাস্টমাইজ করা হয়েছে (যেমন, মাসের নাম ও বছর)।

3. Logarithmic এবং Time Scale একত্রে ব্যবহার

আপনি যদি একটি চার্টে একই সাথে logarithmic এবং time scale ব্যবহার করতে চান, তবে তা একে অপরের সাথে কাস্টমাইজ করে দেখানো যেতে পারে। উদাহরণস্বরূপ, সময়ের সাথে বিক্রয়ের লগারিদমিক বৃদ্ধির গ্রাফ:

উদাহরণ: Logarithmic এবং Time Scale একত্রে ব্যবহার

const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
    type: 'line',
    data: {
        datasets: [{
            label: 'Sales Over Time (Logarithmic)',
            data: [
                { x: '2023-01-01', y: 10 },
                { x: '2023-02-01', y: 100 },
                { x: '2023-03-01', y: 1000 },
                { x: '2023-04-01', y: 10000 }
            ],
            borderColor: 'rgba(75, 192, 192, 1)',
            fill: false
        }]
    },
    options: {
        responsive: true,
        scales: {
            x: {
                type: 'time',
                time: {
                    unit: 'month',
                    tooltipFormat: 'll',
                    displayFormats: {
                        month: 'MMM YYYY',
                    }
                },
                title: {
                    display: true,
                    text: 'Date'
                }
            },
            y: {
                type: 'logarithmic', // Y-axis কে লগারিদমিক স্কেলে সেট করা
                title: {
                    display: true,
                    text: 'Sales'
                }
            }
        }
    }
});

এখানে, X-axis টাইম স্কেলে এবং Y-axis লগারিদমিক স্কেলে রয়েছে।

সারাংশ

• Logarithmic Scale ব্যবহার করে আপনি বিশাল পরিসরের ডেটা তুলনা করতে পারেন যেখানে ছোট মানগুলি খুব গুরুত্বপূর্ণ হয়ে ওঠে। এটি ডেটার পার্থক্যকে ছোট এবং বড় পরিসরে উপস্থাপন করতে সাহায্য করে।
• Time Scale ব্যবহারের মাধ্যমে আপনি সময়ভিত্তিক ডেটা, যেমন দিন, মাস, বা বছর ভিত্তিক ডেটা প্রদর্শন করতে পারেন।
• এই স্কেলগুলো Chart.js-এ অত্যন্ত শক্তিশালী টুল যা ডেটা ভিজ্যুয়ালাইজেশনের ক্ষেত্রে আরও কার্যকরী এবং সঠিক তথ্য প্রদান করতে সাহায্য করে।