চার্ট দিয়ে শুরু করা

এই পৃষ্ঠাটি চার্ট তৈরি করতে চার্ট API ব্যবহার করার মূল বিষয়গুলি বর্ণনা করে৷

গুগল চার্ট ব্যবহারের নীতি

আপনি Google Chart API-এ প্রতিদিন কতগুলি কল করতে পারেন তার কোনও সীমা নেই৷ যাইহোক, আমরা অপমানজনক বলে মনে করি এমন যেকোনো ব্যবহারকে ব্লক করার অধিকার আমরা সংরক্ষণ করি।

ওভারভিউ

এই ডকুমেন্টেশনে চার্ট দেখা

এই ডকুমেন্টেশনের সমস্ত চার্ট ইমেজ চার্ট API ব্যবহার করে লাইভ তৈরি করা হয়েছে। যেকোনো ছবির URL দেখতে, নিম্নলিখিতগুলি করুন:

  • আপনি যদি ফায়ারফক্স ব্যবহার করেন, ডান-ক্লিক করুন এবং তারপরে "চিত্র দেখুন" বা "বৈশিষ্ট্য" নির্বাচন করুন।
  • আপনি যদি ইন্টারনেট এক্সপ্লোরার ব্যবহার করেন তবে ডান-ক্লিক করুন এবং তারপরে "বৈশিষ্ট্য" নির্বাচন করুন।

একটি URL পড়া সহজ করতে, এই নথিটি প্রায়শই একাধিক লাইনে দেখায়৷ আপনি যখন Google Chart API ব্যবহার করছেন, তখন আপনাকে অবশ্যই একটি লাইনে একটি URL সরবরাহ করতে হবে।

Google চার্ট API একটি URL GET বা POST অনুরোধের প্রতিক্রিয়া হিসাবে একটি চার্ট চিত্র প্রদান করে৷ API পাই বা লাইন চার্ট থেকে QR কোড এবং সূত্র পর্যন্ত অনেক ধরণের চার্ট তৈরি করতে পারে। চার্টের সমস্ত তথ্য যা আপনি চান, যেমন চার্ট ডেটা, আকার, রঙ এবং লেবেল, URL এর অংশ। (পোস্ট অনুরোধের জন্য, এটি একটু ভিন্ন, কিন্তু এখন এটি সম্পর্কে চিন্তা করবেন না)।

সহজতম চার্টকে সম্ভব করার জন্য, আপনার সমস্ত URL নির্দিষ্ট করতে হবে চার্টের ধরন, ডেটা এবং আকার৷ আপনি এই URLটি সরাসরি আপনার ব্রাউজারে টাইপ করতে পারেন, অথবা আপনার ওয়েব পৃষ্ঠায় একটি <img> ট্যাগ দিয়ে নির্দেশ করতে পারেন। উদাহরণস্বরূপ, একটি পাই চার্টের জন্য এই লিঙ্কটি অনুসরণ করুন:

https://chart.googleapis.com/chart?chs=250x100&chd=t:60,40&cht=p3&chl=Hello|World

পূর্ববর্তী লিঙ্কটি একটি মৌলিক চার্ট API URL এর একটি উদাহরণ। সমস্ত চার্ট URL-এর নিম্নলিখিত বিন্যাস রয়েছে:

https://chart.googleapis.com/chart?cht=<chart_type>&chd=<chart_data>&chs=<chart_size>&...additional_parameters...

সমস্ত URL https://chart.googleapis.com/chart? পরামিতি দ্বারা অনুসরণ করে যা চার্ট ডেটা এবং চেহারা নির্দিষ্ট করে। পরামিতিগুলি হল নাম = মান জোড়া, একটি অ্যাম্পারস্যান্ড অক্ষর ( & ) দ্বারা পৃথক করা হয় এবং পরামিতিগুলি ? এর পরে যে কোনও ক্রমে হতে পারে . সমস্ত চার্টের ন্যূনতম নিম্নলিখিত পরামিতিগুলির প্রয়োজন: cht (চার্টের ধরন), chd (ডেটা), এবং chs (চার্টের আকার)। যাইহোক, অতিরিক্ত বিকল্পগুলির জন্য আরও অনেক পরামিতি রয়েছে এবং আপনি চার্ট সমর্থন করে যতগুলি অতিরিক্ত পরামিতি নির্দিষ্ট করতে পারেন।

আসুন উপরের URLটি আরও বিস্তারিতভাবে পরীক্ষা করি:

URL উপাদান

Yellow pie chart

https://chart.googleapis.com/chart?
cht=p3&
chs=250x100&
chd=t:60,40&
chl=Hello|World


https://chart.googleapis.com/chart?
এটি সমস্ত চার্ট অনুরোধের জন্য ভিত্তি URL।
cht=p3
চার্টের ধরন: এখানে, একটি 3D পাই চার্ট।
chs=250x100
চার্টের আকার ( প্রস্থ x উচ্চতা ), পিক্সেলে। এখানে সর্বোচ্চ মান দেখুন।
chd=t:60,40
চার্ট ডেটা। এই তথ্যটি সাধারণ পাঠ্য বিন্যাসে, তবে অন্যান্য বিন্যাস রয়েছে।
chl=Hello|World
স্লাইস লেবেল .
&
পরামিতি একটি ampersand দ্বারা পৃথক করা হয়. দ্রষ্টব্য: HTML-এ একটি URL এম্বেড করার সময়, উদাহরণস্বরূপ একটি <img> ট্যাগের src বৈশিষ্ট্য হিসাবে, আপনাকে অক্ষরগুলির সাথে & এর মধ্যে পরামিতি প্রতিস্থাপন করা উচিত &amp; আপনি যখন পিএইচপি বা অন্য কোনো ভাষা দিয়ে পৃষ্ঠা এইচটিএমএল তৈরি করেন তখন এটি অন্তর্ভুক্ত। যাইহোক, ব্রাউজারে একটি URL টাইপ করার সময়, বা কোডে একটি URL কল করার সময়, উদাহরণস্বরূপ PHP বা পার্লে একটি URL আনার সময়, আপনার & চিহ্ন ব্যবহার করা উচিত।

আপনার ব্রাউজারে এই URLটি অনুলিপি করুন এবং পেস্ট করুন এবং কিছু পরিবর্তন করার চেষ্টা করুন: ডেটাতে অতিরিক্ত মান যুক্ত করুন (প্রতিটি নতুন ডেটা মানের আগে একটি কমা যোগ করতে ভুলবেন না)। নতুন লেবেল যোগ করুন (প্রতিটি নতুন মানের আগে একটি | চিহ্ন রাখুন)। চার্টটি আরও বড় করুন।

উপরে ফিরে যাও

কিভাবে একটি চার্ট তৈরি করবেন

এখানে কিভাবে একটি ইমেজ চার্ট তৈরি করতে হয়:

  1. একটি চার্ট টাইপ সিদ্ধান্ত নিন. চার্টের তালিকার জন্য গ্যালারি দেখুন; চার্টের ধরন cht প্যারামিটার দ্বারা নির্দিষ্ট করা হয়। আপনি আপনার চার্টে যে সমস্ত উপাদানগুলি রাখতে চান তা স্কেচ করুন (অক্ষ, লেবেল, ব্যাকগ্রাউন্ড ইত্যাদি), এবং যদি প্রয়োজন হয়, বিভিন্ন উপাদানের জন্য পিক্সেল মাত্রাগুলি বের করুন (মোট চার্টের আকার, কিংবদন্তি আকার এবং আরও অনেক কিছু)৷ আপনার চার্টের প্রকারের জন্য আপনাকে প্রথমে ডকুমেন্টেশনটি সাবধানে পড়তে হবে, অথবা আপনার হতাশাজনক অভিজ্ঞতা হতে পারে।
  2. আপনার চার্ট ডেটা তৈরি করুন এবং ফর্ম্যাট করুন chd প্যারামিটার ব্যবহার করে ডেটা নির্দিষ্ট করা হয়। আপনার ডেটার জন্য কোন ফর্ম্যাট ব্যবহার করবেন তা আপনাকে সিদ্ধান্ত নিতে হবে:
    • একটি ডেটা বিন্যাস চয়ন করুন। আপনি আপনার চার্ট ডেটার জন্য সাধারণ পাঠ্য বিন্যাস ব্যবহার করতে পারেন, যা পড়তে সহজ, কিন্তু পাঠাতে আরও জায়গা নেয়, বা এনকোডিং প্রকারগুলির একটি ব্যবহার করুন, যা পাঠানোর জন্য ছোট, কিন্তু আপনি যে মানগুলি পাঠাতে পারেন তার পরিসীমা সীমাবদ্ধ করে৷
    • আপনার চার্টের সাথে মানানসই করার জন্য আপনার ডেটা স্কেল করা উচিত কিনা তা নির্ধারণ করুন। বিভিন্ন বিন্যাস মানগুলির বিভিন্ন পরিসর সমর্থন করে। আপনি আপনার ডেটা স্কেল করতে চাইতে পারেন যাতে এটি আপনার বিন্যাস দ্বারা অনুমোদিত মানগুলির সম্পূর্ণ পরিসরে বিস্তৃত হয়, পার্থক্যগুলিকে আরও সুস্পষ্ট করতে। আপনি যে ডেটা বিন্যাসটি ব্যবহার করেন তার মধ্যে ফিট করার জন্য আপনার ডেটা স্কেল করে আপনি এটি করতে পারেন, অথবা আপনি কাস্টম স্কেলিং এর সাথে পাঠ্য বিন্যাস ব্যবহার করতে পারেন।
    • প্রয়োজনে আপনার ডেটা এনকোড করুন। আপনি যদি একটি এনকোড করা ফরম্যাট বেছে নিয়ে থাকেন, তাহলে আমরা অন্যান্য এনকোডিং ধরনের সাহায্য করার জন্য কিছু জাভাস্ক্রিপ্ট অফার করি।
  3. চার্টের আকার নির্দিষ্ট করুন। chs প্যারামিটার ব্যবহার করে চার্টের আকার নির্দিষ্ট করা হয়। বিন্যাস, এবং সর্বোচ্চ মান জন্য ডকুমেন্টেশন দেখুন.
  4. অতিরিক্ত পরামিতি যোগ করুন। প্রতিটি চার্টের ডকুমেন্টেশন উপলব্ধ ঐচ্ছিক পরামিতি তালিকাভুক্ত করে। সাধারণ বিকল্পগুলির মধ্যে লেবেল, শিরোনাম এবং রং অন্তর্ভুক্ত। মনে রাখবেন যে সমস্ত লেবেল বা শিরোনাম পাঠ্য অবশ্যই UTF-8 এনকোড করা উচিত। মনে রাখবেন যে অনেক প্যারামিটার আপনাকে একাধিক মান প্রবেশ করতে দেয়। উদাহরণস্বরূপ, chm প্যারামিটার আপনাকে একটি চার্টে একটি একক ডেটা পয়েন্টে একটি আকৃতি দিতে দেয়। আপনি chm প্যারামিটার ব্যবহার করে একাধিক ডেটা পয়েন্টে আকার রাখতে পারেন, কিন্তু এটি করার জন্য, আপনি আপনার URL-এ chm প্যারামিটার একাধিকবার নির্দিষ্ট করবেন না (উদাহরণস্বরূপ, ভুল : chm= square & chm= circle &chm= triangle )। পরিবর্তে, একাধিক মান গ্রহণকারী পরামিতিগুলি একই প্যারামিটারে একাধিক মানের মধ্যে একটি বিভাজক ব্যবহার করে, যেমন একটি কমা বা উল্লম্ব বার। chm এর জন্য, এটি একটি বার, তাই আপনার কাছে এরকম কিছু থাকবে: RIGHT : chm= square | circle | triangle একাধিক প্যারামিটার কিভাবে নির্দিষ্ট করতে হয় তা শিখতে প্রতিটি প্যারামিটারের বিশদ বিবরণ দেখুন।
  5. আপনার URL স্ট্রিং তৈরি করুন. URLটি https://chart.googleapis.com/chart? এবং আপনার সমস্ত প্রয়োজনীয় ( cht , chd , chs ) এবং ঐচ্ছিক পরামিতি দ্বারা অনুসরণ করা হয়৷ দ্রষ্টব্য: আপনি যদি একটি <img> ট্যাগে আপনার URL ব্যবহার করেন, তাহলে আপনাকে আপনার সমস্ত & অক্ষর পরিবর্তন করতে হবে &amp; আপনার লিঙ্কে। উদাহরণ: <img src="https://chart.googleapis.com/chart?chs=250x100&amp;chd=t:60,40&amp;cht=p3&amp;chl=Hello|World" />
  6. আপনার ছবি পেতে GET বা POST ব্যবহার করুন। GET, হয় যখন আপনি সরাসরি আপনার ব্রাউজারে URL টাইপ করেন, অথবা একটি <img> ট্যাগে ব্যবহার করেন। যাইহোক, URL গুলি 2K দৈর্ঘ্যের মধ্যে সীমাবদ্ধ, তাই যদি আপনার কাছে এর চেয়ে বেশি ডেটা থাকে বা রক্তের স্বাদ থাকে, তাহলে এখানে বর্ণিত হিসাবে আপনার পরিবর্তে POST ব্যবহার করার কথা বিবেচনা করা উচিত।
  7. ক্লিকযোগ্য অঞ্চল তৈরি করুন। আপনি ঐচ্ছিকভাবে চার্টের জন্য একটি চিত্র মানচিত্র তৈরি করতে পারেন যা আপনাকে হাইপারলিঙ্ক যোগ করতে বা নির্দিষ্ট চার্ট উপাদানগুলিতে উপাদানগুলিকে ক্লিক করতে দেয়। বিস্তারিত জানার জন্য একটি চার্ট চিত্র মানচিত্র তৈরি করা দেখুন।

উপরে ফিরে যাও

চার্ট শর্তাবলী শব্দকোষ

এখানে কয়েকটি গুরুত্বপূর্ণ পদ রয়েছে যা আমরা এই ডকুমেন্টেশনে ব্যবহার করি:

সিরিজ
একটি চার্টে ডেটার একটি সম্পর্কিত সেট। একটি সিরিজ কি গঠন করে তা চার্টের প্রকারের উপর নির্ভর করে: একটি লাইন চার্টে, একটি সিরিজ একটি একক লাইন; একটি পাই চার্টে, প্রতিটি এন্ট্রি একটি স্লাইস, এবং সমস্ত স্লাইস একসাথে একটি সিরিজ। একটি বার চার্টে, একটি সিরিজ হল ডেটার একই সেট থেকে সমস্ত বার; বার চার্টের প্রকারের উপর নির্ভর করে বিভিন্ন সিরিজ হয় পাশাপাশি গোষ্ঠীভুক্ত বা একে অপরের উপরে স্ট্যাক করা হয়। নিম্নলিখিত চার্ট দুটি সিরিজ সহ একটি গোষ্ঠীবদ্ধ বার চার্ট প্রদর্শন করে, একটি গাঢ় নীল, একটি হালকা নীল:
Bar chart showing two series: Cats and Dogs.
অক্ষ লেবেল
প্রতিটি অক্ষ বরাবর সংখ্যাসূচক বা পাঠ্য মান। আগের চার্টে, এটি "জানুয়ারি," "ফেব্রুয়ারি," "মার্চ," "0," "50," "100" লেবেল হবে।
চার্ট এলাকা
সিরিজ শিল্প দেখানো এলাকা. আরো বিস্তারিত জানার জন্য "চার্ট উপাদান" সাইডবার দেখুন।
কিংবদন্তি
চার্টে একটি ছোট এলাকা যা সিরিজের বর্ণনা দেয়। উপরের চার্টে, এটি সেই বিভাগ যা "বিড়াল" এবং "কুকুর" তালিকাভুক্ত করে।
প্যারামিটার
একটি কী = URL-এ ব্যবহৃত মান জোড়া। উদাহরণস্বরূপ: chxt=x , যেখানে chxt হল প্যারামিটারের নাম এবং x হল প্যারামিটারের মান।
পান এবং পোস্ট করুন
আপনার চার্ট URL পাঠানোর দুটি পদ্ধতি। GET সাধারণত ব্রাউজারে একটি URL টাইপ করে বা এটিকে <img> ট্যাগের উত্স করে করা হয়। POST অনুরোধগুলি তৈরি করা আরও জটিল, তবে আরও অনেক ডেটা অন্তর্ভুক্ত করতে পারে। GET এর পরিবর্তে POST ব্যবহার করার প্রধান কারণ হল একটি POST অনুরোধ একটি GET অনুরোধের চেয়ে অনেক বেশি ডেটা নিতে পারে (16K অক্ষর বনাম 2K অক্ষর)। পোস্ট এখানে কভার করা হয়.
পাইপ চরিত্র
| অক্ষর, প্রায়শই একটি প্যারামিটার মান বিভাজক হিসাবে ব্যবহৃত হয়—অর্থাৎ, একাধিক মান ভাঙ্গার জন্য একটি অক্ষর। কমা এবং অ্যাম্পারস্যান্ড (&) চার্ট URL-এ বিভেদক হিসাবেও ব্যবহৃত হয়।
যৌগিক চার্ট
একটি চার্ট যা দুটি ভিন্ন ধরণের চার্টের সংমিশ্রণ: উদাহরণস্বরূপ, একটি লাইন সহ একটি বার চার্ট বা ক্যান্ডেলস্টিক মার্কার সহ একটি লাইন চার্ট৷ যৌগিক চার্ট দেখুন।

উপরে ফিরে যাও

অপ্টিমাইজেশন

এখন যেহেতু আপনি একটি চার্ট তৈরির প্রাথমিক বিষয়গুলি শিখেছেন, এখানে কয়েকটি অপ্টিমাইজেশন রয়েছে যা আপনি ব্যবহার করতে পারেন৷

পোস্ট ব্যবহার করে

URLগুলি 2K দৈর্ঘ্যের মধ্যে সীমাবদ্ধ, তাই যদি আপনার চার্টে এর চেয়ে বেশি ডেটা থাকে, তাহলে আপনাকে GET এর পরিবর্তে POST ব্যবহার করতে হবে, যেমন এখানে বর্ণনা করা হয়েছে। আপনি যখন আপনার ব্রাউজার ইউআরএল বারে আপনার চার্ট URL টাইপ করেন বা একটি ওয়েব পৃষ্ঠায় <img> উপাদানের উৎস হিসাবে এটি ব্যবহার করেন তখন GET হয়। POST-এর জন্য অন্য ভাষায় অতিরিক্ত প্রোগ্রামিং প্রয়োজন, যেমন PHP বা PERL।

জাভাস্ক্রিপ্টে চার্ট তৈরি করা

আপনার জন্য ইমেজ চার্ট তৈরি করতে আপনি Google Visualization API ব্যবহার করতে পারেন। Google ভিজ্যুয়ালাইজেশন API হল একটি জাভাস্ক্রিপ্ট-ভিত্তিক API যা আপনাকে ডেটা তৈরি, ফিল্টার এবং ম্যানিপুলেট করার জন্য বা ডেটার জন্য Google স্প্রেডশীট বা অন্যান্য সাইটগুলিকে জিজ্ঞাসা করার জন্য টুল দেয়। আপনি আপনার ডেটা তৈরি করতে ভিজ্যুয়ালাইজেশন API ব্যবহার করতে পারেন, তারপর পৃষ্ঠায় চার্ট রেন্ডার করতে এটিকে ইমেজ চার্ট API কল করতে দিন। আরও তথ্যের জন্য, জেনেরিক ইমেজ চার্ট ডকুমেন্টেশন দেখুন, অথবা চিহ্নিত কোনো Google চার্টের জন্য ভিজ্যুয়ালাইজেশন গ্যালারিতে দেখুন (ছবি)।