ในเอกสารนี้ คุณจะได้ดูวิธีใช้ 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
; หากคุณเป็นโรงแรม คุณสามารถยกเว้นประเภท "ที่พัก" และใส่เฉพาะประเภทที่เหมาะกับธุรกิจของคุณ เช่น "restaurant, cafe, park, tourit_attraction"- ใช้ประโยชน์จาก
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
รูปภาพ: ในช่วงการแสดงตัวอย่างการค้นหาใกล้เคียง (ใหม่) API แบบไม่จำกัด คุณจะต้องค้นหา Places Details ด้วย
place.id
เพื่อรับ photo_reference แล้วค้นหาทีละรายการในประสบการณ์การใช้งาน
จํานวนการค้นหาและค่าใช้จ่ายที่เกี่ยวข้อง
- Maps JavaScript API: 1 แผนที่เมื่อโหลดประสบการณ์การใช้งาน
- Places Autocomplete API: 1 การค้นหาต่อตัวอักษรที่พิมพ์ (หากใช้วิดเจ็ตการเติมข้อความอัตโนมัติ) โดยสามารถปรับแต่งได้
- การค้นหาในพื้นที่ (ใหม่) 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 วิศวกรโซลูชันแพลตฟอร์ม