יצירת סמן מתקדם

בחירת פלטפורמה: Android iOS JavaScript

כדי להוסיף סמנים מתקדמים למפה, צריך ליצור מופע חדש של AdvancedMarkerOptions ואז להשתמש GoogleMap.addMarker() כדי להוסיף את הסמן:

Kotlin

private val SYDNEY = LatLng(-33.87365, 151.20689)

val marker: Marker? = map.addMarker(
    AdvancedMarkerOptions()
        .position(SYDNEY)
        .iconView(textView)
        .zIndex(zIndex)
)

Java

private final LatLng SYDNEY = new LatLng(-33.87365, 151.20689);

Marker marker = map.addMarker(
    new AdvancedMarkerOptions()
        .position(SYDNEY)
        .iconView(textView)
        .zIndex(zIndex));

הפונקציה GoogleMap.addMarker() מחזירה מופע של Marker. במקרה הצורך, אפשר להמיר את הערך המוחזר אל AdvancedMarker

השתמש ב-AdvancedMarkerOptions כדי להגדיר סמנים מתקדמים. AdvancedMarkerOptions הוא תת-מחלקה של MarkerOptions לכן הוא תומך בכל ההגדרות כמו MarkerOptions.

האפליקציה AdvancedMarkerOptions מאפשרת גם:

  • יוצרים מופע של PinConfig בכיתה, ואז להשתמש בפונקציה PinConfig כדי להגדיר את המכונה AdvancedMarkerOptions.

    אפשר להשתמש ב-PinConfig כדי להתאים אישית מאפיינים מתקדמים של סמנים, כמו צבע רקע, צבע גבול וגליף.

  • יוצרים מופע של Android כיתה View ומשתמשים במופע הזה כדי להגדיר את המכונה AdvancedMarkerOptions.

    המופע של View מאפשר להתאים אישית את הסמן באופן מלא.

שימוש ב-PinConfig

הכיתה PinConfig מכילה אפשרויות להתאמה אישית של סמנים מתקדמים. אפשר להשתמש ב-PinConfig כדי:

  • שינוי צבע הרקע
  • שינוי של צבע הגבולות
  • שינוי הצבע של הגליף או הוספת טקסט
  • הסתרת הגליף
דיאגרמה שמראה את החלקים של סמן מתקדם.
איור 1: החלקים של סמן מתקדם.

משתמשים ב-PinConfig.Builder כדי ליצור מכונה של PinConfig:

Kotlin

// Use PinConfig.Builder to create an instance of PinConfig.
val pinConfigBuilder: PinConfig.Builder = PinConfig.builder()
pinConfigBuilder.setBackgroundColor(Color.MAGENTA)
val pinConfig: PinConfig = pinConfigBuilder.build()



// Use the  PinConfig instance to set the icon for AdvancedMarkerOptions.
val advancedMarkerOptions: AdvancedMarkerOptions = AdvancedMarkerOptions()
    .icon(BitmapDescriptorFactory.fromPinConfig(pinConfig))
    .position(MARKER_POSITION)



// Pass the AdvancedMarkerOptions instance to addMarker().
val marker: Marker? = map.addMarker(advancedMarkerOptions)

Java

// Use PinConfig.Builder to create an instance of PinConfig.
PinConfig.Builder pinConfigBuilder = PinConfig.builder();
pinConfigBuilder.setBackgroundColor(Color.MAGENTA);
PinConfig pinConfig = pinConfigBuilder.build();

// Use the  PinConfig instance to set the icon for AdvancedMarkerOptions.
AdvancedMarkerOptions advancedMarkerOptions =
    new AdvancedMarkerOptions()
        .icon(BitmapDescriptorFactory.fromPinConfig(pinConfig))
        .position(MARKER_POSITION);

// Pass the AdvancedMarkerOptions instance to addMarker().
Marker marker = map.addMarker(advancedMarkerOptions);

שינוי צבע הרקע

משתמשים בשיטה PinConfig.background() כדי לשנות את צבע הרקע של עט סימון:

Kotlin

// Use PinConfig.Builder to create an instance of PinConfig.
val pinConfigBuilder: PinConfig.Builder = PinConfig.builder()
pinConfigBuilder.setBackgroundColor(Color.MAGENTA)
val pinConfig: PinConfig = pinConfigBuilder.build()

Java

// Use PinConfig.Builder to create an instance of PinConfig.
PinConfig.Builder pinConfigBuilder = PinConfig.builder();
pinConfigBuilder.setBackgroundColor(Color.MAGENTA);
PinConfig pinConfig = pinConfigBuilder.build();

שינוי של צבע הגבולות

משתמשים בשיטה PinConfig.borderColor() כדי לשנות את צבע הגבול של עט סימון:

Kotlin

// Set the border color.
val pinConfigBuilder: PinConfig.Builder = PinConfig.builder()
pinConfigBuilder.setBorderColor(Color.BLUE)
val pinConfig: PinConfig = pinConfigBuilder.build()

Java

// Set the border color.
PinConfig.Builder pinConfigBuilder = PinConfig.builder();
pinConfigBuilder.setBorderColor(Color.BLUE);
PinConfig pinConfig = pinConfigBuilder.build();

שינוי הגליף

יוצרים מכונה של Glyph ומשתמשים בה כדי להגדיר את PinConfig. משתמשים בגליף כדי להגדיר את הטקסט והצבע של הגליף, את צבע הגליף לציין תמונה מותאמת אישית שתשמש כגליף.

הדוגמה הבאה מגדירה את טקסט הגליף:

Kotlin

// Set the glyph text.
val pinConfigBuilder: PinConfig.Builder = PinConfig.builder()
val glyphText = Glyph("A")

// Alteratively, you can set the text color:
// Glyph glyphText = new Glyph("A", Color.GREEN);

pinConfigBuilder.setGlyph(glyphText)
val pinConfig: PinConfig = pinConfigBuilder.build()

Java

// Set the glyph text.
PinConfig.Builder pinConfigBuilder = PinConfig.builder();
PinConfig.Glyph glyphText = new PinConfig.Glyph("A");

// Alternatively, you can set the text color:
// PinConfig.Glyph glyphText = new PinConfig.Glyph("A", Color.GREEN);

pinConfigBuilder.setGlyph(glyphText);
PinConfig pinConfig = pinConfigBuilder.build();

מגדירים את צבע הגליף:

Kotlin

val glyphColor = PinConfig.Glyph(Color.BLUE)
pinConfigBuilder.setGlyph(glyphColor)
val pinConfig: PinConfig = pinConfigBuilder.build()

Java

PinConfig.Glyph glyphColor = new PinConfig.Glyph(Color.BLUE);
pinConfigBuilder.setGlyph(glyphColor);
PinConfig pinConfig = pinConfigBuilder.build();

הגדרת תמונה מותאמת אישית לגליף. השיטה הזו שימושית אם רוצים להשתמש לוגו מותאם אישית או סימן חזותי אחר בסמן.

Kotlin

// Set the glyph image.
val glyphImage: Int = R.drawable.example_image
val descriptor = PinConfig.BitmapDescriptorFactory.fromResource(glyphImage)
pinConfigBuilder.setGlyph(Glyph(descriptor))
val pinConfig: PinConfig = pinConfigBuilder.build()

Java

// Set the glyph image.
int glyphImage = R.drawable.example_image;
BitmapDescriptor descriptor = BitmapDescriptorFactory.fromResource(glyphImage);
pinConfigBuilder.setGlyph(new PinConfig.Glyph(descriptor));
PinConfig pinConfig = pinConfigBuilder.build();

הסתרת הגליף

ניתן להסתיר את הגליף כך שצבע הרקע ימלא את כל הסמן:

Kotlin

// Create a transparent glyph.
val pinConfigBuilder: PinConfig.Builder = PinConfig.builder()
pinConfigBuilder.setBackgroundColor(Color.MAGENTA)
pinConfigBuilder.setGlyph(PinConfig.Glyph(Color.TRANSPARENT))
val pinConfig: PinConfig = pinConfigBuilder.build()

Java

// Create a transparent glyph.
PinConfig.Builder pinConfigBuilder = PinConfig.builder();
pinConfigBuilder.setBackgroundColor(Color.MAGENTA);
pinConfigBuilder.setGlyph(new PinConfig.Glyph(Color.TRANSPARENT));
PinConfig pinConfig = pinConfigBuilder.build();

שימוש ב-iconView

השיטה AdvancedMarkerOptions.iconView() מאפשרת לכם להשתמש בכל מכשירי Android View כסמן. כשמשתמשים בתצוגה כסימן, יש לכם שליטה מלאה על הסמן.

באפליקציה שלך, קודם יוצרים את התצוגה ואז משתמשים AdvancedMarkerOptions.iconView() להוספת התצוגה וסמנים מתקדמים.

Kotlin

// Create a TextView to use as the marker.
val textView = TextView(this)
textView.text = "Hello!!"
textView.setBackgroundColor(Color.BLACK)
textView.setTextColor(Color.YELLOW)

val marker: Marker? = map.addMarker(
    AdvancedMarkerOptions()
        .position(SYDNEY)
        .iconView(textView)
)

Java

// Create a TextView to use as the marker.
TextView textView = new TextView(this);
textView.setText("Hello!!");
textView.setBackgroundColor(Color.BLACK);
textView.setTextColor(Color.YELLOW);

Marker marker = map.addMarker(
    new AdvancedMarkerOptions()
        .position(SYDNEY)
        .iconView(textView));

השלבים הבאים: