شما میتوانید ظاهر نشانگرها را با پیکربندی شیء PinStyle سفارشی کنید. نوع PinStyle گزینههایی برای تغییر رنگ پسزمینه و حاشیه، متن و رنگ گلیف، ارتفاع، تصویر مورد استفاده و گزینههای بیشتر برای سفارشیسازی بیشتر ارائه میدهد.
نمونه کد زیر نحوه ایجاد یک نشانگر جدید و استایلدهی به آن با استفاده از برخی از گزینههای سفارشیسازی موجود را نشان میدهد:
Map(mode: .hybrid) {
Marker(
position: .init(latitude: 51.5074, longitude: -0.1278, altitude: 0.0),
label: "London",
style: .pin(.init(scale: 2.0))
)
}
این صفحه به شما نحوه سفارشیسازی نشانگرها را به روشهای زیر نشان میدهد:
مقیاس نشانگر
برای مقیاسبندی یک نشانگر، از گزینه scale استفاده کنید:
Map(mode: .hybrid) {
Marker(
position: .init(latitude: 35.6762, longitude: 139.6503, altitude: 0.0),
label: "Tokyo",
style: .pin(
.init(
backgroundColor: .blue,
borderColor: .yellow,
scale: 2.0
) {Text("G").minimumScaleFactor(0.01)}
)
)
}
رنگ پسزمینه را تغییر دهید
از گزینه PinElement.background برای تغییر رنگ پسزمینه یک نشانگر استفاده کنید:
Map(mode: .hybrid){
Marker(
position: .init(latitude: 48.8566, longitude: 2.3522, altitude: 0.0),
label: "Paris",
style: .pin(.init(backgroundColor: .yellow)) // Changes the pin's background color
)
}
تغییر رنگ حاشیه
از گزینه markerOptions.borderColor برای تغییر رنگ حاشیه یک نشانگر استفاده کنید:
Map(mode: .hybrid){
Marker(
position: .init(latitude: -22.9068, longitude: -43.1729, altitude: 0.0),
label: "Rio de Janeiro",
style: .pin(.init(backgroundColor: .green, borderColor: .brown)) // Customizes the pin border
)
}
متن را به یک گلیف اضافه کنید
از متد markerOptions.glyph برای جایگزینی گلیف پیشفرض با یک کاراکتر متنی استفاده کنید. گلیف متنی نشانگر با توجه به نشانگر تغییر اندازه میدهد:
Map(mode: .hybrid){
Marker(
position: .init(latitude: 25.2048, longitude: 55.2708, altitude: 0.0),
label: "Dubai",
style: .pin(.init(backgroundColor: .green)) {
Text("D") // Adds text inside the marker glyph
}
)
}