Tworzenie zaawansowanego znacznika

Wybierz platformę: Android iOS JavaScript

Aby dodać do mapy zaawansowane znaczniki, utwórz nowy egzemplarz klasy AdvancedMarkerOptions, a potem użyj metody GoogleMap.addMarker(), aby dodać znacznik:

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() zwraca wystąpienie Marker. W razie potrzeby możesz przypisać zwróconą wartość do zmiennej AdvancedMarker.

Użyj AdvancedMarkerOptions, aby skonfigurować znaczniki zaawansowane. AdvancedMarkerOptions jest podklasą MarkerOptions, więc obsługuje te same ustawienia co MarkerOptions.

AdvancedMarkerOptions umożliwia też:

  • Utwórz instancję klasy PinConfig, a następnie użyj instancji PinConfig do skonfigurowania instancji AdvancedMarkerOptions.

    Użyj opcji PinConfig, aby dostosować zaawansowane właściwości znacznika, takie jak kolor tła, kolor obramowania i glif.

  • Utwórz instancję klasy View w Androidzie i użyj jej do skonfigurowania instancji AdvancedMarkerOptions.

    Widok instancji umożliwia pełne dostosowanie znacznika.

Używanie elementu PinConfig

Klasa PinConfig zawiera opcje dostosowywania zaawansowanych znaczników. Używaj PinConfig do:

  • Zmiana koloru tła
  • Zmiana koloru obramowania
  • Zmienianie koloru glifu lub dodawanie tekstu
  • Ukrywanie znaku
Diagram przedstawiający części znacznika zaawansowanego.
Ilustracja 1. Części zaawansowanego znacznika

Aby utworzyć instancję PinConfig, użyj aplikacji PinConfig.Builder:

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);

Zmiana koloru tła

Aby zmienić kolor tła znacznika, użyj metody 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();

Zmiana koloru obramowania

Aby zmienić kolor obramowania znacznika, użyj metody 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();

Zmień znak

Utwórz instancję Glyph, a następnie użyj jej do skonfigurowania usługi PinConfig. Za pomocą glifu możesz ustawić tekst i kolor tekstu, kolor glifu lub podać niestandardowy obraz, który ma być używany jako glif.

W tym przykładzie ustawiamy tekst glifów:

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();

Ustaw kolor znaku:

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();

Ustaw niestandardowy obraz glifu. Ta metoda jest przydatna, jeśli chcesz użyć w markerze logo niestandardowego lub innego wizualnego wskaźnika.

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();

Ukrywanie znaku

Możesz ukryć glif, aby kolor tła wypełniał cały znacznik:

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();

Ikona widoku

Metoda AdvancedMarkerOptions.iconView() umożliwia użycie dowolnego Androida View jako znacznika. Korzystając z widoku jako znacznika, masz pełną kontrolę nad tym znacznikiem.

W aplikacji najpierw utwórz widok, a potem za pomocą metody AdvancedMarkerOptions.iconView() dodaj go do znaczników zaawansowanych.

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));

Dalsze kroki: