Highcharts একটি শক্তিশালী লাইব্রেরি যা ডেটা ভিজ্যুয়ালাইজেশন এবং চার্ট তৈরি করার জন্য ব্যবহৃত হয়। Highcharts বিভিন্ন ধরনের এক্সপোর্ট এবং প্রিন্টিং ফিচার প্রদান করে যা ব্যবহারকারীদের চার্টের ডেটা এক্সপোর্ট বা প্রিন্ট করার সুযোগ দেয়। আপনি PNG, JPEG, PDF, SVG ফরম্যাটে চার্ট এক্সপোর্ট করতে পারেন, এবং প্রিন্ট অপশন ব্যবহার করে সরাসরি চার্ট প্রিন্ট করতে পারেন।
এই টিউটোরিয়ালে আমরা দেখব কিভাবে Highcharts এ এক্সপোর্ট এবং প্রিন্টিং ফিচার ইন্টিগ্রেট করা যায়।
Highcharts এর এক্সপোর্ট ফিচারটি ব্যবহার করার জন্য আপনাকে highcharts-exporting মডিউল ইনস্টল করতে হবে। এই মডিউলটি Highcharts এর এক্সপোর্ট ফিচার সক্রিয় করে।
npm install highcharts-exporting --save
import * as Highcharts from 'highcharts';
import Exporting from 'highcharts/modules/exporting'; // Exporting মডিউল ইমপোর্ট করা
Exporting(Highcharts); // Exporting ফিচার সক্রিয় করা
এখন, Highcharts এর চার্ট কনফিগারেশনে এক্সপোর্ট এবং প্রিন্টিং অপশন যোগ করা হবে।
import { Component, OnInit } from '@angular/core';
import * as Highcharts from 'highcharts';
import Exporting from 'highcharts/modules/exporting';
Exporting(Highcharts);
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
Highcharts = Highcharts; // Highcharts ব্যবহার করার জন্য
chartOptions: any; // চার্টের অপশন স্টোর করার জন্য
ngOnInit() {
// Highcharts কনফিগারেশন সেটআপ করা
this.chartOptions = {
chart: {
type: 'column'
},
title: {
text: 'ডেটা এক্সপোর্ট এবং প্রিন্টিং ফিচার'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May']
},
yAxis: {
title: {
text: 'মান'
}
},
series: [{
name: 'বিক্রয়',
data: [10, 20, 30, 40, 50]
}],
exporting: {
enabled: true, // এক্সপোর্ট অপশন সক্রিয় করা
buttons: {
contextButton: {
menuItems: ['downloadPNG', 'downloadJPEG', 'downloadPDF', 'downloadSVG', 'separator', 'printChart']
}
}
}
};
}
}
এখন, app.component.html ফাইলে Highcharts কম্পোনেন্ট যোগ করুন যাতে ব্যবহারকারীরা এক্সপোর্ট এবং প্রিন্ট অপশন ব্যবহার করতে পারেন।
<div style="height: 400px;">
<highcharts-chart
[Highcharts]="Highcharts"
[options]="chartOptions"
style="width: 100%; height: 100%; display: block;">
</highcharts-chart>
</div>
highcharts/modules/exporting
মডিউলটি Highcharts এর এক্সপোর্ট ফিচার সক্রিয় করে। এতে আপনি PNG, JPEG, PDF, SVG ফরম্যাটে চার্ট ডাউনলোড করতে পারবেন।downloadPNG
, downloadJPEG
, downloadPDF
, downloadSVG
, separator
, printChart
) কনফিগার করা হয়েছে। এটি ইউজারকে বিভিন্ন ফরম্যাটে ডেটা এক্সপোর্ট বা প্রিন্ট করার অপশন দেয়।printChart
অপশনটি চার্ট প্রিন্ট করার জন্য ব্যবহার করা হয়। ইউজার ক্লিক করলে ব্রাউজার প্রিন্ট ডায়ালগ উইন্ডো খুলে যাবে এবং তারা সরাসরি চার্ট প্রিন্ট করতে পারবে।Highcharts এর এক্সপোর্টিং এবং প্রিন্টিং ফিচার ইন্টিগ্রেট করার মাধ্যমে আপনি আপনার চার্টে ডেটা এক্সপোর্ট এবং প্রিন্ট করার সুবিধা দিতে পারবেন। ব্যবহারকারী চাইলে চার্টের ডেটা PNG, JPEG, PDF, SVG ফরম্যাটে এক্সপোর্ট করতে পারে বা সরাসরি প্রিন্ট করতে পারে। Highcharts এর এই ফিচারটি ডেটা রিপোর্টিং এবং ভিজ্যুয়ালাইজেশন আরও কার্যকর এবং ইন্টারঅ্যাকটিভ করে তোলে।
Read more