এরিয়া চার্ট তৈরির বিল্ডার। আরও বিস্তারিত জানতে গুগল চার্টস ডকুমেন্টেশন দেখুন।
এখানে একটি উদাহরণ দেওয়া হলো যা দেখায় কীভাবে একটি এরিয়া চার্ট তৈরি করতে হয়।
// Create a data table with some sample data. const sampleData = Charts.newDataTable() .addColumn(Charts.ColumnType.STRING, 'Month') .addColumn(Charts.ColumnType.NUMBER, 'Dining') .addColumn(Charts.ColumnType.NUMBER, 'Total') .addRow(['Jan', 60, 520]) .addRow(['Feb', 50, 430]) .addRow(['Mar', 53, 440]) .addRow(['Apr', 70, 410]) .addRow(['May', 80, 390]) .addRow(['Jun', 60, 500]) .addRow(['Jul', 100, 450]) .addRow(['Aug', 140, 431]) .addRow(['Sep', 75, 488]) .addRow(['Oct', 70, 521]) .addRow(['Nov', 58, 388]) .addRow(['Dec', 63, 400]) .build(); const chart = Charts.newAreaChart() .setTitle('Yearly Spending') .setXAxisTitle('Month') .setYAxisTitle('Spending (USD)') .setDimensions(600, 500) .setStacked() .setColors(['red', 'green']) .setDataTable(sampleData) .build();
পদ্ধতি
| পদ্ধতি | রিটার্ন টাইপ | সংক্ষিপ্ত বিবরণ |
|---|---|---|
build() | Chart | চার্টটি তৈরি করে। |
reverse Categories() | Area Chart Builder | ডোমেইন অক্ষে সিরিজের অঙ্কনকে বিপরীত করে। |
set Background Color(cssValue) | Area Chart Builder | চার্টের পটভূমির রঙ নির্ধারণ করে। |
set Colors(cssValues) | Area Chart Builder | চার্টের লাইনগুলোর রং নির্ধারণ করে। |
set Data Source Url(url) | Area Chart Builder | ডেটা সোর্স ইউআরএল সেট করে, যা গুগল শিটস-এর মতো কোনো বাহ্যিক উৎস থেকে ডেটা আনার জন্য ব্যবহৃত হয়। |
set Data Table(tableBuilder) | Area Chart Builder | DataTableBuilder ব্যবহার করে চার্টের জন্য ব্যবহৃত ডেটা টেবিলটি নির্ধারণ করা হয়। |
set Data Table(table) | Area Chart Builder | ডেটা টেবিলটি সেট করে, যেটিতে চার্টের লাইন এবং এক্স-অক্ষের লেবেলগুলো থাকে। |
set Data View Definition(dataViewDefinition) | Area Chart Builder | চার্টের জন্য ব্যবহৃত ডেটা ভিউ ডেফিনিশন নির্ধারণ করে। |
set Dimensions(width, height) | Area Chart Builder | চার্টের মাত্রা নির্ধারণ করে। |
set Legend Position(position) | Area Chart Builder | চার্টের সাপেক্ষে লেজেন্ডের অবস্থান নির্ধারণ করে। |
set Legend Text Style(textStyle) | Area Chart Builder | চার্ট লেজেন্ডের টেক্সট স্টাইল নির্ধারণ করে। |
set Option(option, value) | Area Chart Builder | এই চার্টের জন্য উন্নত বিকল্পসমূহ সেট করে। |
set Point Style(style) | Area Chart Builder | লাইনের বিন্দুগুলোর শৈলী নির্ধারণ করে। |
set Range(start, end) | Area Chart Builder | চার্টের জন্য পরিসর নির্ধারণ করে। |
set Stacked() | Area Chart Builder | স্ট্যাকড লাইন ব্যবহার করা হয়, যার অর্থ হলো লাইন এবং বারের মানগুলো স্তূপীকৃত (জমা) হয়। |
set Title(chartTitle) | Area Chart Builder | চার্টের শিরোনাম নির্ধারণ করে। |
set Title Text Style(textStyle) | Area Chart Builder | চার্টের শিরোনামের টেক্সট স্টাইল নির্ধারণ করে। |
set XAxis Text Style(textStyle) | Area Chart Builder | অনুভূমিক অক্ষের টেক্সট স্টাইল নির্ধারণ করে। |
set XAxis Title(title) | Area Chart Builder | অনুভূমিক অক্ষে একটি শিরোনাম যোগ করে। |
set XAxis Title Text Style(textStyle) | Area Chart Builder | অনুভূমিক অক্ষের শিরোনাম লেখার শৈলী নির্ধারণ করে। |
set YAxis Text Style(textStyle) | Area Chart Builder | উল্লম্ব অক্ষের টেক্সট স্টাইল নির্ধারণ করে। |
set YAxis Title(title) | Area Chart Builder | উল্লম্ব অক্ষে একটি শিরোনাম যোগ করে। |
set YAxis Title Text Style(textStyle) | Area Chart Builder | উল্লম্ব অক্ষের শিরোনাম লেখার শৈলী নির্ধারণ করে। |
use Log Scale() | Area Chart Builder | রেঞ্জ অক্ষকে লগারিদমিক স্কেলে পরিণত করে (এর জন্য সমস্ত মান ধনাত্মক হতে হবে)। |
বিস্তারিত ডকুমেন্টেশন
build()
চার্টটি তৈরি করে।
ফেরত
Chart — একটি চার্ট অবজেক্ট, যা ডকুমেন্ট বা UI এলিমেন্টে এমবেড করা যায়, অথবা একটি স্থির চিত্র হিসেবে ব্যবহার করা যায়।
reverseCategories()
ডোমেইন অক্ষে সিরিজ আঁকার পদ্ধতিকে উল্টে দেয়। উল্লম্ব-পরিসরের চার্টের (যেমন লাইন, এরিয়া বা কলাম চার্ট) ক্ষেত্রে, এর মানে হলো অনুভূমিক অক্ষটি ডান থেকে বামে আঁকা হয়। অনুভূমিক-পরিসরের চার্টের (যেমন বার চার্ট) ক্ষেত্রে, এর মানে হলো উল্লম্ব অক্ষটি উপর থেকে নিচে আঁকা হয়। পাই চার্টের ক্ষেত্রে, এর মানে হলো স্লাইসগুলো ঘড়ির কাঁটার বিপরীত দিকে আঁকা হয়।
// Creates a pie chart builder and sets drawing of the slices in a // counter-clockwise manner. const builder = Charts.newPieChart(); builder.reverseCategories();
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setBackgroundColor(cssValue)
চার্টের পটভূমির রঙ নির্ধারণ করে।
// Creates a line chart builder and sets the background color to gray const builder = Charts.newLineChart(); builder.setBackgroundColor('gray');
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
css Value | String | রঙের জন্য CSS মান (যেমন "blue" বা "#00f" )। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setColors(cssValues)
চার্টের লাইনগুলোর রং নির্ধারণ করে।
// Creates a line chart builder and sets the first two lines to be drawn in // green and red, respectively. const builder = Charts.newLineChart(); builder.setColors(['green', 'red']);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
css Values | String[] | রঙের CSS ভ্যালুগুলোর একটি অ্যারে, যেমন ["red", "#acf"] । অ্যারের n-তম উপাদানটি চার্টের n-তম লাইনের রঙ নির্দেশ করে। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setDataSourceUrl(url)
গুগল শিটসের মতো কোনো বাহ্যিক উৎস থেকে ডেটা আনার জন্য ব্যবহৃত ডেটা সোর্স ইউআরএল সেট করে। যদি একটি ডেটা সোর্স ইউআরএল এবং একটি ডেটাটেবিল উভয়ই প্রদান করা হয়, তবে ডেটা সোর্স ইউআরএলটি উপেক্ষা করা হয়।
ডেটা সোর্স কোয়েরি করার বিষয়ে আরও তথ্যের জন্য, গুগল চার্টস ডকুমেন্টেশন দেখুন।
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
url | String | যেকোনো কোয়েরি প্যারামিটার সহ ডেটা সোর্স ইউআরএল। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setDataTable(tableBuilder)
DataTableBuilder ব্যবহার করে চার্টের জন্য ব্যবহৃত ডেটা টেবিলটি সেট করে। এটি build() কল না করেই ডেটা টেবিল সেট করার একটি সুবিধাজনক পদ্ধতি।
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
table Builder | Data Table Builder | একটি ডেটা টেবিল বিল্ডার। এই কলের অংশ হিসেবে তাৎক্ষণিকভাবে একটি নতুন ডেটা টেবিল তৈরি হয়ে যায়, তাই বিল্ডারে করা পরবর্তী কোনো আপডেট চার্টে প্রতিফলিত হবে না। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setDataTable(table)
চার্টের লাইন এবং এক্স-অক্ষের লেবেল ধারণকারী ডেটা টেবিলটি সেট করে। প্রথম কলামটি একটি স্ট্রিং হবে এবং এতে অনুভূমিক অক্ষের লেবেল থাকবে। এর পরে যেকোনো সংখ্যক কলাম থাকতে পারে, তবে সবগুলো অবশ্যই সংখ্যাসূচক হতে হবে। প্রতিটি কলাম একটি পৃথক লাইন হিসাবে প্রদর্শিত হয়।
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
table | Data Table Source | চার্টের জন্য ব্যবহৃত ডেটা টেবিল। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setDataViewDefinition(dataViewDefinition)
চার্টের জন্য ব্যবহৃত ডেটা ভিউ ডেফিনিশন নির্ধারণ করে।
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
data View Definition | Data View Definition | একটি ডেটা ভিউ ডেফিনিশন অবজেক্ট, যা চার্ট অঙ্কনের জন্য প্রদত্ত ডেটা সোর্স থেকে প্রাপ্ত ভিউটিকে সংজ্ঞায়িত করে। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setDimensions(width, height)
চার্টের মাত্রা নির্ধারণ করে।
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
width | Integer | চার্টটির প্রস্থ, পিক্সেলে। |
height | Integer | চার্টটির উচ্চতা, পিক্সেলে। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setLegendPosition(position)
চার্টের সাপেক্ষে লেজেন্ডের অবস্থান নির্ধারণ করে। ডিফল্টরূপে, কোনো লেজেন্ড থাকে না।
// Creates a line chart builder and sets the legend position to right. const builder = Charts.newLineChart(); builder.setLegendPosition(Charts.Position.RIGHT);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
position | Position | কিংবদন্তির অবস্থান। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setLegendTextStyle(textStyle)
চার্ট লেজেন্ডের টেক্সট স্টাইল নির্ধারণ করে।
// Creates a line chart builder and sets it up for a blue, 26-point legend. const textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26); const style = textStyleBuilder.build(); const builder = Charts.newLineChart(); builder.setLegendTextStyle(style);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
text Style | Text Style | চার্ট লেজেন্ডের জন্য ব্যবহৃত টেক্সট স্টাইল। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setOption(option, value)
এই চার্টের জন্য উন্নত বিকল্পসমূহ নির্ধারণ করে। এই চার্টের জন্য উপলব্ধ বিকল্পগুলি দেখুন। প্রদত্ত বিকল্পটি অবৈধ হলে এই পদ্ধতির কোনো প্রভাব থাকবে না।
// Build an area chart with a 1-second animation duration. const builder = Charts.newAreaChart(); builder.setOption('animation.duration', 1000); const chart = builder.build();
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
option | String | সেট করার বিকল্প। |
value | Object | যে মানটি নির্ধারণ করতে হবে। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setPointStyle(style)
লাইনের পয়েন্টগুলোর স্টাইল নির্ধারণ করে। ডিফল্টরূপে, পয়েন্টগুলোর কোনো নির্দিষ্ট স্টাইল থাকে না এবং শুধুমাত্র লাইনটিই দৃশ্যমান থাকে।
// Creates a line chart builder and sets large point style. const builder = Charts.newLineChart(); builder.setPointStyle(Charts.PointStyle.LARGE);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
style | Point Style | লাইনের বিন্দুগুলোর জন্য ব্যবহারযোগ্য স্টাইল। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
আরও দেখুন
setRange(start, end)
চার্টের জন্য পরিসর নির্ধারণ করে।
যদি কোনো ডেটা পয়েন্ট পরিসরের বাইরে চলে যায়, তাহলে সেই ডেটা পয়েন্টগুলোকে অন্তর্ভুক্ত করার জন্য পরিসরটি প্রসারিত করা হয়।
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
start | Number | পরিসর অক্ষের সর্বনিম্ন গ্রিড লাইনের মান। |
end | Number | পরিসীমা অক্ষের সর্বোচ্চ গ্রিড লাইনের মান। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setStacked()
স্ট্যাকড লাইন ব্যবহার করে, যার অর্থ হলো লাইন এবং বারের মানগুলো স্ট্যাক (জমা) করা হয়। ডিফল্টরূপে, কোনো স্ট্যাকিং হয় না।
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setTitle(chartTitle)
চার্টের শিরোনাম নির্ধারণ করে। শিরোনামটি চার্টের উপরে মাঝখানে প্রদর্শিত হয়।
// Creates a line chart builder and title to 'My Line Chart'. const builder = Charts.newLineChart(); builder.setTitle('My Line Chart');
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
chart Title | String | চার্টের শিরোনাম। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setTitleTextStyle(textStyle)
চার্টের শিরোনামের টেক্সট স্টাইল নির্ধারণ করে।
// Creates a line chart builder and sets it up for a blue, 26-point title. const textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26); const style = textStyleBuilder.build(); const builder = Charts.newLineChart(); builder.setTitleTextStyle(style);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
text Style | Text Style | চার্টের শিরোনামের জন্য ব্যবহৃত টেক্সট স্টাইল। আপনি Charts.newTextStyle() কল করে একটি Text Style Builder অবজেক্ট তৈরি করতে পারেন। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setXAxisTextStyle(textStyle)
অনুভূমিক অক্ষের টেক্সট স্টাইল নির্ধারণ করে।
// Creates a line chart builder and sets the X-axis text style to blue, 18-point // font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setXAxisTextStyle(textStyle);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
text Style | Text Style | অনুভূমিক অক্ষের শিরোনামের জন্য ব্যবহৃত টেক্সট স্টাইল। আপনি Charts.newTextStyle() কল করে একটি Text Style Builder অবজেক্ট তৈরি করতে পারেন। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setXAxisTitle(title)
অনুভূমিক অক্ষে একটি শিরোনাম যোগ করে। শিরোনামটি কেন্দ্রে থাকে এবং অক্ষের মান লেবেলগুলির নীচে প্রদর্শিত হয়।
// Creates a line chart builder and sets the X-axis title. const builder = Charts.newLineChart(); builder.setTitle('X-axis Title');
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
title | String | এক্স-অক্ষের শিরোনাম। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setXAxisTitleTextStyle(textStyle)
অনুভূমিক অক্ষের শিরোনাম লেখার শৈলী নির্ধারণ করে।
// Creates a line chart builder and sets the X-axis title text style to blue, // 18-point font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setXAxisTitleTextStyle(textStyle);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
text Style | Text Style | অনুভূমিক অক্ষের শিরোনামের জন্য ব্যবহৃত টেক্সট স্টাইল। আপনি Charts.newTextStyle() কল করে একটি Text Style Builder অবজেক্ট তৈরি করতে পারেন। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setYAxisTextStyle(textStyle)
উল্লম্ব অক্ষের টেক্সট স্টাইল নির্ধারণ করে।
// Creates a line chart builder and sets the Y-axis text style to blue, 18-point // font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setYAxisTextStyle(textStyle);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
text Style | Text Style | অনুভূমিক অক্ষের শিরোনামের জন্য ব্যবহৃত টেক্সট স্টাইল। আপনি Charts.newTextStyle() কল করে একটি Text Style Builder অবজেক্ট তৈরি করতে পারেন। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setYAxisTitle(title)
উল্লম্ব অক্ষে একটি শিরোনাম যোগ করে। শিরোনামটি কেন্দ্রে থাকে এবং মান লেবেলগুলির বাম দিকে প্রদর্শিত হয়।
// Creates a line chart builder and sets the Y-axis title. const builder = Charts.newLineChart(); builder.setYAxisTitle('Y-axis Title');
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
title | String | Y-অক্ষের শিরোনাম। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
setYAxisTitleTextStyle(textStyle)
উল্লম্ব অক্ষের শিরোনাম লেখার শৈলী নির্ধারণ করে।
// Creates a line chart builder and sets the Y-axis title text style to blue, // 18-point font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setYAxisTitleTextStyle(textStyle);
প্যারামিটার
| নাম | প্রকার | বর্ণনা |
|---|---|---|
text Style | Text Style | অনুভূমিক অক্ষের শিরোনামের জন্য ব্যবহৃত টেক্সট স্টাইল। আপনি Charts.newTextStyle() কল করে একটি Text Style Builder অবজেক্ট তৈরি করতে পারেন। |
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।
useLogScale()
রেঞ্জ অক্ষকে লগারিদমিক স্কেলে পরিণত করে (এর জন্য সমস্ত মান ধনাত্মক হতে হয়)। উল্লম্ব চার্টের (যেমন লাইন, এরিয়া বা কলাম) জন্য রেঞ্জ অক্ষ হলো উল্লম্ব অক্ষ এবং অনুভূমিক চার্টের (যেমন বার) জন্য এটি হলো অনুভূমিক অক্ষ।
ফেরত
AreaChartBuilder — এই বিল্ডারটি চেইনিংয়ের জন্য উপযোগী।