การวางซ้อนภาคพื้นดินคือการวางซ้อนภาพที่ผูกกับพิกัดละติจูด/ลองจิจูด ดังนั้นภาพจึงเคลื่อนที่เมื่อคุณลากหรือซูมแผนที่
ตัวอย่างโค้ด
ที่เก็บ ApiDemos ใน GitHub มีตัวอย่างที่แสดงให้เห็นถึงการซ้อนทับพื้นดิน ดังนี้
- GroundOverlayDemoActivity - Java: ฟีเจอร์และตัวฟังการวางซ้อนภาคพื้นใน Java
- GroundOverlayDemoActivity - Kotlin: ฟีเจอร์และการวางซ้อนพื้นใน Kotlin
เกริ่นนำ
การวางซ้อนพื้นเป็นรูปภาพที่ยึดกับแผนที่ การวางซ้อนพื้นดินจะต่างจากเครื่องหมายตรงที่วางแนวกับพื้นผิวโลกมากกว่าหน้าจอ ดังนั้น การหมุน การเอียง หรือซูมแผนที่จะเปลี่ยนการวางแนวของรูปภาพ การวางซ้อนภาคพื้นดินมีประโยชน์หากคุณต้องการแก้ไขภาพเดียวที่บริเวณหนึ่งบนแผนที่ หากคุณต้องการเพิ่มภาพขนาดใหญ่ที่ครอบคลุมพื้นที่ส่วนใหญ่ของแผนที่ คุณควรพิจารณาการวางซ้อนของชิ้นส่วนแผนที่
เพิ่มการวางซ้อน
หากต้องการเพิ่ม GroundOverlay
ให้สร้างออบเจ็กต์ GroundOverlayOptions
ที่กำหนดทั้งรูปภาพและตำแหน่ง คุณสามารถเลือกระบุการตั้งค่าเพิ่มเติมซึ่งจะส่งผลต่อการวางตำแหน่งภาพบนแผนที่ เมื่อกำหนดตัวเลือกที่จำเป็นแล้ว ให้ส่งออบเจ็กต์ไปยังเมธอด GoogleMap.addGroundOverlay()
เพื่อเพิ่มรูปภาพลงในแผนที่ เมธอด addGroundOverlay()
จะแสดงผลออบเจ็กต์ GroundOverlay
คุณควรเก็บการอ้างอิงไปยังออบเจ็กต์นี้ไว้หากต้องการแก้ไขในภายหลัง
คำแนะนำทีละขั้นตอน:
- สร้างอินสแตนซ์ของออบเจ็กต์
GroundOverlayOptions
ใหม่ - ระบุรูปภาพเป็น
BitmapDescriptor
- กำหนดตำแหน่งของรูปภาพโดยใช้วิธีใดวิธีหนึ่งต่อไปนี้
position(LatLng location, float width, float height)
position(LatLng location, float width)
positionFromBounds(LatLngBounds bounds)
- ตั้งค่าพร็อพเพอร์ตี้ที่ไม่บังคับ เช่น
transparency
ตามต้องการ - เรียก
GoogleMap.addGroundOverlay()
เพื่อเพิ่มรูปภาพลงในแผนที่
ตัวอย่างด้านล่างแสดงวิธีเพิ่มการวางซ้อนพื้นให้กับวัตถุ GoogleMap
ที่มีอยู่
Kotlin
val newarkLatLng = LatLng(40.714086, -74.228697) val newarkMap = GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922)) .position(newarkLatLng, 8600f, 6500f) map.addGroundOverlay(newarkMap)
Java
LatLng newarkLatLng = new LatLng(40.714086, -74.228697); GroundOverlayOptions newarkMap = new GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922)) .position(newarkLatLng, 8600f, 6500f); map.addGroundOverlay(newarkMap);
หากคุณต้องการเปลี่ยนหรือนำภาพพื้นดินออกหลังจากที่เพิ่มภาพนั้นลงในแผนที่แล้ว ให้ยึดวัตถุ GroundOverlay
ไว้ คุณสามารถแก้ไขโฆษณาซ้อนทับได้ในภายหลังด้วยการเปลี่ยนแปลงออบเจ็กต์นี้
Kotlin
// Add an overlay to the map, retaining a handle to the GroundOverlay object. val imageOverlay = map.addGroundOverlay(newarkMap)
Java
// Add an overlay to the map, retaining a handle to the GroundOverlay object. GroundOverlay imageOverlay = map.addGroundOverlay(newarkMap);
นำการวางซ้อนออก
คุณสามารถนำการวางซ้อนพื้นออกได้โดยใช้เมธอด GroundOverlay.remove()
Kotlin
imageOverlay?.remove()
Java
imageOverlay.remove();
เปลี่ยนการวางซ้อน
คุณสามารถเปลี่ยนภาพวางซ้อนพื้นหลังจากเพิ่มลงในแผนที่แล้วได้โดยใช้เมธอด GroundOverlay.setImage(BitmapDescriptor)
Kotlin
// Update the GroundOverlay with a new image of the same dimension // Update the GroundOverlay with a new image of the same dimension imageOverlay?.setImage(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
Java
// Update the GroundOverlay with a new image of the same dimension imageOverlay.setImage(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922));
เมธอด setImage()
จะแทนที่รูปภาพที่มีอยู่ด้วยรูปภาพอื่นที่มีขนาดเดียวกัน
วางตำแหน่งการวางซ้อนภาคพื้นดิน
การระบุตำแหน่งการวางซ้อนพื้นมี 2 วิธีดังนี้
- การใช้
LatLng
เพื่อจัดกึ่งกลางการวางซ้อน และใช้ขนาดเป็นเมตรเพื่อระบุขนาดของรูปภาพ - ใช้
LatLngBounds
เพื่อระบุมุมตะวันออกเฉียงเหนือและตะวันตกเฉียงใต้ของรูปภาพ
คุณต้องระบุตำแหน่งของการวางซ้อนภาคพื้นดินก่อนที่จะเพิ่มลงในแผนที่
ใช้ตำแหน่งเพื่อวางตำแหน่งรูปภาพ
เมื่อเพิ่มรูปภาพ คุณจะต้องระบุละติจูดและลองจิจูดที่จุดยึดจะคงที่
และความกว้างของการวางซ้อน (หน่วยเป็นเมตร) anchor
จะมีค่าเริ่มต้นอยู่ที่กึ่งกลางของรูปภาพ คุณสามารถระบุความสูงของการวางซ้อน (หน่วยเป็นเมตร) หรือไม่ก็ได้ หาก
คุณไม่ระบุความสูงของการวางซ้อน ระบบจะคำนวณโดยอัตโนมัติเพื่อรักษาสัดส่วนของรูปภาพ
โค้ดด้านล่างวางรูปภาพไว้ที่ตำแหน่ง 40.714086, -74.228697
ซึ่งกว้าง 8.6 กม. สูง 6.5 กม. รูปภาพจะตรึงอยู่ที่ด้านซ้ายล่าง
Kotlin
val newarkMap = GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922)) .anchor(0f, 1f) .position(LatLng(40.714086, -74.228697), 8600f, 6500f)
Java
GroundOverlayOptions newarkMap = new GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922)) .anchor(0, 1) .position(new LatLng(40.714086, -74.228697), 8600f, 6500f);
ใช้ LatLngBounds เพื่อจัดตำแหน่งรูปภาพ
โปรดระบุ LatLngBounds
ที่มีรูปภาพดังกล่าว LatLngBounds
ตั้งมุมทิศตะวันออกเฉียงเหนือและตะวันตกเฉียงใต้ของรูปภาพ เมื่อวาดรูปภาพบนแผนที่ รูปภาพจะถูกหมุนเพื่อให้พอดีกับขอบเขต หากขอบเขตไม่ตรงกับสัดส่วนภาพต้นฉบับ รูปภาพจะบิดเบี้ยว
โค้ดด้านล่างวางรูปภาพบนแผนที่โดยมีมุมตะวันตกเฉียงใต้ติดกับ 40.712216,-74.22655
และมุมตะวันออกเฉียงเหนือติดกับ 40.773941, -74.12544
Kotlin
val newarkBounds = LatLngBounds( LatLng(40.712216, -74.22655), // South west corner LatLng(40.773941, -74.12544) // North east corner ) val newarkMap = GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922)) .positionFromBounds(newarkBounds)
Java
LatLngBounds newarkBounds = new LatLngBounds( new LatLng(40.712216, -74.22655), // South west corner new LatLng(40.773941, -74.12544)); // North east corner GroundOverlayOptions newarkMap = new GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922)) .positionFromBounds(newarkBounds);
เชื่อมโยงข้อมูลกับการวางซ้อนพื้น
คุณสามารถเรียกใช้ GroundOverlay.setTag()
เพื่อจัดเก็บออบเจ็กต์ข้อมูลที่กำหนดเองที่มีการวางซ้อนพื้น และดึงออบเจ็กต์ข้อมูลโดยใช้ GroundOverlay.getTag()
ตัวอย่างโค้ดต่อไปนี้จัดเก็บคำอธิบายสตริงที่มีการวางซ้อนพื้นดิน:
Kotlin
val sydneyGroundOverlay = map.addGroundOverlay( GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.harbour_bridge)) .position(LatLng(-33.873, 151.206), 100f) .clickable(true) ) sydneyGroundOverlay?.tag = "Sydney"
Java
GroundOverlay sydneyGroundOverlay = map.addGroundOverlay(new GroundOverlayOptions() .image(BitmapDescriptorFactory.fromResource(R.drawable.harbour_bridge)) .position(new LatLng(-33.873, 151.206), 100) .clickable(true)); sydneyGroundOverlay.setTag("Sydney");
ตัวอย่างสถานการณ์บางส่วนที่เป็นประโยชน์ในการจัดเก็บและดึงข้อมูลที่มีการวางซ้อนภาคพื้นดินมีดังนี้
- แอปของคุณอาจรองรับการวางซ้อนพื้นต่างๆ และคุณต้องการ จัดการกับการวางซ้อนนั้นต่างออกไปเมื่อผู้ใช้คลิก
- คุณอาจกำลังเชื่อมต่อกับระบบที่มีตัวระบุระเบียนที่ไม่ซ้ำกัน ซึ่งการวางซ้อนแสดงถึงระเบียนที่เจาะจงในระบบนั้น
- ข้อมูลโฆษณาซ้อนทับอาจบ่งบอกถึงลำดับความสำคัญในการกำหนดดัชนีลำดับ Z สำหรับโฆษณาซ้อนทับ
จัดการเหตุการณ์การซ้อนทับพื้นดิน
โดยค่าเริ่มต้น การวางซ้อนพื้น
จะไม่สามารถคลิกได้ คุณเปิดและปิดใช้ความสามารถในการคลิกได้โดยเรียกใช้ GroundOverlay.setClickable(boolean)
ใช้ OnGroundOverlayClickListener
เพื่อฟังเหตุการณ์การคลิกบนการวางซ้อนพื้นที่คลิกได้ หากต้องการตั้ง Listener นี้บนแผนที่ ให้โทร GoogleMap.setOnGroundOverlayClickListener(OnGroundOverlayClickListener)
เมื่อผู้ใช้คลิกที่การวางซ้อนพื้น คุณจะได้รับการเรียกกลับ onGroundOverlayClick(GroundOverlay)