ดึงข้อมูลช่อง
หากคุณมีออบเจ็กต์ Place
หรือรหัสสถานที่อยู่แล้ว ให้ใช้ Place.fetchFields
เพื่อดูรายละเอียดเกี่ยวกับสถานที่นั้นๆ ระบุรายการที่คั่นด้วยจุลภาคของ
วางฟิลด์ข้อมูลให้แสดงผล
ระบุชื่อฟิลด์โดยใช้รูปแบบอูฐ ใช้ออบเจ็กต์ Place
ที่แสดงผลเพื่อรับข้อมูลสำหรับช่องที่ขอ
ตัวอย่างต่อไปนี้ใช้รหัสสถานที่ในการสร้าง Place
ใหม่ โทร Place.fetchFields
กำลังขอฟิลด์ displayName
และ formattedAddress
เพิ่มเครื่องหมาย
ลงในแผนที่ และบันทึกข้อมูลบางอย่างลงในคอนโซล
TypeScript
async function getPlaceDetails(Place) { const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary; // Use place ID to create a new Place instance. const place = new Place({ id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg', requestedLanguage: 'en', // optional }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] }); // Log the result console.log(place.displayName); console.log(place.formattedAddress); // Add an Advanced Marker const marker = new AdvancedMarkerElement({ map, position: place.location, title: place.displayName, }); }
JavaScript
async function getPlaceDetails(Place) { const { AdvancedMarkerElement } = await google.maps.importLibrary("marker"); // Use place ID to create a new Place instance. const place = new Place({ id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg", requestedLanguage: "en", // optional }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ["displayName", "formattedAddress", "location"], }); // Log the result console.log(place.displayName); console.log(place.formattedAddress); // Add an Advanced Marker const marker = new AdvancedMarkerElement({ map, position: place.location, title: place.displayName, }); }
Map
และ Place
ก่อนฟังก์ชันนี้
const { Map } = await google.maps.importLibrary("maps"); const { Place } = await google.maps.importLibrary("places");
ใช้คอมโพเนนต์ภาพรวมสถานที่
คอมโพเนนต์ภาพรวมสถานที่แสดงข้อมูลโดยละเอียดเกี่ยวกับธุรกิจหลายล้านแห่ง ซึ่งรวมถึงเวลาทําการ รีวิวแบบให้ดาว และรูปภาพ รวมถึงเส้นทางและการดําเนินการอื่นๆ ใน UI ที่สร้างไว้ล่วงหน้า 5 ขนาดและ 5 รูปแบบ คอมโพเนนต์นี้เป็นส่วนหนึ่งของคลังคอมโพเนนต์แบบขยายจาก Google Maps Platform ซึ่งเป็นชุดคอมโพเนนต์เว็บที่ช่วยให้นักพัฒนาซอฟต์แวร์สร้างแผนที่และฟีเจอร์ตำแหน่งที่ดีขึ้นได้เร็วขึ้น
ใช้ตัวกำหนดค่าภาพรวมสถานที่ เพื่อสร้างโค้ดแบบฝังได้สำหรับคอมโพเนนต์ภาพรวมสถานที่ที่กำหนดเอง จากนั้นส่งออก เพื่อใช้กับเฟรมเวิร์กที่ได้รับความนิยมอย่าง React และ Angular หรือไม่มีกรอบเลย