Series Data এবং Customization Options গাইড ও নোট

Highcharts এ Series Data এবং এর Customization Options খুবই গুরুত্বপূর্ণ, কারণ এগুলির মাধ্যমে আপনি আপনার ডেটা কিভাবে প্রদর্শন করবেন এবং বিভিন্ন সিরিজের মধ্যে কিভাবে পার্থক্য করবেন, তা নির্ধারণ করতে পারেন। এই পর্বে, আমরা Highcharts এ সিরিজ ডেটা সেট করা এবং তা কাস্টমাইজ করার বিভিন্ন অপশন সম্পর্কে জানব।

Series Data কী?

Series Data হলো Highcharts চার্টের মূল ডেটা, যা গ্রাফ বা চার্টে প্রদর্শিত হয়। প্রতিটি series একটি নির্দিষ্ট ডেটা পয়েন্ট ধারণ করে এবং এটি বিভিন্ন ধরনের ডেটা প্রদর্শন করতে পারে, যেমন: লাইনের পয়েন্ট, বারের উচ্চতা, পাই চার্টের অংশ ইত্যাদি।

Highcharts এ, series সাধারণত একটি অ্যারে (array) আকারে ডেটা গ্রহণ করে, এবং এতে এক বা একাধিক ডেটা সিরিজ থাকতে পারে। প্রতিটি সিরিজে, আপনি ডেটা পয়েন্ট এবং অন্যান্য কনফিগারেশন যেমন সিরিজের নাম, টাইপ, এবং শৈলী কাস্টমাইজ করতে পারেন।

Series Data Format

series: [{
    name: 'Sales',
    data: [100, 200, 300, 400, 500]
}]

এখানে, Sales সিরিজের data অ্যারে ৫টি পয়েন্ট ধারণ করছে, যা X-Axis এর সাথে সম্পর্কিত।

Series Customization Options

Highcharts এ Series Data কাস্টমাইজ করার জন্য বেশ কিছু অপশন রয়েছে, যা সিরিজের আচরণ এবং প্রদর্শন কাস্টমাইজ করতে সাহায্য করে। এখানে কিছু সাধারণ সিরিজ কাস্টমাইজেশন অপশন আলোচনা করা হল:

1. name (নাম)

প্রতিটি সিরিজের একটি name থাকে, যা চার্টে সিরিজটির ট্যাগ বা লেবেল হিসেবে প্রদর্শিত হয়। এটি legend এ সিরিজটির নাম হিসেবে ব্যবহার করা হয়।

series: [{
    name: 'Monthly Sales',
    data: [150, 200, 250, 300]
}]

2. type (টাইপ)

Highcharts এ সিরিজের type সেট করে আপনি চার্টের ধরন নির্ধারণ করতে পারেন, যেমন line, column, bar, pie, ইত্যাদি।

series: [{
    type: 'column',  // কলাম চার্ট
    data: [10, 15, 20, 25]
}]

3. color (রঙ)

আপনি প্রতিটি সিরিজের জন্য একটি নির্দিষ্ট color সেট করতে পারেন। এটি সিরিজের ডেটা পয়েন্টগুলির রঙ পরিবর্তন করতে ব্যবহৃত হয়।

series: [{
    name: 'Sales',
    color: '#FF5733',  // সিরিজের জন্য নির্দিষ্ট রঙ
    data: [50, 60, 70, 80]
}]

4. lineWidth (লাইন প্রস্থ)

যদি আপনার সিরিজটি line টাইপের হয়, তবে আপনি লাইনটির প্রস্থ lineWidth দিয়ে কাস্টমাইজ করতে পারেন।

series: [{
    type: 'line',
    lineWidth: 4,  // লাইনটির প্রস্থ
    data: [10, 20, 30, 40]
}]

5. dashStyle (ড্যাশ স্টাইল)

dashStyle অপশন ব্যবহার করে আপনি লাইনটির শৈলী নির্ধারণ করতে পারেন, যেমন solid, shortdash, dot ইত্যাদি।

series: [{
    type: 'line',
    dashStyle: 'shortdash',  // ড্যাশ স্টাইল
    data: [30, 40, 50, 60]
}]

6. marker (মার্কার)

marker ব্যবহার করে আপনি সিরিজের পয়েন্টে মার্কার যোগ করতে পারেন। এটি ডেটা পয়েন্টগুলির চারপাশে স্হানীয় চিহ্ন যোগ করে, যা ব্যবহারকারীদের জন্য পয়েন্ট শনাক্ত করতে সহায়ক।

series: [{
    type: 'line',
    marker: {
        enabled: true,  // মার্কার সক্রিয় করা
        radius: 6  // মার্কারের আকার
    },
    data: [15, 25, 35, 45]
}]

7. stacking (স্ট্যাকিং)

যদি আপনি একটি stacked column বা stacked bar চার্ট তৈরি করতে চান, তবে stacking অপশন ব্যবহার করা হয়, যা সিরিজের মানগুলোকে একত্রে স্ট্যাক করে।

plotOptions: {
    column: {
        stacking: 'normal'  // স্ট্যাকড কলাম
    }
},
series: [{
    name: 'Product A',
    data: [5, 10, 15, 20]
}, {
    name: 'Product B',
    data: [10, 15, 20, 25]
}]

8. dataLabels (ডেটা লেবেল)

dataLabels ব্যবহার করে আপনি চার্টের প্রতিটি ডেটা পয়েন্টের ওপর মান প্রদর্শন করতে পারেন, যা গ্রাফের আরও বিস্তারিত তথ্য প্রদান করে।

series: [{
    name: 'Revenue',
    data: [100, 200, 300, 400],
    dataLabels: {
        enabled: true,  // ডেটা লেবেল সক্রিয় করা
        format: '{y}'  // ডেটা পয়েন্টের মান প্রদর্শন
    }
}]

9. pointPlacement (পয়েন্ট প্লেসমেন্ট)

pointPlacement ব্যবহার করে আপনি সিরিজের পয়েন্টগুলির অবস্থান কাস্টমাইজ করতে পারেন, যেমন on, between, ইত্যাদি। এটি বিশেষত column বা bar চার্টে উপকারী।

series: [{
    type: 'column',
    pointPlacement: 'between',  // পয়েন্টের অবস্থান
    data: [30, 50, 70, 90]
}]

উপসংহার

Highcharts এর Series Data এবং Customization Options দিয়ে আপনি আপনার চার্টের প্রতিটি সিরিজকে কাস্টমাইজ করতে পারবেন। সিরিজের ডেটার ধরন, রঙ, স্টাইল, এবং অন্যান্য বৈশিষ্ট্য কাস্টমাইজ করে আপনি আপনার চার্টকে আরও আরও ইন্টারঅ্যাকটিভ এবং visually appealing করতে পারেন। Highcharts এর এই ক্ষমতাগুলি ব্যবহার করে আপনি আপনার ডেটার ভিজুয়ালাইজেশনকে আরও কার্যকরী এবং তথ্যপূর্ণ করতে পারবেন।