Highcharts চার্ট Export করার নিয়ম (PDF, PNG, JPEG)

Highcharts এর এক্সপোর্ট এবং প্রিন্টিং অপশন - জিডব্লিউটি হাই চার্ট (GWT High Charts) - Web Development

1.1k

Highcharts এর Exporting মডিউল ব্যবহার করে আপনি আপনার চার্টগুলিকে সহজেই বিভিন্ন ফর্ম্যাটে এক্সপোর্ট করতে পারেন, যেমন PDF, PNG, JPEG ইত্যাদি। GWT (Google Web Toolkit) ব্যবহার করে আপনি Highcharts এর Exporting ফিচার ইন্টিগ্রেট করতে পারবেন এবং ডেটা ভিজুয়ালাইজেশনকে আরো ইন্টারঅ্যাকটিভ এবং ব্যবহারকারী-বান্ধব করে তুলতে পারবেন।

এখানে Highcharts চার্টের Exporting ফিচার কিভাবে ব্যবহার করতে হয় তা বিস্তারিতভাবে আলোচনা করা হলো।


১. Highcharts Exporting মডিউল সক্রিয় করা

Highcharts এ Exporting ফিচার ব্যবহার করার জন্য আপনাকে exporting অপশনকে সক্রিয় করতে হবে। এটি দিয়ে আপনি চার্টের উপরে এক্সপোর্ট বাটন যোগ করতে পারবেন, যা ব্যবহারকারীদের চার্টটি বিভিন্ন ফরম্যাটে ডাউনলোড করতে সহায়তা করবে।

Exporting সক্রিয় করার উদাহরণ:

Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    title: {
        text: 'Sales Data'
    },
    exporting: {
        enabled: true,  // Exporting ফিচার সক্রিয় করা
        buttons: {
            contextButton: {
                menuItems: ['downloadPNG', 'downloadJPEG', 'downloadPDF', 'downloadSVG']  // এক্সপোর্ট অপশনস
            }
        }
    },
    series: [{
        name: 'Sales',
        data: [1, 2, 3, 4, 5]
    }]
});

এখানে:

  • exporting.enabled: এক্সপোর্ট ফিচার সক্রিয় করা হয়েছে।
  • buttons.contextButton.menuItems: এক্সপোর্ট অপশন (PNG, JPEG, PDF, SVG) প্রদর্শন করা হয়েছে।

২. Highcharts Exporting কাস্টমাইজেশন

আপনি Exporting ফিচারটি কাস্টমাইজ করতে পারেন, যেমন এক্সপোর্ট বাটনের অবস্থান, সাইজ, স্টাইল, এবং ডাউনলোড ফরম্যাট। নিচে কিছু কাস্টমাইজেশন অপশন দেয়া হলো:

এক্সপোর্ট বাটনের কাস্টমাইজেশন:

Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    title: {
        text: 'Sales Data'
    },
    exporting: {
        enabled: true,  // Exporting ফিচার সক্রিয় করা
        buttons: {
            contextButton: {
                symbolSize: 40,  // এক্সপোর্ট বাটনের সাইজ
                x: -50,  // বাটনের অবস্থান (x-axis)
                y: 10,   // বাটনের অবস্থান (y-axis)
                style: {
                    color: '#FF5733',  // বাটনের টেক্সট রঙ
                    fontSize: '14px'
                }
            }
        }
    },
    series: [{
        name: 'Sales',
        data: [1, 2, 3, 4, 5]
    }]
});

এখানে:

  • symbolSize: এক্সপোর্ট বাটনের সাইজ কাস্টমাইজ করা হয়েছে।
  • x এবং y: বাটনের অবস্থান পরিবর্তন করা হয়েছে।
  • style: এক্সপোর্ট বাটনের টেক্সট রঙ এবং ফন্ট সাইজ কাস্টমাইজ করা হয়েছে।

৩. Highcharts Exporting এর মাধ্যমে PDF, PNG, JPEG এক্সপোর্ট

Highcharts Exporting ফিচার PDF, PNG, JPEG সহ আরও অনেক ফরম্যাটে এক্সপোর্ট করার সুবিধা দেয়। এর মাধ্যমে আপনি সহজেই চার্টের ছবি বা ডকুমেন্ট তৈরি করতে পারেন।

PDF এক্সপোর্ট:

Highcharts-এ PDF এক্সপোর্ট করতে নিম্নলিখিত কোড ব্যবহার করা যেতে পারে:

exporting: {
    enabled: true,  // Exporting সক্রিয় করা
    buttons: {
        contextButton: {
            menuItems: ['downloadPDF']  // PDF এক্সপোর্ট অপশন
        }
    }
}

PNG এবং JPEG এক্সপোর্ট:

exporting: {
    enabled: true,  // Exporting সক্রিয় করা
    buttons: {
        contextButton: {
            menuItems: ['downloadPNG', 'downloadJPEG']  // PNG এবং JPEG এক্সপোর্ট অপশন
        }
    }
}

৪. GWT কোডে Highcharts Exporting ফিচার ইন্টিগ্রেট করা

GWT ব্যবহার করে Highcharts এর Exporting ফিচার ইন্টিগ্রেট করা যায়, যাতে Java কোডের মাধ্যমে JavaScript লাইব্রেরি কন্ট্রোল করা সম্ভব হয়। নিচে একটি উদাহরণ দেয়া হলো যেখানে GWT কোডে Highcharts Exporting ফিচার কাস্টমাইজ করা হয়েছে।

GWT কোড উদাহরণ:

public native void createChartWithExporting(JavaScriptObject chartData) /*-{
    $wnd.Highcharts.chart('container', {
        chart: {
            type: 'line'
        },
        title: {
            text: 'Sales Data'
        },
        exporting: {
            enabled: true,
            buttons: {
                contextButton: {
                    menuItems: ['downloadPNG', 'downloadJPEG', 'downloadPDF']  // এক্সপোর্ট অপশন
                }
            }
        },
        series: [{
            name: 'Sales',
            data: chartData
        }]
    });
}-*/;

এখানে:

  • exporting.enabled: এক্সপোর্ট ফিচার সক্রিয় করা হয়েছে।
  • menuItems: এক্সপোর্ট অপশনগুলো (PNG, JPEG, PDF) সেট করা হয়েছে।

৫. Exporting-এর মধ্যে কাস্টম ফরম্যাট

Highcharts Exporting ফিচারে কাস্টম ফরম্যাটও যোগ করা সম্ভব। আপনি এক্সপোর্ট করা ছবির সাইজ, কোয়ালিটি, ফরম্যাট এবং অন্যান্য বৈশিষ্ট্য কাস্টমাইজ করতে পারেন।

Exporting কাস্টম ফরম্যাটের উদাহরণ:

exporting: {
    enabled: true,  // Exporting ফিচার সক্রিয় করা
    buttons: {
        contextButton: {
            menuItems: ['downloadPNG', 'downloadJPEG', 'downloadPDF'],
            exportOptions: {
                type: 'image/png',  // PNG ফরম্যাটে এক্সপোর্ট
                width: 800,         // চিত্রের প্রস্থ
                scale: 2            // স্কেল বাড়ানো
            }
        }
    }
}

এখানে:

  • type: এক্সপোর্ট ফরম্যাট নির্ধারণ করা হয়েছে (যেমন PNG)।
  • width এবং scale: এক্সপোর্ট ফাইলের সাইজ এবং স্কেল কাস্টমাইজ করা হয়েছে।

সারাংশ

Highcharts এর Exporting ফিচার আপনার চার্টের বিভিন্ন ফরম্যাটে এক্সপোর্ট করার সুযোগ দেয়, যেমন PDF, PNG, JPEG ইত্যাদি। GWT ব্যবহার করে আপনি সহজেই Highcharts Exporting ফিচার ইন্টিগ্রেট করতে পারেন এবং কাস্টমাইজ করতে পারেন। এতে ব্যবহারকারীরা তাদের প্রয়োজন অনুসারে চার্টের ছবি বা ডকুমেন্ট এক্সপোর্ট করতে সক্ষম হন।


Content added By
Promotion

Are you sure to start over?

Loading...