সংক্ষিপ্ত বিবরণ
গুগল ম্যাপস প্ল্যাটফর্ম ওয়েব (JS, TS), অ্যান্ড্রয়েড এবং আইওএস-এর জন্য উপলব্ধ। এটি স্থান, দিকনির্দেশনা এবং দূরত্ব সম্পর্কিত তথ্য পাওয়ার জন্য ওয়েব সার্ভিস এপিআই-ও প্রদান করে। এই নির্দেশিকার নমুনাগুলো একটি প্ল্যাটফর্মের জন্য লেখা হয়েছে, তবে অন্যান্য প্ল্যাটফর্মে বাস্তবায়নের জন্য ডকুমেন্টেশনের লিঙ্ক দেওয়া হয়েছে।
গুগল ক্লাউড কনসোলের কুইক বিল্ডার আপনাকে দ্রুত একটি লোকেটর তৈরি করতে দেয়, যার মধ্যে বিজনেস প্রোফাইল লিস্টিং ইম্পোর্ট করা এবং থার্ড-পার্টি প্রোভাইডারদের থেকে অ্যাপয়েন্টমেন্ট বুকিং লিঙ্ক স্বয়ংক্রিয়ভাবে এম্বেড করা অন্তর্ভুক্ত। এর ইন্টারেক্টিভ ইউআই আপনাকে কয়েক মিনিটের মধ্যেই কোড জেনারেট করে ক্লাউডে ডেপ্লয় করতে সাহায্য করে।
আপনার ব্যবহারকারীরা অনলাইনে পণ্য ও পরিষেবা সম্পর্কে গবেষণা করতে এবং পরিদর্শনের জন্য, অ্যাপয়েন্টমেন্ট করার জন্য বা অর্ডার সংগ্রহের জন্য সেরা ও সবচেয়ে সুবিধাজনক স্থান খুঁজে পেতে চান। তারা যত দ্রুত সম্ভব আপনার অবস্থানে পৌঁছাতে চাইবেন, এবং আপনিও তাদের এমন সমৃদ্ধ অনলাইন অভিজ্ঞতা দিতে চাইবেন যা আপনার ভৌত অবস্থানগুলিতে ভিজিট বাড়ায়, ব্যবহারকারীর সন্তুষ্টি বৃদ্ধি করে এবং সাপোর্ট কলের সংখ্যা কমায়। আপনার গ্রাহকরা আপনার অবস্থান খুঁজে পাচ্ছেন কিনা তা নির্ধারণ করতে এবং কোথায় উন্নতি করা প্রয়োজন তা বুঝতে আপনি আপনার লোকেটারের সাফল্যও পরিমাপ করতে চাইবেন।
লোকেটর প্লাস—এই ডকুমেন্টে আমরা যে নির্দেশিকা এবং কাস্টমাইজেশন টিপস প্রদান করেছি—সেটিকেই আমরা চমৎকার লোকেটর ইউজার এক্সপেরিয়েন্স তৈরির জন্য গুগল ম্যাপস প্ল্যাটফর্ম এপিআই-এর সর্বোত্তম সমন্বয় হিসেবে সুপারিশ করি। এই পদ্ধতিগুলো অনুসরণ করে, আপনি ব্যবহারকারীদের মানচিত্রে আপনার অবস্থান খুঁজে পেতে, সিদ্ধান্ত নেওয়ার জন্য প্রয়োজনীয় বিস্তারিত তথ্য দেখতে এবং দিকনির্দেশনা দিতে সাহায্য করতে পারেন, তারা গাড়ি চালাক, সাইকেল চালাক, হেঁটে যাক বা গণপরিবহন ব্যবহার করুক।
লোকেটর প্লাস ব্যবহারকারীদের জন্য, একটি অ্যানালিটিক্স ড্যাশবোর্ড আপনাকে আপনার ডেটা থেকে তথ্য বিশ্লেষণ ও তৈরি করতে সাহায্য করে, যা আপনার ক্রেতারা আপনার স্টোর লোকেটরের সাথে কতটা ভালোভাবে যুক্ত হচ্ছেন তার একটি স্পষ্ট চিত্র দেয়। এই রিপোর্টটি অ্যাক্সেস করতে, কনসোলের এনগেজমেন্ট রিপোর্টস বিভাগে যান। এই রিপোর্ট সম্পর্কে আরও বিস্তারিত জানতে, এনগেজমেন্ট রিপোর্টস দেখুন।
নিম্নলিখিত ডায়াগ্রামটি লোকেটর প্লাস বাস্তবায়নে ব্যবহৃত মূল এপিআইগুলো দেখায়। ডায়াগ্রামটিতে আপনার নিজস্ব অবস্থানের ডেটার একটি ডেটাবেসও দেখানো হয়েছে, যা আপনি প্লেস ডিটেইলস-এর সাথে একত্রিত করে ব্যবহারকারীদের সম্ভাব্য সর্বোত্তম ও সবচেয়ে সম্পূর্ণ তথ্যসম্ভার প্রদান করতে পারেন। (বড় করে দেখতে ক্লিক করুন।)
এপিআই সক্ষম করা
এই অনুশীলনগুলি বাস্তবায়ন করতে, আপনাকে Google Cloud কনসোলে নিম্নলিখিত API গুলি সক্রিয় করতে হবে: সেটআপ সম্পর্কে আরও তথ্যের জন্য, গুগল ম্যাপস প্ল্যাটফর্ম দিয়ে শুরু করা দেখুন।বাস্তবায়ন বিভাগ
এই নথিতে আমরা নিম্নলিখিত অনুশীলন এবং কাস্টমাইজেশনগুলো নিয়ে আলোচনা করব।
- আইকনটি একটি মূল অনুশীলন।
- আইকনটি একটি ঐচ্ছিক কিন্তু সমাধানটিকে আরও উন্নত করার জন্য প্রস্তাবিত কাস্টমাইজেশন।
| একটি ইন্টারেক্টিভ মানচিত্রে আপনার অবস্থানগুলি দেখানো হচ্ছে | এমন একটি মানচিত্র তৈরি করুন যা ব্যবহারকারীদের অবস্থানের বিবরণ দেখতে, চলাচল করতে এবং জুম ইন ও আউট করতে দেয়। অথবা দ্রুত একটি ম্যাপ তৈরি করতে কুইক বিল্ডার লোকেটর প্লাস সলিউশনটি ব্যবহার করে দেখুন, যার মধ্যে রয়েছে আপনার বিজনেস প্রোফাইল লিস্টিং থেকে ব্যবসার বিবরণ ইম্পোর্ট করা, অ্যাপয়েন্টমেন্ট বুকিং লিঙ্ক যুক্ত করা এবং গুগল ক্লাউড স্টোরেজে ডেপ্লয় করা। | |
| স্থানের বিবরণ প্রদান করা | ব্যবহারকারীরা মানচিত্রে আপনার নিকটতম অবস্থানগুলি খুঁজে পাওয়ার পর, তাদের সিদ্ধান্ত নিতে সাহায্য করার জন্য সেই অবস্থানগুলি সম্পর্কে অর্থপূর্ণ বিবরণ দিন। | |
| ৪৫° কোণ থেকে অবস্থানগুলি দেখানো হচ্ছে | ব্যবহারকারীদের ৪৫-ডিগ্রি কোণ থেকে স্যাটেলাইট ভিউয়ের মাধ্যমে আপনার অবস্থানের একটি উন্নততর চিত্র দেখান। | |
| আপনার ব্যবহারকারীর অবস্থান শনাক্ত করা | সকল প্ল্যাটফর্মে ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে এবং ন্যূনতম কীস্ট্রোকের মাধ্যমে ঠিকানার নির্ভুলতা বাড়াতে টাইপ-অ্যাজ-ইউ-গো কার্যকারিতা যোগ করুন। | |
| নিকটতম স্থানগুলিতে ভ্রমণের সময় এবং দূরত্ব দেখানো হচ্ছে | একাধিক উৎস ও গন্তব্যের জন্য ভ্রমণের দূরত্ব এবং সময় গণনা করুন, ঐচ্ছিকভাবে হাঁটা, গাড়ি চালানো বা সাইকেল চালানোর মতো বিভিন্ন ধরনের পরিবহন ব্যবস্থা উল্লেখ করুন। | |
| ব্যবহারকারীদের অ্যাপয়েন্টমেন্ট বুক করতে সাহায্য করা | ব্যবহারকারীদের প্লেস ডিটেইলস সাইড প্যানেল থেকে অ্যাপয়েন্টমেন্ট বুক করার সুযোগ দিন। অথবা দ্রুত একটি ম্যাপ তৈরি করতে কুইক বিল্ডার লোকেটর প্লাস সলিউশনটি ব্যবহার করে দেখুন, যার মধ্যে রয়েছে আপনার বিজনেস প্রোফাইল লিস্টিং থেকে ব্যবসার বিবরণ ইম্পোর্ট করা, অ্যাপয়েন্টমেন্ট বুকিং লিঙ্ক যুক্ত করা এবং গুগল ক্লাউড স্টোরেজে ডেপ্লয় করা। | |
| স্থানীয় অফারগুলি প্রদর্শন করা হচ্ছে | স্থানের বিবরণ সাইড প্যানেলে ব্যবহারকারীদের ক্লিকযোগ্য স্থানীয় অফার দেখান। | |
| নেভিগেশন দিকনির্দেশনা প্রদান করা | হাঁটা, গাড়ি চালানো, সাইকেল চালানো এবং গণপরিবহনের মতো বিভিন্ন ধরনের পরিবহন ব্যবহার করে উৎস থেকে গন্তব্যে যাওয়ার দিকনির্দেশনার তথ্য পান। | |
| আপনার মানচিত্র কাস্টমাইজ করা | আপনার অবস্থানগুলোকে সুস্পষ্টভাবে তুলে ধরতে নিজস্ব ম্যাপ মার্কার তৈরি করুন এবং আপনার ব্র্যান্ডের রঙের সাথে মিলিয়ে ম্যাপটিকে স্টাইল করুন। ব্যবহারকারীদের সহজে দিক নির্ণয়ে সাহায্য করার জন্য আপনার ম্যাপে নির্দিষ্ট গুরুত্বপূর্ণ স্থান (POI) প্রদর্শন (বা গোপন) করুন এবং ম্যাপে অতিরিক্ত ভিড় এড়াতে POI-এর ঘনত্ব নিয়ন্ত্রণ করুন। | |
| অ্যানালিটিক্সের মাধ্যমে ব্যবহারের অন্তর্দৃষ্টি অর্জন | আপনার লোকেটার কৌশল ও তার বাস্তবায়ন সম্পর্কে ধারণা পেতে গুগল অ্যানালিটিক্স কনফিগার করুন এবং ব্যবহার করুন। | |
| মোবাইলে দিকনির্দেশনা পাঠানো | লোকেটার-এ দিকনির্দেশ দেখানোর পাশাপাশি, আপনি চলতে চলতে গুগল ম্যাপস ব্যবহার করে নেভিগেশনের জন্য ব্যবহারকারীর ফোনে দিকনির্দেশ পাঠাতেও পারেন। | |
| ব্যবহারকারীদের অবস্থানগুলো কল্পনা করতে সাহায্য করার জন্য স্ট্রিট ভিউ দেখানো হচ্ছে। | ব্যবহারকারীদের দিকনির্দেশনা আরও ভালোভাবে দিতে এবং আপনার অবস্থানগুলো আরও দ্রুত খুঁজে পেতে সাহায্য করার জন্য ৩৬০-ডিগ্রি স্ট্রিট ভিউ চিত্রাবলী প্রদান করুন। | |
| জিওলোকেশন ব্যবহার করে ব্যবহারকারীর অবস্থান নির্ণয় করা | আপনি যদি ডিভাইসের নিজস্ব অবস্থান পরিষেবার উপর নির্ভর করতে না চান, তাহলে ব্যবহারকারীর অবস্থান শনাক্ত করতে জিওলোকেশন ব্যবহার করুন। | |
| কাস্টম অবস্থান ডেটাকে স্থানের বিবরণের সাথে একত্রিত করা | ব্যবহারকারীদের সিদ্ধান্ত গ্রহণের জন্য একটি সমৃদ্ধ ডেটাসেট দিতে, আপনার নিজস্ব অবস্থানের বিবরণের সাথে স্থানের বিবরণ (Place Details) একত্রিত করুন। |
একটি ইন্টারেক্টিভ মানচিত্রে আপনার অবস্থানগুলি দেখানো হচ্ছে
ব্যবহারকারীর অভিজ্ঞতার জন্য লোকেটার একটি গুরুত্বপূর্ণ অংশ। তবে, কিছু সাইটে একটি ম্যাপও নাও থাকতে পারে, যার ফলে কাছাকাছি কোনো স্থান খুঁজে পেতে ব্যবহারকারীদের সাইট বা অ্যাপ থেকে বেরিয়ে যেতে হয়। এর অর্থ হলো, ব্যবহারকারীদের জন্য এটি একটি নিম্নমানের অভিজ্ঞতা, কারণ তাদের প্রয়োজনীয় তথ্য পেতে বিভিন্ন পৃষ্ঠার মধ্যে যাতায়াত করতে হয়। এর পরিবর্তে, আপনি আপনার অ্যাপ্লিকেশনগুলিতে ম্যাপ এমবেড এবং কাস্টমাইজ করার মাধ্যমে এই অভিজ্ঞতাকে আরও উন্নত করতে পারেন।
আপনি দুটি উপায়ে এই কার্যকারিতাটি সক্রিয় করতে পারেন: কুইক বিল্ডার লোকেটর প্লাস সলিউশন ব্যবহার করে, যা সরাসরি এই সুবিধাটি প্রদান করে, অথবা আপনার নিজস্ব ডাইনামিক ম্যাপস ইমপ্লিমেন্টেশন ব্যবহার করে। এই বিভাগে এই বিকল্পগুলি বিস্তারিতভাবে বর্ণনা করা হয়েছে।
কুইক বিল্ডার লোকেটর প্লাস ব্যবহার করে
আপনি আপনার বিজনেস প্রোফাইল থেকে ব্যবসার বিবরণ ইম্পোর্ট করতে কুইক বিল্ডার লোকেটর প্লাস সলিউশনটি ব্যবহার করতে পারেন। ফলে এখন, আপনার বিজনেস প্রোফাইলের বিবরণে কোনো পরিবর্তন হলে তা আপনার ওয়েবসাইটের স্টোর লোকেটরে প্রতিফলিত হবে। এই পরিবর্তনগুলোর মধ্যে ব্যবসার সময়, যোগাযোগের তথ্য, ছবি, পরিষেবার বিকল্প এবং আরও অনেক কিছু অন্তর্ভুক্ত থাকতে পারে। কুইক বিল্ডার আপনাকে কয়েক মিনিটের মধ্যে দ্রুত ম্যাপে ব্যবসার অবস্থান সেট আপ করা, ডেপ্লয়যোগ্য কোড তৈরি করা, অথবা সরাসরি গুগল ক্লাউড স্টোরেজে ডেপ্লয় করার সুবিধা দেয়।
আপনার নিজস্ব ডাইনামিক ম্যাপস ইমপ্লিমেন্টেশন ব্যবহার করে
| এই উদাহরণে ব্যবহৃত হয়েছে: Maps JavaScript API | এছাড়াও উপলব্ধ: অ্যান্ড্রয়েড | আইওএস |
আপনার পেজে একটি ডাইনামিক ম্যাপ যোগ করা—অর্থাৎ, এমন একটি ম্যাপ যা ব্যবহারকারীরা নাড়াচাড়া করতে, জুম ইন ও আউট করতে এবং বিভিন্ন স্থান ও দর্শনীয় স্থান সম্পর্কে বিস্তারিত তথ্য পেতে পারে—কয়েক লাইনের কোডের মাধ্যমেই করা সম্ভব।
প্রথমত, আপনাকে পেজটিতে ম্যাপস জাভাস্ক্রিপ্ট এপিআই (Maps JavaScript API) অন্তর্ভুক্ত করতে হবে। এটি করার জন্য আপনার এইচটিএমএল (HTML) পেজে নিম্নলিখিত স্ক্রিপ্টটি লিঙ্ক করতে হবে এবং এর সাথে libraries=marker যুক্ত করতে হবে, যাতে আপনি ম্যাপে উন্নত মার্কার যোগ করতে পারেন।
<script defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=marker&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a"></script> ইউআরএলটি জাভাস্ক্রিপ্টের initMap ফাংশনটিকে নির্দেশ করে, যা পেজ লোড হওয়ার সময় চলে। ইউআরএল-এ আপনি আপনার ম্যাপের ভাষা বা অঞ্চলও নির্ধারণ করতে পারেন, যাতে আপনার নির্দিষ্ট দেশের জন্য এটি সঠিক বিন্যাসে বিন্যস্ত হয়। অঞ্চল নির্ধারণ করলে এটাও নিশ্চিত হয় যে, মার্কিন যুক্তরাষ্ট্রের বাইরে ব্যবহৃত অ্যাপগুলোর আচরণ আপনার সেট করা অঞ্চলের দিকেই বেশি ঝুঁকে থাকবে। সমর্থিত ভাষা ও অঞ্চলের সম্পূর্ণ তালিকার জন্য গুগল ম্যাপস প্ল্যাটফর্ম কভারেজ ডিটেইলস দেখুন এবং region প্যারামিটারের ব্যবহার সম্পর্কে আরও জানুন।
এরপরে, পেজে আপনার ম্যাপটি রাখার জন্য একটি HTML div প্রয়োজন হবে। এখানেই ম্যাপটি প্রদর্শিত হবে।
<div id="map"></div>
পরবর্তী ধাপ হলো আপনার ম্যাপের মৌলিক কার্যকারিতা সেট করা। এটি স্ক্রিপ্ট URL-এ নির্দিষ্ট করা initMap স্ক্রিপ্ট ফাংশনে করা হয়। নিম্নলিখিত উদাহরণে দেখানো এই স্ক্রিপ্টে, আপনি প্রাথমিক অবস্থান, একটি ম্যাপ আইডি (অ্যাডভান্সড মার্কার এবং ক্লাউড-ভিত্তিক ম্যাপ স্টাইলিংয়ের জন্য প্রয়োজনীয়), ম্যাপের ধরন এবং আপনার ব্যবহারকারীদের জন্য ম্যাপে কোন কন্ট্রোলগুলো উপলব্ধ থাকবে তা সেট করতে পারেন। লক্ষ্য করুন যে, getElementById() পূর্ববর্তী উদাহরণে "map" div ID-কে রেফারেন্স করে।
function initMap() { const map = new google.maps.Map(document.getElementById("map"), { zoom: 12, center: { lat: 51.485925, lng: -0.129500 }, mapId: "DEMO_MAP_ID", zoomControl: false }); }
একটি লোকেটারের ক্ষেত্রে, আপনি সাধারণত প্রাথমিক অবস্থান, কেন্দ্রবিন্দু বা সীমানা এবং জুম লেভেল (মানচিত্রটি সেই অবস্থানে কতটা জুম করা হবে) নির্ধারণ করতে আগ্রহী হন। কন্ট্রোল টিউনিং-এর মতো অন্যান্য বেশিরভাগ উপাদান ঐচ্ছিক, কারণ আপনিই মানচিত্রের সাথে মিথস্ক্রিয়ার মাত্রা নির্ধারণ করেন।
স্থান আইডি পাওয়া
| এই উদাহরণে ব্যবহৃত হয়েছে: প্লেসেস এপিআই (নতুন) | এছাড়াও উপলব্ধ: জাভাস্ক্রিপ্ট |
সম্ভবত আপনার কাছে আপনার অবস্থানগুলির একটি ডেটাবেস থাকবে, যেখানে সেই অবস্থানের নাম, ঠিকানা এবং ফোন নম্বরের মতো মৌলিক তথ্য থাকবে। Google Maps Platform-এর কাছে সেই জায়গাটি সম্পর্কে থাকা তথ্য, যার মধ্যে ভৌগোলিক স্থানাঙ্ক এবং ব্যবহারকারীর দেওয়া তথ্য অন্তর্ভুক্ত, তা পেতে আপনার ডেটাবেসের প্রতিটি অবস্থানের সাথে সম্পর্কিত প্লেস আইডি (place ID) খুঁজুন। আপনি Places API (New)-এর Text Search (New) এন্ডপয়েন্টে একটি কল করতে পারেন এবং ফিল্ড মাস্কে (field mask) শুধুমাত্র places.id ফিল্ডটির জন্য অনুরোধ করতে পারেন (যা Text Search Essentials IDs Only SKU-কে সক্রিয় করে)। এখানে Google লন্ডন অফিসের জন্য প্লেস আইডি অনুরোধ করার একটি উদাহরণ দেওয়া হলো:
curl -X POST -d '{
"textQuery" : "Google London"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: places.id' \
'https://places.googleapis.com/v1/places:searchText'আপনি এই স্থান আইডিটি আপনার ডেটাবেসে সংরক্ষণ করতে পারেন এবং স্থানটি সম্পর্কে তথ্য অনুরোধ করার একটি কার্যকর উপায় হিসেবে এটি ব্যবহার করতে পারেন। স্থান আইডি ব্যবহার করে জিওকোড করতে, স্থানের বিবরণ পুনরুদ্ধার করতে এবং স্থানটিতে যাওয়ার দিকনির্দেশনা অনুরোধ করার জন্য নিম্নলিখিত নির্দেশাবলী দেওয়া হলো।
আপনার অবস্থানগুলির জিওকোডিং
| এই উদাহরণে ব্যবহৃত হয়েছে: জিওকোডিং এপিআই | এছাড়াও উপলব্ধ: জাভাস্ক্রিপ্ট |
আপনার লোকেশন ডেটাবেসে যদি রাস্তার ঠিকানা থাকে কিন্তু ভৌগোলিক স্থানাঙ্ক না থাকে, তাহলে মানচিত্রে মার্কার স্থাপনের উদ্দেশ্যে সেই ঠিকানার অক্ষাংশ ও দ্রাঘিমাংশ পেতে জিওকোডিং এপিআই (Geocoding API) ব্যবহার করুন। আপনি সার্ভার সাইডে আপনার ঠিকানাগুলো জিওকোড করতে পারেন, অক্ষাংশ ও দ্রাঘিমাংশ আপনার ডেটাবেসে সংরক্ষণ করতে পারেন এবং প্রতি ৩০ দিন অন্তর তা রিফ্রেশ করতে পারেন ।
গুগল লন্ডন অফিসের জন্য প্রাপ্ত প্লেস আইডি-র অক্ষাংশ ও দ্রাঘিমাংশ বের করতে জিওকোডিং এপিআই ব্যবহারের একটি উদাহরণ নিচে দেওয়া হলো:
https://maps.googleapis.com/maps/api/geocode/json?place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU&key=YOUR_API_KEY&solution_channel=GMP_guides_locatorplus_v2_aমানচিত্রে অবস্থান যোগ করা
পরবর্তী ধাপ হলো মানচিত্রে আপনার অবস্থানগুলো যুক্ত করা। এটি সাধারণত মানচিত্রে অ্যাডভান্সড মার্কার যোগ করার মাধ্যমে করা হয়, যদিও ডেটা লেয়ারের মতো আরও বেশ কিছু বিকল্প রয়েছে যা আপনি ব্যবহার করতে পারেন।
একবার আপনার অবস্থানের অক্ষাংশ এবং দ্রাঘিমাংশ জানা হয়ে গেলে, মানচিত্রে একটি কাস্টম টেক্সট গ্লিফ সহ একটি অ্যাডভান্সড মার্কার যোগ করার একটি উদাহরণ নিচে দেওয়া হলো:
const pin = new google.maps.marker.PinElement({ glyphText: "A", }); const marker = new google.maps.marker.AdvancedMarkerElement({ map, position: { lat: 51.493073, lng: -0.146550 }, title: "Location Name", }); marker.append(pin);
কয়েকটি মার্কারের সাহায্যে আপনি একসাথে বেশ কয়েকটি স্থানের অবস্থান দেখতে পারেন।
অবস্থানের সংখ্যা অনেক বেশি হলে, আপনি জাভাস্ক্রিপ্ট , অ্যান্ড্রয়েড বা আইওএস-এর জন্য একটি মার্কার ক্লাস্টারিং ইউটিলিটি ব্যবহার করার কথা ভাবতে পারেন। এখানে জাভাস্ক্রিপ্ট স্টোর লোকেটর গিটহাব স্যাম্পলে মার্কার ক্লাস্টারিং-এর একটি উদাহরণ দেওয়া হলো ।
স্থানের বিবরণ প্রদান করা
| এই উদাহরণে ব্যবহৃত হয়েছে: Maps JavaScript API | এছাড়াও উপলব্ধ: প্লেসেস এপিআই (নতুন) | অ্যান্ড্রয়েড | আইওএস |
আপনার কোনো একটি লোকেশনে যাওয়ার আগে ব্যবহারকারীদের যে স্থান-সম্পর্কিত বিবরণ জানা প্রয়োজন, তা আপনি শেয়ার করতে পারেন। যোগাযোগের তথ্য, খোলার সময়, ব্যবহারকারীর রেটিং, ব্যবহারকারীর ছবি এবং সাময়িক বন্ধ থাকার স্থিতির মতো বিস্তারিত তথ্যের মাধ্যমে, আপনার ব্যবহারকারীরা আপনার লোকেশনে গেলে ঠিক কী আশা করতে পারেন, তা জানতে পারবেন। প্লেসেস এপিআই (নতুন)-এ কল করার পর, আপনি প্রাপ্ত রেসপন্সটি একটি ইনফো উইন্ডোতে, একটি ওয়েব সাইডবারে বা আপনার পছন্দমতো অন্য যেকোনো উপায়ে ফিল্টার ও রেন্ডার করতে পারেন।
স্থানের বিবরণ অনুরোধ করতে, আপনার প্রতিটি অবস্থানের স্থান আইডি প্রয়োজন হবে। আপনার অবস্থানের স্থান আইডি পুনরুদ্ধার করতে ‘স্থান আইডি সংগ্রহ’ দেখুন।
স্থানের বিবরণ অনুরোধ করার ভিডিওগুলো দেখতে প্রসারিত করুন:
খোলার সময় জানুন
চেক বন্ধ
খরচ নিয়ন্ত্রণ করুন
নিম্নলিখিত উদাহরণটি Maps JavaScript API-এর Places লাইব্রেরির Place ক্লাস ব্যবহার করে স্থানের বিবরণ পুনরুদ্ধার করে এবং সেগুলিকে একটি InfoWindow-তে যুক্ত করে। এই বাস্তবায়নটি ব্যবহারকারীর আগ্রহ নির্বিশেষে সমস্ত অবস্থানের বিবরণ আগে থেকেই সংগ্রহ করার পরিবর্তে, শুধুমাত্র যখন ব্যবহারকারী মার্কারটিতে ক্লিক করে বিবরণের জন্য অনুরোধ করেন, তখনই স্থানের বিবরণের জন্য অনুরোধটি ট্রিগার করার ব্যয়-সাশ্রয়ী কৌশলটি ব্যবহার করে।
const marker = new google.maps.marker.AdvancedMarkerElement({ map, position: { lat: 51.493073, lng: -0.14655 }, gmpClickable: true, }); const place = new google.maps.places.Place({ id: "ChIJVSZzVR8FdkgRTyQkxxLQmVU", }); const infowindow = new google.maps.InfoWindow(); marker.addEventListener("gmp-click", async () => { await place.fetchFields({ fields: ["displayName", "formattedAddress", "rating", "websiteURI"], }); infowindow.setContent( "<div><strong>" + place.displayName + "</strong><br>" + place.formattedAddress + "<br>" + "Rating: " + place.rating + " stars<br>" + place.websiteURI + "</div>" ); infowindow.open({ map, anchor: marker, }); });
৪৫° কোণ থেকে অবস্থানগুলি দেখানো হচ্ছে
| এই উদাহরণে ব্যবহৃত হয়েছে: Maps JavaScript API | এছাড়াও উপলব্ধ: অ্যান্ড্রয়েড | আইওএস |
ব্যবহারকারীদের আপনার অবস্থানের একটি আকাশ থেকে তোলা দৃশ্য দেখালে, সেটি দেখতে কেমন তা সম্পর্কে তারা একটি স্পষ্ট ধারণা পায়, যা তাদের জায়গাটি খুঁজে পেতে সাহায্য করে। যখন কোনো ব্যবহারকারী আরও বিস্তারিত দেখার জন্য একটি নির্দিষ্ট অবস্থান নির্বাচন করেন, তখন আপনি সেই অবস্থানে জুম করে ৪৫° কোণ থেকে উপলব্ধ স্যাটেলাইট চিত্র প্রদর্শন করতে পারেন।
নিম্নলিখিত কোড নমুনাটি ম্যাপটিকে একটি উচ্চ জুম লেভেল, একটি সামঞ্জস্যপূর্ণ ম্যাপ টাইপ এবং এমন একটি টিল্ট অ্যাঙ্গেলে সেট করে, যা উপলব্ধ থাকলে ৪৫° চিত্রাবলী প্রদর্শন করবে। ৪৫° চিত্রাবলীর প্রাপ্যতা সম্পর্কে বিস্তারিত ডকুমেন্টেশনে ব্যাখ্যা করা হয়েছে।
function seeDetail(location) {
map.setCenter(location);
map.setZoom(19);
map.setMapTypeId(google.maps.MapTypeId.HYBRID);
map.setTilt(45);
}মূল মানচিত্র দৃশ্যে রিসেট করা হচ্ছে
ব্যবহারকারীরা প্রায়শই একটি নির্দিষ্ট স্থানের বিস্তারিত দৃশ্য এবং কাছাকাছি কয়েকটি স্থানের সংক্ষিপ্ত দৃশ্যের মধ্যে দ্রুত পরিবর্তন করতে চান। এই কাজটি সহজ করার জন্য, একটি লিসেনার যোগ করুন যা শনাক্ত করবে কখন ব্যবহারকারী ম্যাপ ইন্টারঅ্যাকশনের সময় বা লিস্ট ভিউতে বিস্তারিত দৃশ্য থেকে বেরিয়ে যাচ্ছেন। উদাহরণস্বরূপ, map অবজেক্টে zoom_changed ইভেন্টটি লিসেন করলে বোঝা যায় যে ব্যবহারকারী হয় বিস্তারিত দৃশ্য থেকে নিজে থেকে জুম আউট করেছেন অথবা এমন কোনো ফাংশন কল করেছেন যা জুম লেভেল আপডেট করেছে। এই উদাহরণে, জুম আউট করলে ম্যাপটি তার আসল ম্যাপ টাইপ এবং টিল্টে রিসেট হয়ে যায়।
let originalMapTypeId = google.maps.MapTypeId.ROADMAP; map.addListener("zoom_changed", () => { const newZoom = map.getZoom()!; if (newZoom < 19) { map.setTilt(0); map.setMapTypeId(originalMapTypeId); } });
আপনার ব্যবহারকারীর অবস্থান শনাক্ত করা
| এই উদাহরণে ব্যবহৃত হয়েছে: Maps JavaScript API | এছাড়াও উপলব্ধ: অ্যান্ড্রয়েড | আইওএস |
যেকোনো লোকেটারের পরবর্তী গুরুত্বপূর্ণ উপাদান হলো আপনার ব্যবহারকারীর শুরুর অবস্থান শনাক্ত করা। ডিফল্টরূপে, আপনি ব্যবহারকারীর বর্তমান অবস্থানকে উৎস হিসেবে সেট করার জন্য অনুমতি চাইতে মোবাইল লোকেশন সার্ভিস এবং ওয়েব ব্রাউজার জিওলোকেশন ব্যবহার করতে পারবেন। তবে, ব্যবহারকারী সেই অনুমতিগুলো প্রত্যাখ্যান করতে পারেন অথবা তাদের শুরুর স্থান হিসেবে একটি ভিন্ন অবস্থান সেট করতে চাইতে পারেন।
আজকের ব্যবহারকারীরা গুগল ম্যাপসের কনজিউমার ভার্সনের অটোকমপ্লিট টাইপ-এহেড কার্যকারিতায় অভ্যস্ত। মোবাইল ডিভাইস এবং ওয়েবে গুগল ম্যাপস প্ল্যাটফর্ম প্লেসেস লাইব্রেরি ব্যবহার করে এই কার্যকারিতাটি যেকোনো অ্যাপ্লিকেশনে ইন্টিগ্রেট করা যায়। যখন কোনো ব্যবহারকারী একটি ঠিকানা টাইপ করেন, তখন অটোকমপ্লিট উইজেট ব্যবহারের মাধ্যমে বাকি অংশ পূরণ করে দেয়। এছাড়াও আপনি সরাসরি প্লেস অটোকমপ্লিট ডেটা এপিআই (Place Autocomplete Data API) ব্যবহার করে আপনার নিজস্ব অটোকমপ্লিট কার্যকারিতা প্রদান করতে পারেন।
আপনার সাইটে প্লেস অটোকমপ্লিট লাইব্রেরি যোগ করার জন্য শুধু ম্যাপস জাভাস্ক্রিপ্ট এপিআই স্ক্রিপ্ট ইউআরএল-এ কয়েকটি কোয়েরি প্যারামিটার যোগ করতে হবে। নিচের উদাহরণে, যোগ করা হয়েছে libraries=places,marker ।
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places,marker&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a" defer></script>এরপরে, আপনার পেজে একটি কন্টেইনার এলিমেন্ট যোগ করুন যেখানে PlaceAutocompleteElement উইজেটটি যুক্ত করা হবে।
<div id="autocomplete-container"></div>
অবশেষে, PlaceAutocompleteElement উইজেটটি ইনিশিয়ালাইজ করুন এবং এটিকে কন্টেইনারে যুক্ত করুন। includedPrimaryTypes: ["geocode"] দিয়ে Place Autocomplete প্রেডিকশনগুলোকে সীমাবদ্ধ করলে উইজেটটি রাস্তার ঠিকানা, এলাকা, শহর এবং জিপ কোড গ্রহণ করার জন্য কনফিগার হয়, ফলে ব্যবহারকারীরা তাদের উৎস বর্ণনা করার জন্য যেকোনো মাত্রার সুনির্দিষ্টতা ইনপুট করতে পারেন। যখন একজন ব্যবহারকারী একটি প্রেডিকশন নির্বাচন করেন, তখন gmp-select ইভেন্টটি ফায়ার হয় এবং আপনি ব্যবহারকারীর উৎসের অক্ষাংশ ও দ্রাঘিমাংশ সম্বলিত location ফিল্ডটি অনুরোধ করার জন্য place.fetchFields() কল করতে পারেন। আপনি এই ম্যাপ কোঅর্ডিনেটগুলো ম্যাপকে পুনরায় কেন্দ্রে আনতে এবং উৎসের সাথে আপনার লোকেশনগুলোর সম্পর্ক নির্দেশ করতে ব্যবহার করবেন।
// Create the PlaceAutocompleteElement, restricting predictions to // geographical location types in the United Kingdom. const placeAutocomplete = new google.maps.places.PlaceAutocompleteElement({ includedPrimaryTypes: ["geocode"], includedRegionCodes: ["gb"], }); placeAutocomplete.placeholder = "Enter starting address, city, or zip code"; document.getElementById("autocomplete-container").appendChild(placeAutocomplete); // When the user selects an address from the drop-down, // zoom to the selected location and add an advanced marker. placeAutocomplete.addEventListener("gmp-select", async ({ placePrediction }) => { const place = placePrediction.toPlace(); await place.fetchFields({ fields: ["location", "formattedAddress"], }); addUserLocation(place); }); }
এই উদাহরণে, ব্যবহারকারী ঠিকানা নির্বাচন করার পর addUserLocation() ফাংশনটি কার্যকর হয়। এটি মিলে যাওয়া ফলাফলের অবস্থান গ্রহণ করে, মানচিত্রটিকে সেই অবস্থানে নিয়ে যায় এবং একটি অ্যাডভান্সড মার্কার যোগ করে।
function addUserLocation(place) { const pin = new google.maps.marker.PinElement({ glyphText: "C", }); // Add an advanced marker to the map. const marker = new google.maps.marker.AdvancedMarkerElement({ map, position: place.location, }); marker.append(pin); // Pan and zoom the map to the marker. map.panTo(place.location); map.setZoom(12); }
এরপর আপনি ব্যবহারকারী এবং যেকোনো নির্দিষ্ট অবস্থানের মধ্যকার সম্পর্ক দেখতে পারবেন, যা নিচের ছবিতে দেখানো হয়েছে।
আপনার অ্যাপে প্লেস অটোকমপ্লিট যোগ করার ভিডিও টিউটোরিয়াল দেখতে এটি প্রসারিত করুন:
ওয়েবসাইট
অ্যান্ড্রয়েড অ্যাপস
iOS অ্যাপস
নিকটতম স্থানগুলিতে ভ্রমণের সময় এবং দূরত্ব দেখানো হচ্ছে
| এই উদাহরণে ব্যবহৃত হয়েছে: রাউটস এপিআই | এছাড়াও উপলব্ধ: রাউটস লাইব্রেরি, ম্যাপস জাভাস্ক্রিপ্ট এপিআই |
একবার আপনি ব্যবহারকারীর অবস্থান পেয়ে গেলে, সেটিকে আপনার নিজের অবস্থানগুলোর সাথে তুলনা করতে পারেন। Routes API-এর Compute Route Matrix ফিচারটি (অথবা Maps JavaScript API-এর Routes লাইব্রেরির RouteMatrix ক্লাস ) ব্যবহার করে এটি করলে, আপনার ব্যবহারকারীরা গাড়িতে যাতায়াতের সময় বা রাস্তার দূরত্বের ভিত্তিতে তাদের জন্য সবচেয়ে সুবিধাজনক অবস্থানটি বেছে নিতে পারবেন।
কোনো ব্যবহারকারীর কাছাকাছি অবস্থান দেখানো থেকে বোঝা যায় যে আপনার কাছে আগে থেকেই অবস্থানের তথ্য রয়েছে। আপনার নিজস্ব অবস্থানের ডেটাবেস ব্যবহার করার সময়, মূল বিষয় হলো ডেটা এমন একটি ফরম্যাটে আছে কিনা তা নিশ্চিত করা যা মানচিত্রে ব্যবহার করা যায়, যেমন GeoJSON, যা 'ডেটা লেয়ার' বিষয়ে বর্ণনা করা হয়েছে।
অবস্থানের তালিকা সাজানোর প্রচলিত পদ্ধতি হলো দূরত্ব অনুসারে সেগুলোকে সাজানো। প্রায়শই এই দূরত্ব একজন ব্যবহারকারী থেকে অবস্থান পর্যন্ত সরলরেখা টেনে গণনা করা হয়, কিন্তু এটি বিভ্রান্তিকর হতে পারে। সরলরেখাটি হয়তো কোনো দুর্গম নদীর উপর দিয়ে বা ব্যস্ত রাস্তার মধ্যে দিয়ে যেতে পারে, এমন সময়ে যখন অন্য কোনো অবস্থান বেশি সুবিধাজনক হতে পারে। যখন আপনার কয়েক কিলোমিটারের মধ্যে একাধিক অবস্থান থাকে, তখন এই বিষয়টি গুরুত্বপূর্ণ।
computeRouteMatrix মেথডটি উৎস এবং গন্তব্যস্থলের একটি তালিকা গ্রহণ করে এবং তাদের মধ্যেকার ভ্রমণের দূরত্বের পাশাপাশি ভ্রমণের সময়ও ফেরত দেয়। একজন ব্যবহারকারীর ক্ষেত্রে, উৎসস্থল হবে তার বর্তমান অবস্থান বা তার পছন্দের শুরুর স্থান, এবং গন্তব্যস্থলগুলো হবে সেই অবস্থানগুলো। উৎস এবং গন্তব্যস্থল স্থানাঙ্ক জোড়া, স্থান আইডি বা ঠিকানা হিসাবে নির্দিষ্ট করা যেতে পারে। বর্তমান বা ভবিষ্যতের ড্রাইভিং সময়ের উপর ভিত্তি করে ফলাফল দেখানোর জন্য আপনি TRAFFIC_AWARE এর মতো রাউটিং প্রেফারেন্সের সাথে computeRouteMatrix ব্যবহার করতে পারেন।
নিম্নলিখিত উদাহরণটি ব্যবহারকারীর উৎস এবং গন্তব্য স্থানের আইডি উল্লেখ করে Routes API-এর computeRouteMatrix এন্ডপয়েন্টকে কল করে। এই উদাহরণটি মানচিত্রের কেন্দ্র থেকে লন্ডনে অবস্থিত তিনটি গুগল অফিসের দূরত্ব এবং ভ্রমণের সময়কাল গণনা করে:
curl -X POST -d '{
"origins": [
{
"waypoint": {
"location": {
"latLng": {
"latitude": 51.493490,
"longitude": -0.097288
}
}
}
}
],
"destinations": [
{
"waypoint": {
"placeId": "ChIJVSZzVR8FdkgRTyQkxxLQmVU"
}
},
{
"waypoint": {
"placeId": "ChIJVSZzVR8FdkgR-HklrBMO0Hc"
}
},
{
"waypoint": {
"placeId": "ChIJ4abvVDwbdkgRDZVFR7A6Bcc"
}
}
],
"travelMode": "DRIVE",
"routingPreference": "TRAFFIC_AWARE"
}' \
-H 'Content-Type: application/json' \
-H 'X-Goog-Api-Key: YOUR_API_KEY' \
-H 'X-Goog-FieldMask: originIndex,destinationIndex,duration,distanceMeters,status,condition' \
'https://routes.googleapis.com/distanceMatrix/v2:computeRouteMatrix'সার্ভিস থেকে প্রাপ্ত রেসপন্সে প্রতিটি উৎস এবং গন্তব্য জোড়ার জন্য দূরত্ব (মিটারে) এবং সময়কাল থাকে, যা নিম্নলিখিত উদাহরণে দেখানো হয়েছে তার অনুরূপ:
নমুনা প্রতিক্রিয়া দেখতে প্রসারিত করুন:
[
{
"originIndex": 0,
"destinationIndex": 0,
"status": {},
"distanceMeters": 4540,
"duration": "924s",
"condition": "ROUTE_EXISTS"
},
{
"originIndex": 0,
"destinationIndex": 1,
"status": {},
"distanceMeters": 5043,
"duration": "1044s",
"condition": "ROUTE_EXISTS"
},
{
"originIndex": 0,
"destinationIndex": 2,
"status": {},
"distanceMeters": 6919,
"duration": "1357s",
"condition": "ROUTE_EXISTS"
}
]নিচের ছবিতে একটি মানচিত্রে উৎস (লাল চিহ্নিতকারী C) এবং গন্তব্যস্থলগুলো দেখানো হয়েছে:
সরলরৈখিক দূরত্ব এবং পথের দূরত্ব প্রায়শই ভিন্ন হয়, যেমনটি নিম্নলিখিত সারণিতে দেখানো হয়েছে।
| অবস্থান | সরল দূরত্ব | রাস্তায় যানজট / সময় |
|---|---|---|
| অবস্থান A | ৩.৩২ কিমি | ৪.৫ কিমি / ১৫ মিনিট |
| অবস্থান বি | ৩.২০ কিমি | ৫.০ কিমি / ১৭ মিনিট |
| অবস্থান C | ৪.৮৪ কিমি | ৬.৯ কিমি / ২৩ মিনিট |
যদিও দূরত্ব অনুযায়ী স্থান B সবচেয়ে কাছে, সেখানে পৌঁছানোর পথ ও সময় বেশি লাগে, কারণ স্থান A-তে একটি মহাসড়ক দিয়ে যাওয়া যায়।
এই অনুরোধটি করার পরে, আপনি গাড়ি চালানোর সময়কাল অনুসারে প্রতিক্রিয়াগুলিকে সাজানোর জন্য ম্যাচটি প্রক্রিয়া করতে পারেন। এই ধরনের ফাংশনের উদাহরণ আপনি লোকেটর কোডল্যাবে খুঁজে পেতে পারেন।
নেভিগেশন দিকনির্দেশনা প্রদান করা
| এই উদাহরণটিতে ব্যবহৃত হয়েছে: রাউটস লাইব্রেরি, ম্যাপস জাভাস্ক্রিপ্ট এপিআই | এছাড়াও উপলব্ধ: অ্যান্ড্রয়েড এবং আইওএস-এ ব্যবহারের জন্য রাউটস এপিআই ওয়েব পরিষেবা, যা সরাসরি অ্যাপ্লিকেশন থেকে অথবা দূরবর্তীভাবে একটি সার্ভার প্রক্সির মাধ্যমে ব্যবহার করা যায়। |
আপনার সাইট বা অ্যাপ্লিকেশনের ভেতর থেকেই ব্যবহারকারীদের দিকনির্দেশনা দেখানোর অর্থ হলো, তাদের আপনার সাইট থেকে অন্য কোথাও যাওয়ার প্রয়োজন হয় না। এর ফলে ব্যবহারকারীরা অন্য পেজ দেখে বিভ্রান্ত হন না বা ম্যাপে প্রতিযোগীদের দেখতে পান না। Routes API-এর মাধ্যমে, আপনি জ্বালানি বা শক্তির ব্যবহার অনুমান করতে এবং একটি যাত্রার পরিবেশগত প্রভাব দেখানোর জন্য পরিবেশ-বান্ধব রুটের অনুরোধও করতে পারেন।
Maps JavaScript API-এর Routes লাইব্রেরির Route ক্লাসেও createPolylines() এবং createWaypointAdvancedMarkers() এর মতো মেথড রয়েছে, যেগুলো আপনাকে ফলাফলগুলো প্রসেস করতে এবং একটি ম্যাপে প্রদর্শন করতে দেয়।
নিচে মানচিত্রে একটি পথের অনুরোধ ও তা প্রদর্শনের একটি উদাহরণ দেওয়া হলো। নমুনাটি সম্পর্কে আরও তথ্যের জন্য, ‘একটি পথ পান’ দেখুন।
এই Maps ফিচারগুলো সম্পর্কে আরও জানতে, Maps JavaScript API ডকুমেন্টেশন পড়ুন অথবা একটি লোকেটর তৈরি করার জন্য ধাপে ধাপে কোডল্যাবটি দেখুন।
ব্যবহারকারীদের অ্যাপয়েন্টমেন্ট বুক করতে সাহায্য করা
ব্যবহারকারীরা যখন একটি সাইড প্যানেলে আপনার অবস্থানের 'স্থানের বিবরণ' দেখেন, তখন আপনি একটি বোতামে ক্লিক করে অ্যাপয়েন্টমেন্ট বুক করার সুবিধা দিতে পারেন, যা নিম্নলিখিত চিত্রে দেখানো হয়েছে।
এটি সক্রিয় করার একাধিক উপায় রয়েছে: (১) কুইক বিল্ডার লোকেটর প্লাস সলিউশন ব্যবহার করে এই কার্যকারিতাটি স্বয়ংক্রিয়ভাবে প্রদান করা, এবং (২) আপনার বিজনেস প্রোফাইল ব্যবহার করা। এই বিভাগে এই বিকল্পগুলি বিস্তারিতভাবে বর্ণনা করা হয়েছে।
কুইক বিল্ডার লোকেটর প্লাস ব্যবহার করুন
আপনি আপনার বিজনেস প্রোফাইল থেকে ব্যবসার বিবরণ দ্রুত ইম্পোর্ট করতে কুইক বিল্ডার লোকেটর প্লাস সলিউশনটি ব্যবহার করতে পারেন। কুইক বিল্ডার টুলে ইম্পোর্ট করার পর, আপনি রিজার্ভ উইথ গুগল ব্যবহার করে আপনার ব্যবসার লোকেশনগুলোর জন্য এমবেডেড অ্যাপয়েন্টমেন্ট বুকিং লিঙ্ক (যেখানে উপলব্ধ) সক্রিয় করতে পারেন। এমনকি যদি আপনার গুগল অ্যাকাউন্টের সাথে যুক্ত কোনো বিজনেস প্রোফাইল নাও থাকে, তবুও আপনি কুইক বিল্ডার ব্যবহার করে সেইসব ব্যবসার জন্য বুকিং লিঙ্ক এমবেড করতে পারবেন, যেগুলো আপনি রিজার্ভ উইথ গুগল*-এর মাধ্যমে থার্ড-পার্টি বুকিং প্রোভাইডারদের সাথে আগে থেকেই সক্রিয় করেছেন।
‘রিজার্ভ উইথ গুগল’ শুধুমাত্র নির্দিষ্ট কিছু দেশ/অঞ্চলে উপলব্ধ, যেখানে ব্যবসাগুলো একটি সমর্থিত বুকিং প্রোভাইডারের সাথে কাজ করে। আপনি যদি ‘রিজার্ভ উইথ গুগল’-এ আগ্রহী হন, কিন্তু কোনো ‘রিজার্ভ উইথ গুগল’ পার্টনারের সাথে কাজ না করেন, তবে আপনার প্রোভাইডারকে এই আগ্রহ ফর্মটি পূরণ করে তাদের আগ্রহ জমা দিতে বলুন এবং তারা কীভাবে শুরু করতে পারে তা দেখতে আমাদের ডকুমেন্টেশন পর্যালোচনা করুন। আপনি যদি ইতিমধ্যে কোনো বুকিং প্রোভাইডারের সাথে কাজ না করেন, তবে আপনি ‘বিজনেস প্রোফাইল ম্যানেজার’- এর মধ্যে থাকা ‘বুকিংস’ বিভাগে যোগ্য প্রোভাইডারদের দেখতে পারেন।
অ্যাপয়েন্টমেন্ট বুকিং সক্ষম করতে ব্যবসায়িক প্রোফাইল ব্যবহার করুন।
যখন আপনি বিজনেস প্রোফাইল ব্যবহার করে আপনার অনলাইন উপস্থিতি পরিচালনা করেন, তখন আপনার তৈরি করা ব্যবসার অবস্থানগুলো গুগল ম্যাপস প্ল্যাটফর্মের প্লেস আইডি-র সাথে যুক্ত হয়ে যায়, যা ব্যবসার তথ্যের সাথে সমন্বিত ম্যাপিং কার্যকারিতা সক্ষম করে।
বিজনেস প্রোফাইল এপিআই আপনাকে অ্যাপয়েন্টমেন্ট বুকিং-এর মতো অ্যাকশন তৈরি করার সুযোগ দেয়, যা আপনি আপনার অ্যাপে গ্রহণ ও প্রদর্শন করতে পারেন, কিন্তু এটি সক্রিয় করার জন্য কিছু ম্যানুয়াল পদক্ষেপের প্রয়োজন হয়, যা নিচে বর্ণনা করা হলো।
ব্যবহারকারীরা যখন সাইড প্যানেলে আপনার কোনো একটি শাখার বিবরণ দেখেন, তখন আপনি তাদের অ্যাপয়েন্টমেন্ট করার জন্য একটি লিঙ্ক দিতে পারেন। এই বিভাগে তা কীভাবে করতে হয়, তা বর্ণনা করা হয়েছে।
APPOINTMENT,ONLINE_APPOINTMENT, বাDINING_RESERVATIONটাইপের লোকেশনের জন্য একটি বিজনেস প্রোফাইল এপিআইplaceActionLinkতৈরি করুন। এইplaceActionLinkহবে সেই অবজেক্ট যা আপনি সাইড প্যানেলে অ্যাপয়েন্টমেন্ট লিঙ্কের জন্য ব্যবহার করবেন। (যদি আপনি আপনার কাঙ্ক্ষিত অ্যাপয়েন্টমেন্ট অ্যাকশন লিঙ্কটি ইতিমধ্যেই তৈরি করে থাকেন, তবে পরবর্তী ধাপে চলে যান।) একটি সফলplaceActionLinks.createPOST অপারেশনের একটি উদাহরণ প্রতিক্রিয়া নিচে দেওয়া হলো:{ "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc", "providerType": "MERCHANT", "isEditable": true, "uri": "https://example.com/reservation-uri", "placeActionType": "DINING_RESERVATION", "createTime": "2021-05-01T01:17:41.609161Z", "updateTime": "2021-05-01T01:17:41.609161Z" }গুগল ম্যাপস প্ল্যাটফর্ম প্লেস আইডির সাথে যুক্ত বিজনেস প্রোফাইলের অবস্থানটি খুঁজুন।
যখন ব্যবহারকারীরা স্থানের বিবরণ দেখেন, তখন তারা একটি গুগল ম্যাপস প্ল্যাটফর্ম প্লেস আইডির বিবরণ দেখেন। প্লেস আইডিটি একটি বিজনেস প্রোফাইল লোকেশন আইডির সাথে যুক্ত থাকে, তাই আপনার তৈরি করা অ্যাপয়েন্টমেন্ট-বুকিং লিঙ্কটি পুনরুদ্ধার এবং প্রদর্শন করার জন্য আপনাকে ম্যাপ প্লেস আইডির উপর ভিত্তি করে লোকেশন আইডিটি খুঁজে বের করতে হবে। নিম্নলিখিত বিজনেস প্রোফাইল এপিআই কলগুলো করুন:
- আপনার প্রকল্পের অ্যাকাউন্টগুলোর তালিকা করুন ।
- একটি অ্যাকাউন্টের অন্তর্গত সমস্ত অবস্থান তালিকাভুক্ত করুন ।
- অ্যাকাউন্ট লোকেশনগুলোতে থাকা
LocationKeyতে গুগল ম্যাপস প্ল্যাটফর্মের প্লেস আইডি থাকে, যা আপনি দেখা লোকেশনটির প্লেস আইডির সাথে তুলনা করতে পারেন।
লোকেশন আইডি ব্যবহার করে আপনি আপনার কাঙ্ক্ষিত অ্যাকশন লিঙ্কটি পেতে পারেন। একটি বিদ্যমান অ্যাপয়েন্টমেন্ট
placeActionLinkপুনরুদ্ধার করতে, লোকেশনটির জন্য বিদ্যমানplaceActionLinksতালিকা দেখুন এবং আপনার ব্যবহার করতে চাওয়া অ্যাপয়েন্টমেন্ট লিঙ্কটি (APPOINTMENT,ONLINE_APPOINTMENT, বাDINING_RESERVATION) খুঁজে পেতেplaceActionTypeঅনুযায়ী ফিল্টার করুন।নিম্নলিখিত উদাহরণটি LIST কলের প্রতিক্রিয়াতে একটি APPOINTMENT
placeActionLinkদেখাচ্ছে।{ "placeActionLinks": [ { "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc", "providerType": "MERCHANT", "isEditable": true, "uri": "https://example.com/", "placeActionType": "APPOINTMENT", "createTime": "2021-05-01T01:17:41.609161Z", "updateTime": "2021-05-01T01:17:41.609161Z" } ] }- সাইড প্যানেলে
placeActionLinkঅবজেক্ট থেকে প্রাসঙ্গিক ডেটা, বিশেষ করে অ্যাপয়েন্টমেন্ট বুকিং লিঙ্কের URI দিয়ে একটি<div>তৈরি ও পূরণ করুন।
অ্যাপয়েন্টমেন্ট লিঙ্ক যোগ করার জন্য অন্যান্য বিকল্প
যদি আপনি কোনো বিজনেস প্রোফাইল পরিচালনা না করেন, অথবা কুইক বিল্ডার লোকেটর প্লাস সলিউশনটি ব্যবহার করতে না চান, তাহলে কোনো ওয়েবসাইট বা অ্যাপে বুকিং উইজেট যুক্ত করার বিষয়ে আপনার অ্যাপয়েন্টমেন্ট বুকিং প্ল্যাটফর্মের ডকুমেন্টেশন দেখে নিন। আরেকটি বিকল্প হলো গুগল ক্লাউড ব্যবহার করা, যেমন ইনভেন্টরি ম্যানেজমেন্টের জন্য ক্লাউড স্প্যানার (ভিডিও)।
স্থানীয় অফারগুলি প্রদর্শন করা হচ্ছে
কোনো অবস্থানের 'প্লেস ডিটেইলস' সাইড প্যানেলে, আপনি ব্যবহারকারীদের ক্লিক করার জন্য স্থানীয় অফারগুলো দেখাতে পারেন। গুগল মাই বিজনেস এপিআই আপনাকে আপনার অবস্থানগুলোর সাথে যুক্ত 'পোস্ট' (যেমন স্থানীয় অফার) তৈরি এবং পুনরুদ্ধার করার সুযোগ দেয়। নিচের চিত্রে 'প্লেস ডিটেইলস' সাইড প্যানেলে একটি স্থানীয় অফারের উদাহরণ দেখানো হয়েছে।
( কুইক বিল্ডার বিভাগের স্থাপত্য নকশাটি আপনার লোকেটার-এ অফার যোগ করার জন্য উপলব্ধ প্রযুক্তিগুলো দেখায়।)
যেহেতু স্থানীয় অফারগুলি অবস্থানের সাথে যুক্ত থাকে, তাই ব্যবহারকারীরা যে অবস্থানটি দেখছেন, তার জন্য আপনাকে Google Maps Platform প্লেস আইডির সাথে যুক্ত বিজনেস প্রোফাইল লোকেশন আইডিটি খুঁজে বের করতে হবে। যখন আপনার কাছে বিজনেস প্রোফাইল লোকেশন আইডিটি থাকবে, তখন আপনি আপনার প্লেস ডিটেইলস সাইড প্যানেলে দেখানোর জন্য প্রাসঙ্গিক অফারটিকে একটি localPost হিসাবে পুনরুদ্ধার করতে পারবেন। ধাপগুলি নিচে দেওয়া হলো:
- Google My Business API ব্যবহার করে, আপনি প্রদর্শন করতে চান এমন
OFFERটাইপের যেকোনো অফার পোস্ট তৈরি করুন । মানচিত্রে স্থান আইডির সাথে যুক্ত ব্যবসায়িক প্রোফাইলের অবস্থান / অবস্থান আইডিটি খুঁজুন।
যখন ব্যবহারকারীরা স্থানের বিবরণ দেখেন, তখন তারা একটি গুগল ম্যাপস প্ল্যাটফর্ম প্লেস আইডির বিবরণ দেখেন। প্লেস আইডিটি একটি বিজনেস প্রোফাইল লোকেশন আইডির সাথে যুক্ত থাকে, তাই আপনার অবস্থানের জন্য স্থানীয় অফার লিঙ্কটি পুনরুদ্ধার এবং প্রদর্শন করতে আপনাকে ম্যাপ প্লেস আইডির উপর ভিত্তি করে লোকেশন আইডিটি খুঁজে বের করতে হবে। নিম্নলিখিত বিজনেস প্রোফাইল এপিআই কলগুলো করুন:
- আপনার প্রকল্পের অ্যাকাউন্টগুলোর তালিকা করুন ।
- একটি অ্যাকাউন্টের অন্তর্গত সমস্ত অবস্থান তালিকাভুক্ত করুন ।
- অ্যাকাউন্ট লোকেশনগুলোতে,
LocationKeyম্যাপের প্লেস আইডি থাকে, যা আপনি দেখা লোকেশনের প্লেস আইডির সাথে তুলনা করতে পারেন।
বিজনেস প্রোফাইল এপিআই-তে কোনো অবস্থানের বিবরণের জন্য একটি অনুরোধের উদাহরণ নিচে দেওয়া হলো:
https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700
রেসপন্সটিতে একটি
locationKeyফিল্ড থাকে, যা হলো স্থানের আইডি এবং এটি আপনি গুগল ম্যাপস প্ল্যাটফর্মের রিকোয়েস্টের জন্য ব্যবহার করতে পারেন।নমুনা প্রতিক্রিয়াটি দেখতে প্রসারিত করুন।
{ "name": "accounts/111098884960588804666/locations/15899957830169237700", "locationName": "Sushi Sushi", "primaryPhone": "+49 2222 22222", "primaryCategory": { "displayName": "Restaurant", "categoryId": "gcid:restaurant", }, "regularHours": { "periods": [ { "openDay": "MONDAY", "openTime": "09:00", "closeDay": "MONDAY", "closeTime": "09:10" }, { "openDay": "TUESDAY", "openTime": "11:30", "closeDay": "TUESDAY", "closeTime": "24:00" } ] }, "locationKey": { "placeId": "ChIJs4wtL04X2jERbc8qHd_wZzk", "requestId": "2c72cbcb-ea2e-4d66-b684-0ef5f090300c" }, "latlng": { "latitude": 1.3670033, "longitude": 103.8556385 }, "openInfo": { "status": "OPEN", "canReopen": true }, "locationState": { "isGoogleUpdated": true, "canUpdate": true, "canDelete": true, "isVerified": true, "isPublished": true, "canHaveFoodMenus": true }, "attributes": [ { "attributeId": "has_delivery", "valueType": "BOOL", "values": [ false ] }, { "attributeId": "requires_masks_customers", "valueType": "BOOL", "values": [ true ] }, { "attributeId": "url_order_ahead", "valueType": "URL", "urlValues": [ { "url": "https://example.com/" }, ] }, { "attributeId": "pay_credit_card_types_accepted", "valueType": "REPEATED_ENUM", "repeatedEnumValue": { "setValues": [ "visa" ], "unsetValues": [ "american_express" ] } } ], "address": { "regionCode": "SG", "languageCode": "en-US", "postalCode": "560445", "addressLines": [ "445 Ang Mo Kio Ave 10" ] }, "profile": { "description": "Example restaurant" } }এখন যেহেতু আপনার কাছে লোকেশন আইডি আছে, আপনি আপনার পছন্দের অফারটি পেতে পারেন। একটি বিদ্যমান অফার পোস্ট পুনরুদ্ধার করতে, সেই লোকেশনের জন্য বিদ্যমান
localPostsতালিকা দেখুন এবং আপনার ব্যবহার করতে চাওয়া অফারের বিষয়বস্তু খুঁজে পেতেOFFERtopicTypeদিয়ে ফিল্টার করুন।কোনো একটি অবস্থানের সক্রিয় স্থানীয় পোস্টগুলির তালিকা দেখানোর জন্য এখানে একটি অনুরোধের উদাহরণ দেওয়া হলো:
https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700/localPosts
নিম্নলিখিত উদাহরণটি রেসপন্সে একটি
OFFERlocalPostদেখাচ্ছে।নমুনা প্রতিক্রিয়াটি দেখতে প্রসারিত করুন।
{ "localPosts": [ { "name": "accounts/111098884960588804666/locations/15899957830169237700/localPosts/2524928563578730680", "languageCode": "en", "summary": "Buy One Get One Free on all order-ahead bento boxes today!", "state": "LIVE", "event": { "title": "Bento BOGO", "schedule": { "startDate": { "year": 2020, "month": 1, "day": 20 }, "startTime": {}, "endDate": { "year": 2021, "month": 1, "day": 21 }, "endTime": {} } }, "updateTime": "2020-09-11T10:56:22.594Z", "createTime": "2020-09-11T10:56:22.594Z", "searchUrl": "https://local.google.com/place?id=4156539623820808045&use=posts&lpsid=2524928563578730680", "media": [ { "name": "accounts/111098884960588804666/locations/15899957830169237700/media/localPosts/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS", "mediaFormat": "PHOTO", "googleUrl": "https://lh3.googleusercontent.com/p/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS" } ], "topicType": "OFFER", "offer": { "couponCode": "BOGO-JET-CODE", "redeemOnlineUrl": "https://www.example.com/redeem", "termsConditions": "Offer only valid for order-ahead orders placed online." } }, ], }-
localPostঅবজেক্ট থেকে প্রাসঙ্গিক ডেটা দিয়ে সাইড প্যানেলে একটি<div>তৈরি করুন এবং তা পূরণ করুন।
আপনার মানচিত্র কাস্টমাইজ করা
আপনি আপনার মানচিত্রের চেহারা ও বিবরণ বিভিন্ন উপায়ে পরিবর্তন করতে পারেন। উদাহরণস্বরূপ, আপনি পারেন:
- ডিফল্ট ম্যাপ পিনগুলো প্রতিস্থাপন করতে আপনার নিজস্ব কাস্টম মার্কার তৈরি করুন।
- আপনার ব্র্যান্ডের প্রতিফলন ঘটাতে মানচিত্রের বৈশিষ্ট্যগুলোর রং পরিবর্তন করুন।
- আপনি কোন কোন আকর্ষণীয় স্থান (আকর্ষণীয় জিনিস, খাবার, থাকার জায়গা ইত্যাদি) এবং কী ঘনত্বে প্রদর্শন করবেন তা নিয়ন্ত্রণ করুন, যা ব্যবহারকারীদের মনোযোগ আপনার স্থানগুলোর উপর কেন্দ্রীভূত করতে সাহায্য করে এবং একই সাথে সেইসব ল্যান্ডমার্ক হাইলাইট করে যা ব্যবহারকারীদের নিকটতম স্থানে পৌঁছাতে সহায়তা করে।
কাস্টম ম্যাপ মার্কার তৈরি করা
আপনি ডিফল্ট পিন ব্যাকগ্রাউন্ড, বর্ডার বা গ্লিফের রঙ পরিবর্তন করে (উদাহরণস্বরূপ, কোনো স্থান খোলা আছে কিনা তা বোঝাতে), মার্কারটিকে আপনার ব্র্যান্ডের লোগোর মতো একটি কাস্টম গ্রাফিক ইমেজ দিয়ে প্রতিস্থাপন করে, অথবা কাস্টম HTML এবং CSS মার্কার তৈরি করে আপনার অ্যাডভান্সড মার্কারগুলো কাস্টমাইজ করতে পারেন। তথ্য উইন্ডোগুলো ব্যবহারকারীদের অতিরিক্ত তথ্য প্রদান করতে পারে, যেমন খোলার সময়, ফোন নম্বর বা ছবি।
নিচে কাস্টম গ্রাফিক মার্কার ব্যবহার করা একটি নমুনা মানচিত্র দেওয়া হলো। ( ম্যাপস জাভাস্ক্রিপ্ট এপিআই কাস্টম গ্রাফিক মার্কার টপিকে সোর্স কোডটি দেখুন।)
বিস্তারিত তথ্যের জন্য, জাভাস্ক্রিপ্ট (ওয়েব) , অ্যান্ড্রয়েড এবং আইওএস- এর অ্যাডভান্সড মার্কার ডকুমেন্টেশন দেখুন।
আপনার মানচিত্র সাজানো
গুগল ম্যাপস প্ল্যাটফর্ম আপনাকে আপনার ম্যাপকে এমনভাবে সাজানোর সুযোগ দেয়, যা ব্যবহারকারীদের নিকটতম স্থান খুঁজে পেতে, যত দ্রুত সম্ভব সেখানে পৌঁছাতে এবং আপনার ব্র্যান্ডকে আরও শক্তিশালী করতে সাহায্য করে। উদাহরণস্বরূপ, আপনি আপনার ব্র্যান্ডিংয়ের সাথে মিলিয়ে ম্যাপের রঙ পরিবর্তন করতে পারেন এবং ব্যবহারকারীদের কাছে দৃশ্যমান গুরুত্বপূর্ণ স্থানগুলো নিয়ন্ত্রণ করে ম্যাপের মনোযোগ বিঘ্নকারী বিষয়গুলো কমাতে পারেন। গুগল ম্যাপস প্ল্যাটফর্ম বেশ কিছু ম্যাপ স্টার্টার টেমপ্লেটও সরবরাহ করে, যার মধ্যে কয়েকটি ভ্রমণ, লজিস্টিকস, রিয়েল এস্টেট এবং রিটেলের মতো বিভিন্ন শিল্পের জন্য বিশেষভাবে তৈরি করা হয়েছে।
আপনি আপনার প্রোজেক্টের গুগল ক্লাউড কনসোলের ম্যাপ স্টাইলস পেজে ম্যাপ স্টাইল তৈরি বা পরিবর্তন করতে পারেন।
ক্লাউড কনসোলে ম্যাপ স্টাইল তৈরি এবং স্টাইলিং-এর অ্যানিমেশনগুলো দেখতে প্রসারিত করুন:
শিল্প মানচিত্র শৈলী
এই অ্যানিমেশনটি পূর্বনির্ধারিত শিল্প-ভিত্তিক মানচিত্রের শৈলীগুলো দেখায় যা আপনি ব্যবহার করতে পারেন। এই শৈলীগুলো প্রতিটি শিল্পের জন্য একটি সর্বোত্তম সূচনা বিন্দু প্রদান করে। উদাহরণস্বরূপ, রিটেইল মানচিত্রের শৈলীটি মানচিত্রে গুরুত্বপূর্ণ স্থানগুলো কমিয়ে দেয়, যা ব্যবহারকারীদের আপনার অবস্থানগুলোর পাশাপাশি ল্যান্ডমার্কগুলোর উপর মনোযোগ দিতে সাহায্য করে, যাতে তারা যত দ্রুত সম্ভব এবং আত্মবিশ্বাসের সাথে নিকটতম অবস্থানে পৌঁছাতে পারে।
আগ্রহের স্থান নিয়ন্ত্রণ
এই অ্যানিমেশনটি আগ্রহের স্থানগুলোর (POI) মার্কারের রঙ নির্ধারণ করে এবং ম্যাপ স্টাইলে POI-এর ঘনত্ব বৃদ্ধি করে। ঘনত্ব যত বেশি হবে, ম্যাপে তত বেশি POI মার্কার প্রদর্শিত হবে।
Each map style has its own ID. After you publish a style in the Cloud console, you reference that map ID in your code—which means you can update a map style in real time without refactoring your app. The new look will automatically appear in the existing application and be used across platforms. The following examples show how to add a map ID to a web page using the Maps JavaScript API.
By including one or more map_ids in the script URL, the Maps JavaScript API automatically makes those styles available for faster map rendering when you call those styles in your code.
<script
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&map_ids=MAP_IDs&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a">
</script>The following code displays a styled map on the web page. (Not shown is an HTML <div id="map"></div> element where the map will appear on the page.)
map = new google.maps.Map(document.getElementById('map'), { center: {lat: 51.485925, lng: -0.129500}, zoom: 12, mapId: '1234abcd5678efgh' });
Learn more about incorporating cloud-based maps styling in JavaScript (web) , Android , and iOS .
Gaining usage insights with analytics
Using analytics, you can gain valuable insights about how users are interacting with your locator. This section provides guidance on configuring and monitoring Google Analytics and Business Profile analytics to track the data you're most interested in. For Quick Builder Locator Plus users, an analytics dashboard helps you analyze and generate insights, giving you a picture of how well your site visitors are engaging with your store locator, based on anonymized data.
To access this report, go to the engagement reports section of the Cloud console . For more details about this report, see engagement reports .
Because Google Analytics offers many features, we won't provide comprehensive setup and usage information. Instead, we'll point you to key documentation for further reading and instructions while highlighting key analytics considerations for your locator app.
Setting up Google Analytics
If you're already using Google Analytics with your app, you can skip this section.
Following is an example of a "Global Tag" you'd paste on your site to enable Google Analytics.
<!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/ gtag/js?id=G-XR5B5D4NW0"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-XR5B5D4NW0'); </script>
Whether you're using Google Tag Manager or adding Google Analytics directly to your site, the key is to understand how to use your Google Analytics implementation to do the following:
- Trigger user interactions, such as clicks, that can be measured independently of web site pageviews ( events ).
- View raw data ( metrics ) in meaningful groupings ( dimensions or custom dimensions ).
Using custom events
Following is an example of defining a custom event in your locator:
gtag('event', 'location', { 'method': 'address' });
It's important to name your event and method clearly enough that you can understand events in reporting. Trigger them for the specific interactions you want to measure, such as when a user selects and address from the Autocomplete drop-down list, shown in the following figure.
You can send the following tracking call to Google Analytics that uses the event and method you defined. (We'll show each query parameter on a separate line for ease of reading.)
https://www.google-analytics.com/g/collect?v=2 &tid=G-XR5B5D4NW0 >m=2oe550 &_p=64678170 &sr=1920x1200 &ul=fr &cid=489856786.1598861364 &_s=2 &dl=http%3A%2F%2.storelocator.html &dt=Store%20Locator &sid=1620827159 &sct=1 &seg=1 &en=location &_et=6032 &ep.method=address
The following figure shows how that Google Analytics call appears in the browser's Inspect view, on the Network tab. (Click to enlarge).
You can verify that your custom event tags are properly being captured by viewing the "Real-time" view in Google Analytics. For example, the "location" event set up previously for Place Autocomplete appears in Google Analytics as shown in the following figures.
Alternatively, you could monitor real-time events using the DebugView, as shown in the following figure. Note that you have to wait 24 hours before accessing a full Events report in the Engagement > Events section of Google Analytics.
You can also develop and measure strategies to drive more foot traffic to your physical locations from your locator app. For example, Google Analytics has a Store Visits in Analytics offering that links physical store visits analytics (measured by Google Ads) to your locator analytics. You can also develop your own app-to-location strategies, such as online offers redeemable at your physical locations.
Business Profile metrics
In addition to tracking the events, metrics, and dimensions you're interested in with Google Analytics, Business Profile also has its own metrics . For example, if you add appointment booking and local offer links to your locator, you can get metrics on those views and clicks.
The following sample request to the Business Profile APIs asks for multiple types of metrics. For tracking offer clicks, the LOCAL_POST_VIEWS_SEARCH and LOCAL_POST_ACTIONS_CALL_TO_ACTION metrics would be the most relevant.
Expand to see the sample request.
POST https://mybusiness.googleapis.com/v4/accounts/111098884960528804666/locations:reportInsights
Body:
{
"locationNames": [
"accounts/111098884960528804666/locations/15899957830169237700"
],
"basicRequest": {
"metricRequests": [
{
"metric": "QUERIES_DIRECT"
},
{
"metric": "QUERIES_INDIRECT"
},
{
"metric": "VIEWS_MAPS"
},
{
"metric": "VIEWS_SEARCH"
},
{
"metric": "ACTIONS_DRIVING_DIRECTIONS"
},
{
"metric": "LOCAL_POST_VIEWS_SEARCH"
},
{
"metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION"
}
],
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
}
}Expand to see the sample response.
{
"locationMetrics": [
{
"locationName": "accounts/111098884960528804666/locations/15899957830169237700",
"timeZone": "Asia/Singapore",
"metricValues": [
{
"metric": "QUERIES_DIRECT",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "82"
}
},
{
"metric": "QUERIES_INDIRECT",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "1493"
}
},
{
"metric": "VIEWS_MAPS",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "1571"
}
},
{
"metric": "VIEWS_SEARCH",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "631"
}
},
{
"metric": "ACTIONS_DRIVING_DIRECTIONS",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "3"
}
},
{
"metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "42"
}
},
{
"metric": "LOCAL_POST_VIEWS_SEARCH",
"totalValue": {
"metricOption": "AGGREGATED_TOTAL",
"timeDimension": {
"timeRange": {
"startTime": "2021-01-01T01:01:23.045123456Z",
"endTime": "2021-04-30T23:59:59.045123456Z"
}
},
"value": "11"
}
}
]
}
]
}
The response contains the metrics, most notably:
- 1571 views of the location on Google Maps
- 631 location views on Google Search.
- 3 requests for Driving Directions to the location.
- 42
LOCAL_POST_ACTIONS_CALL_TO_ACTIONoffer clicks. - 11 views of Local Posts on Google Search.
Another metrics option involves using Reserve with Google to create action links. When users click action links created in Reserve with Google, you can log those actions to Google Analytics, which lets you track conversions in Google Analytics. See the conversion tracking documentation for more information.
Regardless of the metrics strategy you use, measurement is more than seeing how you're doing against your KPIs. The numbers also help you understand the impact these locator improvements have on your business. Additionally, you can compare the metrics from Google Analytics on your locator with the Business Profile metrics. For example, by comparing these metrics, you can see how many customers are getting directions from your locator and Google Maps to then visit your physical locations.
Enhancing Locator Plus
Depending on your business' or users' needs, you can further enhance the user's experience.
Sending directions to mobile
To make it even easier for users to reach a location, you can text or email them a directions link. When they click it, the Google Maps app will launch on their phone if it is installed, or maps.google.com will load in their device's web browser. Both of these experiences provide the user with the option to use turn-by-turn navigation, including voice guidance, to reach the destination.
Use Maps URLs to compose a directions URL like the following, with the URL-encoded place name as the destination parameter and place ID as the destination_place_id parameter. There is no cost to compose or use Maps URLs, so you don't need to include an API key in the URL.
https://www.google.com/maps/dir/?api=1&destination=Google%20London&destination_place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU
You can optionally provide an origin query parameter using the same address format as the destination. But by omitting it, the directions start from the user's current location, which may be different from where they were using your Locator Plus app. Maps URLs provide additional query parameter options, such as travelmode and dir_action=navigate to launch the directions with navigation turned on.
This clickable link , which extends the example URL above, sets the origin as a London football stadium and uses travelmode=transit to provide public transit directions to the destination.
To send a text or email containing this URL, we recommend using a third-party application such as twilio . If you're using App Engine, you can use third-party companies to send SMS messages or email. For more information, see Sending Messages with Third-Party Services .
Showing Street View to help users visualize locations
For many locations in the world, Street View can be used to display the outside of a location, offering users a visual of the location before they arrive. You can provide Street View in either an interactive (web) or static (API) form, depending on whether you want your users to "look around" the area in 360 degrees. Street View is also available for Android and iOS .
Determining user location with Geolocation
In most cases, you can pinpoint user location using the location services built into their devices or browsers. We provide an example of using a browser's HTML5 Geolocation feature to display the geographic location of a user or device on a Google map, and there's documentation on requesting permissions and obtaining location in Android and iOS . However, there may be situations where you want an alternative location finder; for example, if device location services are disabled or you have concerns about device location being spoofed.
The Geolocation API is a server-side API that returns a location and accuracy radius based on information about cell towers and Wi-Fi nodes that the client can detect. You can use Geolocation as a backup mechanism for determining user location, or you can use it to cross-check the location reported by the device.
Combining custom location data with Place Details
In the previous Providing Place Details section, we covered using Place Details to give users a rich level of information about your locations, such as opening hours, photos, and reviews.
It's helpful to understand the pricing and SKU tiers of different data fields in Places API (New). To manage your costs, one strategy is to combine the information you already have about your locations with the fresh information from Google Maps such as temporary closure, holiday hours, and user ratings, photos, and reviews. If you already have the contact information for your locations, you won't need to request those fields from Place Details and can constrain your field mask to fetch only the fields you want to display.
You may have your own place data to supplement or use instead of Place Details. The codelab for the full-stack locator provides an example of using GeoJSON with a database to store and retrieve your own location details.