การปรับแต่งเครื่องหมายพื้นฐาน

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

รูปภาพ 3 มิติของนครนิวยอร์กที่มีอาคารเอ็มไพร์สเตตพร้อมเครื่องหมายดิจิทัลที่กำหนดเอง 3 รายการลอยอยู่ด้านบน ซึ่งรวมถึงกอริลลาการ์ตูนที่มีป้ายกำกับ

คุณปรับแต่งลักษณะที่ปรากฏของเครื่องหมายได้โดยใช้ตัวสร้าง pinConfiguration ตัวสร้าง pinConfiguration มีเมธอดสำหรับการเปลี่ยนสีพื้นหลังและสีเส้นขอบ ข้อความและสีของสัญลักษณ์ ระดับความสูง รูปภาพที่จะใช้ และตัวเลือกอื่นๆ สำหรับการปรับแต่งเพิ่มเติม

ตัวอย่างโค้ดต่อไปนี้แสดงวิธีสร้างเครื่องหมายใหม่และจัดสไตล์โดยใช้ตัวเลือกการปรับแต่งที่พร้อมใช้งานบางรายการ

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     backgroundColor = Color.GREEN
     borderColor = Color.GREEN
     glyph = Glyph.fromColor(Color.RED)
   }
 }
)

หน้านี้แสดงวิธีปรับแต่งเครื่องหมายด้วยวิธีต่อไปนี้

ปรับขนาดเครื่องหมาย

หากต้องการปรับขนาดเครื่องหมาย ให้ใช้ตัวเลือก scale ดังนี้

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     scale = 3.14
   }
 }
)

เปลี่ยนสีพื้นหลัง

ใช้ตัวเลือก PinElement.background เพื่อเปลี่ยนสีพื้นหลังของเครื่องหมายระหว่างการสร้าง ดังนี้

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     backgroundColor = Color.GREEN
   }
 }
)

เปลี่ยนสีเส้นขอบ

ใช้ตัวเลือก markerOptions.borderColor เพื่อเปลี่ยนสีเส้นขอบของเครื่องหมายระหว่างการสร้าง ดังนี้

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     borderColor = Color.GREEN
   }
 }
)

เพิ่มข้อความลงในสัญลักษณ์

ใช้เมธอด markerOptions.glyph เพื่อแทนที่สัญลักษณ์เริ่มต้นด้วยอักขระข้อความ สัญลักษณ์ข้อความของเครื่องหมายจะปรับขนาดตามเครื่องหมาย ดังนี้

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     glyph = Glyph.fromText("G")
   }
 }
)

ใช้รูปภาพเป็นเครื่องหมาย

Map.addMarker(markerOptions {
  position = latLngAltitude {
      latitude = 40.7484
      longitude = -73.9857
      altitude = 100.0
  }
  zIndex = 1
  label = "Empire State Building"
  isExtruded = true
  isDrawnWhenOccluded = true
  altitudeMode = AltitudeMode.RELATIVE_TO_MESH
  setStyle(ImageView(R.drawable.ook))
})

นำเครื่องหมายออก

ใช้ Marker.remove() เพื่อนำเครื่องหมายออกจากแผนที่

marker.remove();