একটি চার্ট চিত্র মানচিত্র তৈরি করা

ভূমিকা

এইচটিএমএল স্ট্যান্ডার্ড আপনাকে একটি ইমেজ ম্যাপ ব্যবহার করে একটি ওয়েব পেজ ইমেজে হট স্পট নির্দিষ্ট করতে সক্ষম করে। এই হট স্পটগুলি হোভারটেক্সট প্রদর্শন করতে বা লিঙ্ক হিসাবে কাজ করতে ব্যবহার করা যেতে পারে, অথবা আপনি ইন্টারঅ্যাক্টিভিটি সক্ষম করতে জাভাস্ক্রিপ্ট ইভেন্ট হ্যান্ডলিং যোগ করতে পারেন। উদাহরণস্বরূপ, নিম্নলিখিত চিত্রের বার এবং অক্ষ লেবেলের উপর আপনার মাউস ঘোরান:

এই হট স্পটগুলি <map> এবং <area> HTML উপাদান ব্যবহার করে তৈরি করা হয়। চার্ট API এর জন্য একটি হট স্পট মানচিত্র তৈরি করার জন্য প্রয়োজনীয় সমস্ত স্থানাঙ্ক ফিরিয়ে দিতে পারে, যেমনটি পরবর্তী বর্ণনা করা হয়েছে।

আপনার চার্টের জন্য একটি মানচিত্র তৈরি করা

আপনি যদি আপনার চার্ট URL-এ chof=json প্যারামিটার যোগ করেন, তাহলে আপনি একটি JSON স্ট্রিং ফিরে পাবেন যাতে আপনার চার্টের জন্য একটি চিত্র মানচিত্র তৈরি করতে আপনার প্রয়োজনীয় সমস্ত ডেটা অন্তর্ভুক্ত থাকে। তারপরে আপনি আপনার চার্টের নির্দিষ্ট বিভাগে লিঙ্ক যোগ করতে পারেন, অথবা আপনার চার্টকে আরও ইন্টারেক্টিভ করতে ইভেন্টে ক্লিক করতে JavaScript ফাংশন সংযুক্ত করতে পারেন। মনে রাখবেন যে সমস্ত চার্ট প্রকার এটি সমর্থন করে না; বিস্তারিত জানার জন্য আপনার নির্দিষ্ট চার্ট ডকুমেন্টেশন দেখুন।

এই পৃষ্ঠার টুলটি আপনাকে একটি চিত্র মানচিত্রের জন্য HTML তৈরি করতে সাহায্য করবে। আপনি এই HTMLটিকে আপনার পৃষ্ঠায় স্থায়ীভাবে এম্বেড করতে পারেন, অথবা আপনি এমনকি আপনার পৃষ্ঠায় আমাদের কোডটি অনুলিপি করতে পারেন, এবং তারপরে অনুরোধ এবং ফ্লাইতে মানচিত্র তৈরি করতে পারেন, যদি আপনার পৃষ্ঠাটি ব্যবহারকারীকে গতিশীলভাবে পৃষ্ঠার মানচিত্র পরিবর্তন করতে সক্ষম করে।

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

  1. আপনার চার্টের জন্য JSON আউটপুট পান: আপনার চার্ট URL-এ chof=json যোগ করুন, আপনার ব্রাউজারে সেই URL-এ ব্রাউজ করুন এবং ফিরে আসা পাঠ্যটি অনুলিপি করুন।
  2. নিচের "JSON আউটপুট" চিহ্নিত টেক্সট বক্সে আপনার কপি করা JSON টেক্সট পেস্ট করুন এবং "Make Map" এ ক্লিক করুন।
  3. আপনার পৃষ্ঠায় তৈরি মানচিত্র কোড আটকান
  4. আপনার <map> উপাদানের জন্য একটি অনন্য নাম দিয়ে জেনারেট করা কোড আপডেট করুন।
  5. আপনার প্রয়োজন নেই এমন কোনও মানচিত্রের উপাদানগুলি সরান (উদাহরণস্বরূপ, নির্দিষ্ট বার, স্লাইস, লেবেল বা অক্ষ উপাদান)।
  6. জেনারেট করা <area> উপাদানগুলিতে href বৈশিষ্ট্যগুলি আপডেট করুন।
  7. আপনার <img> উপাদানটিতে usemap="# MAP_NAME " অ্যাট্রিবিউট যোগ করুন , MAP_NAME এর জন্য আপনার মানচিত্রের নাম প্রতিস্থাপন করুন।

    গুরুত্বপূর্ণ: '#'-এর সাথে Usemap মান উপসর্গ করতে ভুলবেন না। উদাহরণস্বরূপ: usemap="#mymap" । এই ক্ষেত্রে, মানচিত্রের নাম "mymap" নয় "#mymap"।

JSON স্ট্রিং এর বিন্যাস

আপনি যখন chof=json উল্লেখ করেন তখন JSON এর ফর্ম্যাটটি এখানে ফিরে আসে:

  • চার্টশেপ নামে একটি মূল বস্তু। এই অবজেক্টটি অবজেক্টের একটি অ্যারে ধারণ করে, প্রতিটি চার্টের একটি চিত্র মানচিত্রে একটি এলাকাকে প্রতিনিধিত্ব করে। প্রতিটি বস্তুর নিম্নলিখিত বৈশিষ্ট্য রয়েছে:
    • নাম - এই নির্দিষ্ট এলাকার জন্য একটি নাম। সাধারণ নামকরণের নিয়ম হল elementtype _ series# _ item# । উদাহরণস্বরূপ: প্রথম সিরিজের প্রথম বার বর্ণনা করে এমন একটি এলাকার জন্য bar0_0, অথবা x-অক্ষের দ্বিতীয় অক্ষের লেবেল বর্ণনা করে এমন একটি এলাকার জন্য axis0_1।
    • প্রকার - এই এলাকার আকৃতি। চার্টের প্রকারের উপর নির্ভর করে এটি নিম্নলিখিত মানগুলির মধ্যে একটি হবে: RECT, CIRCLE বা POLY৷ এটি <area> ট্যাগের আকৃতি বৈশিষ্ট্যের সমতুল্য।
    • coords - এলাকা বর্ণনা করে একটি সংখ্যাসূচক অ্যারে; <area> ট্যাগের coords বৈশিষ্ট্যের সমতুল্য।