تخصيص محدّد الموقع الأساسي

هذا المنتج أو الميزة تجريبيان (مرحلة ما قبل التوفّر للجمهور العام). قد يكون الدعم المقدّم للمنتجات والميزات في مرحلة ما قبل التوفّر للجمهور العام محدودًا، وقد لا تكون التغييرات التي يتم إجراؤها على المنتجات والميزات هنا متوافقة مع الإصدارات الأخرى من هذه المرحلة. تخضع عروض مرحلة ما قبل التوفّر للجمهور العام لبنود الخدمة المحدّدة في منصة خرائط Google. لمزيد من المعلومات، يُرجى الاطّلاع على أوصاف مراحل الإطلاق.

اختيار النظام الأساسي: Android iOS JavaScript

يمكنك تخصيص مظهر مواد الطباعة من خلال ضبط عنصر PinStyle. يوفر النوع PinStyle خيارات لتغيير لون الخلفية و الحدود ونص الحرف الرسومي ولونه، الارتفاع ، والصورة المطلوب استخدامها، والمزيد من الخيارات للتخصيص الإضافي.

يعرض نموذج الرمز البرمجي التالي كيفية إنشاء مادة طباعة جديدة وتنسيقها باستخدام بعض خيارات التخصيص المتاحة:

Map(mode: .hybrid) {
  Marker3D(
      position: .init(latitude: 51.5074, longitude: -0.1278, altitude: 0.0),
      label: "London",
      style: .pin(.init(scale: 2.0))
  )
}

توضّح لك هذه الصفحة كيفية تخصيص مواد الطباعة بالطرق التالية:

• تغيير حجم مادة الطباعة
• تغيير لون الخلفية
• تغيير لون الحدود
• إضافة نص إلى حرف رسومي

تغيير حجم مادة الطباعة

لتغيير حجم مادة الطباعة، استخدِم الخيار scale:

Map(mode: .hybrid) {
  Marker3D(
      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){
  Marker3D(
    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){
  Marker3D(
    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){
  Marker3D(
    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
    }
  )
}