ในเอกสารนี้ คุณจะทราบวิธีใช้ API การค้นหาใกล้เคียง (ใหม่) ถึง สร้างแพลตฟอร์มที่เรียบง่ายและคุ้มค่า
การค้นพบในท้องถิ่นด้วย
ประสบการณ์การค้นพบในท้องถิ่นแสดงให้ผู้ใช้เห็นสถานที่น่าสนใจใกล้สถานที่นั้นๆ ที่คุณระบุเมื่อค้นหาโรงแรมหรืออสังหาริมทรัพย์ โดยมักจะประกอบด้วย แผนที่แบบอินเทอร์แอกทีฟ พร้อมแผงเพิ่มเติมที่มีตัวเลือกสถานที่และ แกลเลอรีรูปภาพ ระบบจะแสดง Google Maps Platform เวอร์ชันอื่น ผลิตภัณฑ์และความสามารถเพื่อปรับปรุงประสบการณ์การใช้งานด้วยการโต้ตอบ
กรณีการใช้งาน
ต่อไปเราจะมาดูกันว่าองค์ประกอบใดของการผสานรวมการค้นพบในท้องถิ่นที่นำผู้ใช้ ค่า:
การค้นพบ - ช่วยให้ผู้ใช้เห็นภาพรวมของสิ่งที่อยู่รอบๆ สถานที่แห่งเดียว โดยแสดงสถานที่ที่เกี่ยวข้องประเภทต่างๆ
การโต้ตอบ - ให้ผู้ใช้เลือกสถานที่และรีเฟรชข้อมูลแบบไดนามิก
สัมพันธ์กับสถานที่นั้น
การแสดงภาพ - ให้รีวิวสถานที่ รูปภาพ
รวมถึงเวลาเดินและระยะทาง เพื่อให้ผู้ใช้เข้าใจได้อย่างรวดเร็วว่าเหมาะสมหรือไม่ ตามความต้องการ
สถาปัตยกรรมอ้างอิง
การค้นพบในท้องถิ่น
การสร้างประสบการณ์การค้นพบในพื้นที่ทำได้หลายวิธี ดังต่อไปนี้ คือ ตัวอย่างที่กำหนดเองของประสบการณ์ของผู้ใช้ที่ใช้ประโยชน์ได้ดี Google Maps Platform API ที่รู้จัก รวมทั้งฟีเจอร์ใหม่ๆ ที่น่าสนใจ หากคุณ ต้องการใช้เทมเพลตสำหรับการค้นพบในท้องถิ่นซึ่งคุณสามารถใช้เว็บ คอมโพเนนต์
แอปพลิเคชันตัวอย่าง
ตัวอย่างคำแนะนำแบบทีละขั้น
โปรดดูตารางด้านล่างแอปพลิเคชันตัวอย่างที่แบ่งออกเป็นขั้นตอนต่างๆ พร้อมกับคำอธิบายการติดตั้งใช้งานทางเทคนิคกับ Google Maps Platform API
1. การค้นหาตำแหน่งด้วย AutocompleteSearch ตำแหน่ง
- โหลด Maps JavaScript API
- ข้อความค้นหาเติมข้อความอัตโนมัติเกี่ยวกับสถานที่ หรือเลือกสถานที่บนแผนที่
2. แสดงจุดที่น่าสนใจในพื้นที่โดยใช้ API การค้นหาใกล้เคียง (ใหม่)
- การจัดอันดับความนิยม (ผลการค้นหาที่เกี่ยวข้องมากขึ้น) หรือการจัดอันดับระยะทาง
includedTypes
,excludedTypes
หากเป็นโรงแรมที่คุณสามารถยกเว้น "ที่พัก" และมีเฉพาะประเภทที่เหมาะสมเท่านั้น เช่น "ร้านอาหาร คาเฟ่ สวนสาธารณะ tourit_attraction"- ใช้
includedPrimaryTypes
และexcludedPrimaryTypes
ให้คุ้มค่ายิ่งขึ้น ควบคุมผลลัพธ์ได้ - "การจำกัดตำแหน่งเพื่อหลีกเลี่ยงจำนวนผลการค้นหาไม่เพียงพอหรืออยู่ไกลเกินไป สถานที่ ในกรณีที่ไม่มีผลลัพธ์ ให้ขยายวงกลม / สี่เหลี่ยมผืนผ้าให้กว้างกว่า เพื่อแสดงผลลัพธ์
ตัวอย่างการค้นหาเมื่อจองโรงแรมด้วยคำขอช่องข้อมูล
- พื้นฐาน (
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 และ Directions API แบบไดนามิก
- เส้นทางและขั้นตอนล่าสุดโดยการค้นหาเส้นทาง API * ใช้เวลาในส่วนถัดไป
4. แสดงข้อมูลรายละเอียดของสถ านที่เมื่อมีการโต้ตอบ
คำอธิบาย:
displayName
,types
,rating
,userRatingCount
,priceLevel
เวลา: มาจากการค้นหา Directions API ก่อนหน้านี้
รีวิว:
reviews[i].author
,reviews[i].rating
,reviews[i].text
รูปภาพ: ระหว่างการแสดงตัวอย่าง API การค้นหาใกล้เคียง (ใหม่) แบบไม่จำกัด คุณ จะต้องค้นหา Places รายละเอียด กับ
place.id
เพื่อรับ photo_reference ให้ค้นหาทีละรายการในประสบการณ์การใช้งานของคุณ
จำนวนคำค้นหาและค่าใช้จ่ายที่เกี่ยวข้อง
- Maps JavaScript API 1 แผนที่ขณะโหลดประสบการณ์นี้
- Places Autocomplete API: 1 ข้อความค้นหาสำหรับอักขระทุกตัวที่พิมพ์ (หากใช้ เติมข้อความอัตโนมัติ วิดเจ็ต) ก็สามารถปรับแต่งได้
- การค้นหาใกล้เคียง (ใหม่) API การค้นหา 1 รายการทุก 20 สถานที่ที่แสดง การเรียกเก็บเงินแตกต่างกันไปตามสถานที่ ข้อมูล ที่เป็นส่วนหนึ่งของคำตอบข้อความค้นหา
- เส้นทาง API การค้นหา 1 รายการในทุกสถานที่ที่ผู้ใช้เลือก
- รูปภาพสถานที่ API 1 ข้อความค้นหาทุกรูปภาพที่แสดง
บทสรุป
ประสบการณ์การค้นพบในพื้นที่เป็นวิธีที่มีประสิทธิภาพในการให้คุณค่าแก่ผู้ใช้ ช่วงเวลานี้ การติดตั้งใช้งานการสาธิตมีฟีเจอร์หลายอย่างที่คุณมีแนวโน้มที่จะรวมไว้เมื่อ เพื่อสร้างประสบการณ์เช่นนี้บน Google Maps Platform ด้วยความสามารถพิเศษ จาก API การค้นหาใกล้เคียง (ใหม่)
ขั้นตอนถัดไป
แนะนำให้อ่านเพิ่มเติม
- คอมโพเนนต์เว็บใน Maps JavaScript API
- การเพิ่มประสิทธิภาพการเติมข้อความอัตโนมัติเกี่ยวกับสถานที่
- บริการเกี่ยวกับสถานที่อื่นๆ
- โปรดแสดงความคิดเห็นด้านล่าง
ผู้ร่วมให้ข้อมูล
ผู้เขียนหลัก:
Thomas Anglaret | Google Maps วิศวกรโซลูชันแพลตฟอร์ม