หน้านี้ได้รับการแปลโดย Cloud Translation API

การวางซ้อนพื้น

เลือกแพลตฟอร์ม: Android iOS JavaScript

การวางซ้อนภาคพื้นดินคือภาพซ้อนทับที่สัมพันธ์กับพิกัดละติจูด/ลองจิจูด เพื่อจะเคลื่อนที่เมื่อคุณลากหรือซูมแผนที่

ตัวอย่างโค้ด

ที่เก็บ 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)

หมายเหตุ: หากมีการวางซ้อนหรือรูปร่างหลายรายการ (เครื่องหมาย โพลีไลน์ รูปหลายเหลี่ยม วงกลม และ/หรือการวางซ้อนพื้น) วางซ้อนกัน กิจกรรมการคลิกจะหมุนเวียนไปตามกลุ่มเครื่องหมายก่อน จากนั้นจะทริกเกอร์ให้การวางซ้อนหรือรูปร่างอื่นๆ ที่คลิกได้ตามค่าดัชนี z มีการทริกเกอร์เหตุการณ์ไม่เกิน 1 เหตุการณ์ต่อคลิก กล่าวคือ ระบบจะไม่ส่งต่อคลิกไปยังการวางซ้อนหรือรูปร่างที่มีค่าดัชนีลำดับ Z ต่ำกว่า อ่านข้อมูลเพิ่มเติมเกี่ยวกับเหตุการณ์ z-index ของเครื่องหมายมาตรฐานและการคลิก