ในเอกสารนี้ คุณจะได้ดูวิธีใช้ Nearby Search (New) API เพื่อสร้างแอปที่ใช้งานง่ายและประหยัดค่าใช้จ่าย
ประสบการณ์การค้นพบในพื้นที่
ประสบการณ์การค้นพบในพื้นที่จะแสดงสถานที่น่าสนใจหลักๆ ที่อยู่ใกล้กับสถานที่ที่คุณระบุเมื่อค้นหาโรงแรมหรืออสังหาริมทรัพย์ โดยมักจะประกอบด้วยแผนที่แบบอินเทอร์แอกทีฟ พร้อมแผงเพิ่มเติมที่มีเครื่องมือเลือกสถานที่และแกลเลอรีรูปภาพ คุณจะเห็นผลิตภัณฑ์และความสามารถต่างๆ ของ Google Maps Platform เพื่อปรับปรุงประสบการณ์การโต้ตอบ
กรณีการใช้งาน
มาดูกันว่าองค์ประกอบใดของการผสานรวมการค้นพบในพื้นที่ที่เพิ่มคุณค่าให้แก่ผู้ใช้
การค้นพบ - ให้ภาพรวมของสิ่งที่อยู่รอบๆ สถานที่หนึ่งๆ แก่ผู้ใช้โดยการแสดงสถานที่ที่เกี่ยวข้องหลายประเภท
การโต้ตอบ - ช่วยให้ผู้ใช้เลือกสถานที่และรีเฟรชข้อมูลแบบไดนามิกได้
เมื่อเทียบกับสถานที่นั้น
การแสดงข้อมูลผ่านภาพ - เขียนรีวิวและแสดงรูปภาพสถานที่
รวมถึงเวลาและระยะทางในการเดินเพื่อให้ผู้ใช้เข้าใจได้อย่างรวดเร็วว่าสถานที่นั้นเหมาะกับความต้องการของตนหรือไม่
สถาปัตยกรรมอ้างอิง
การค้นพบในพื้นที่
การสร้างประสบการณ์การค้นพบในพื้นที่มีหลายวิธี การผสานรวมต่อไปนี้เป็นตัวอย่างที่กำหนดเองของประสบการณ์ของผู้ใช้ที่ใช้ประโยชน์จาก Google Maps Platform API ที่รู้จักกันดี รวมถึงฟีเจอร์ใหม่ๆ ที่น่าสนใจ หากต้องการใช้แนวทางแบบเทมเพลตในการค้นพบในพื้นที่ คุณสามารถใช้ Web Component
แอปพลิเคชันตัวอย่าง
ตัวอย่างคำแนะนำแบบทีละขั้น
คุณจะเห็นตัวอย่างแอปพลิเคชันซึ่งแบ่งออกเป็นขั้นตอนต่างๆ ในตารางด้านล่าง พร้อมคำอธิบายการใช้งานทางเทคนิคด้วย Google Maps Platform API
1. การค้นหาสถานที่ตั้งด้วยการเติมข้อความอัตโนมัติ
- โหลด Maps JavaScript API
- ค้นหาด้วยฟีเจอร์เติมข้อความอัตโนมัติของสถานที่หรือเลือกตำแหน่งบนแผนที่
2. แสดงจุดที่น่าสนใจในพื้นที่โดยใช้ Nearby Search (New) API
- การจัดอันดับตามความนิยม (ผลการค้นหาที่เกี่ยวข้องมากขึ้น) หรือการจัดอันดับตามระยะทาง
includedTypes
,excludedTypes
; หากคุณเป็นโรงแรม คุณสามารถยกเว้นประเภท "ที่พัก" และใส่เฉพาะประเภทที่เหมาะกับธุรกิจ เช่น "ร้านอาหาร คาเฟ่ สวนสาธารณะ สถานที่ท่องเที่ยว"- ใช้
includedPrimaryTypes
,excludedPrimaryTypes
เพื่อควบคุมผลลัพธ์ได้มากขึ้น - `locationRestriction เพื่อหลีกเลี่ยงจำนวนผลการค้นหาที่ไม่เพียงพอหรือสถานที่ที่อยู่ไกลเกินไป ในกรณีที่ไม่มีผลการค้นหาเลย ให้ขยายขนาดวงกลม / สี่เหลี่ยมผืนผ้าก่อนแสดงผลลัพธ์
ตัวอย่างการค้นหาเมื่อจองโรงแรมพร้อมช่องข้อมูลที่ขอ
- พื้นฐาน (
displayName
,types
,openingHours
,formattedAddress
) - รายชื่อติดต่อ (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - แนะนำ (
reviews
,priceLevel
,userRatingCount
)
{ "includedTypes": ["restaurant","cafe","park"], "excludedTypes": ["lodging","convenience_store"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
ตัวอย่างการค้นหาเมื่อค้นหาอสังหาริมทรัพย์โดยขอช่องข้อมูล
- พื้นฐาน (
displayName
,types
,openingHours
,formattedAddress
)
{ "includedTypes": ["school","transport","bus","convenience_store"], "excludedTypes": ["lodging"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
3. เพิ่มการโต้ตอบด้วย Maps API แบบไดนามิกและ Directions API
- ขาและขั้นตอนล่าสุดโดยการค้นหา Directions API * ใช้เวลาในส่วนถัดไป
4. แสดงรายละเอียดของสถานที่เมื่อมีการโต้ตอบ
คำอธิบาย:
displayName
,types
,rating
,userRatingCount
,priceLevel
เวลา: มาจากคำค้นหา Directions API ก่อนหน้า
รีวิว:
reviews[i].author
,reviews[i].rating
,reviews[i].text
รูปภาพ: ในระหว่างช่วงทดลองใช้แบบไม่จำกัดของ Nearby Search (ใหม่) API คุณจะต้องค้นหารายละเอียดสถานที่ด้วย
place.id
เพื่อรับ photo_reference จากนั้นจึงค้นหาทีละรายการในประสบการณ์การใช้งาน
จํานวนการค้นหาและค่าใช้จ่ายที่เกี่ยวข้อง
- Maps JavaScript API: 1 แผนที่เมื่อโหลดประสบการณ์การใช้งาน
- Places Autocomplete API: 1 การค้นหาต่อตัวอักษรที่พิมพ์ (หากใช้วิดเจ็ต Autocomplete) โดยสามารถปรับแต่งได้
- การค้นหาในพื้นที่ (ใหม่) API: การค้นหา 1 ครั้งในทุกๆ 20 สถานที่ที่แสดง การเรียกเก็บเงินที่แตกต่างกันตามข้อมูลสถานที่ซึ่งเป็นส่วนหนึ่งของการตอบกลับการค้นหา
- Directions API: 1 การค้นหาต่อสถานที่ที่ผู้ใช้เลือก
- Place Photo API: 1 การค้นหารูปภาพที่แสดงทั้งหมด
บทสรุป
ประสบการณ์การค้นพบในพื้นที่เป็นวิธีที่มีประสิทธิภาพในการมอบคุณค่าแก่ผู้ใช้ การใช้งานเพื่อสาธิตนี้มีฟีเจอร์มากมายที่คุณอาจรวมไว้เมื่อสร้างประสบการณ์การใช้งานดังกล่าวใน Google Maps Platform ด้วยความสามารถพิเศษจาก Nearby Search (New) API
ขั้นตอนถัดไป
แหล่งข้อมูลอื่นๆ ที่แนะนํา
- Web Components ใน Maps JavaScript API
- การเพิ่มประสิทธิภาพการเติมข้อความอัตโนมัติของสถานที่
- บริการของ Places อื่นๆ
- แสดงความคิดเห็นด้านล่าง
ผู้ร่วมให้ข้อมูล
ผู้แต่งหลัก
Thomas Anglaret | Google Maps วิศวกรโซลูชันแพลตฟอร์ม