İşaretçiler

Platform seçin: Android iOS JavaScript

İşaretçiler haritada tek bir konumu belirtir. İşaretçilerinizi özelleştirebilirsiniz. renk değiştirerek veya işaretçi simgesini özel bir görüntüsüdür. Bilgi pencereleri, bir işaretçiye ek bağlam sağlayabilir.

Kod örnekleri

GitHub'daki ApiDemos deposu, gösteren bir örnekle karşılaşıyorum:

Kotlin

Java

Giriş

İşaretçiler haritada konumları tanımlar. Varsayılan işaretçi, standart bir simgesi, Google Haritalar'da genel olarak görülür. Bu özellik, simgenin rengini, resmini veya sabitleme noktasını API aracılığıyla değiştirin. İşaretçiler türü nesnelerdir Marker ve haritaya şu şekilde eklenir: GoogleMap.addMarker(markerOptions) yöntemi.

İşaretçiler etkileşimli olacak şekilde tasarlanmıştır. Şu tarihe kadar click etkinlik alırlar: kullanılır ve genellikle etkinlik işleyiciler tarafından bilgi pencerelerini ziyaret edin. Bir işaretçinin draggable özelliği true olarak ayarlanıyor kullanıcının işaretçinin konumunu değiştirmesine olanak tanır. Şunlar için uzun basın: işaretçiyi hareket ettirme özelliğini etkinleştirin.

Varsayılan olarak, kullanıcı bir işaretçiye dokunduğunda alt kısımda harita araç çubuğu görünür Kullanıcının Google Haritalar mobil uygulamasına hızlı erişebilmesini sağlar. Araç çubuğunu devre dışı bırakabilirsiniz. Daha fazla bilgi için denetim rehberine bakın.

İşaretçileri kullanmaya başlama

Haritalar Canlı'nın bu bölümünde, haritanıza işaretçi eklemeyle ilgili temel bilgiler ele alınıyor kullanarak Android için Haritalar SDK'sını kullanabilirsiniz.

İşaretçi ekleyin

Aşağıdaki örnekte, haritaya işaretçinin nasıl ekleneceği gösterilmektedir. İşaretçi -33.852,151.211 (Sidney, Avustralya) koordinatlarında oluşturulmuştur ve "Sidney'deki işaretçi" dizesi bir bilgi penceresi içinde görünür.

Kotlin



override fun onMapReady(googleMap: GoogleMap) {
    // Add a marker in Sydney, Australia,
    // and move the map's camera to the same location.
    val sydney = LatLng(-33.852, 151.211)
    googleMap.addMarker(
        MarkerOptions()
            .position(sydney)
            .title("Marker in Sydney")
    )
    googleMap.moveCamera(CameraUpdateFactory.newLatLng(sydney))
}

Java


@Override
public void onMapReady(GoogleMap googleMap) {
    // Add a marker in Sydney, Australia,
    // and move the map's camera to the same location.
    LatLng sydney = new LatLng(-33.852, 151.211);
    googleMap.addMarker(new MarkerOptions()
        .position(sydney)
        .title("Marker in Sydney"));
    googleMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));
}

İşaretçi hakkında ek bilgiler görüntüleme

Bir yer veya işletme hakkında ek bilgi sunmak, kullanıcı haritadaki bir işaretçiye dokunduğunda alınan konum Bu kılavuza göz atın: bilgi pencereleri.

Verileri bir işaretçiyle ilişkilendirme

Marker.setTag() kullanarak işaretçi içeren rastgele bir veri nesnesini depolayabilirsiniz, ve Marker.getTag() kullanarak veri nesnesini alma. Aşağıdaki örnekte, etiketleri kullanarak bir işaretçinin kaç kez tıklandığını sayabilirsiniz:

Kotlin



/**
 * A demo class that stores and retrieves data objects with each marker.
 */
class MarkerDemoActivity : AppCompatActivity(),
    OnMarkerClickListener, OnMapReadyCallback {
    private val PERTH = LatLng(-31.952854, 115.857342)
    private val SYDNEY = LatLng(-33.87365, 151.20689)
    private val BRISBANE = LatLng(-27.47093, 153.0235)

    private var markerPerth: Marker? = null
    private var markerSydney: Marker? = null
    private var markerBrisbane: Marker? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_markers)
        val mapFragment =
            supportFragmentManager.findFragmentById(R.id.map) as SupportMapFragment?
        mapFragment!!.getMapAsync(this)
    }

    /** Called when the map is ready.  */
    override fun onMapReady(map: GoogleMap) {
        // Add some markers to the map, and add a data object to each marker.
        markerPerth = map.addMarker(
            MarkerOptions()
                .position(PERTH)
                .title("Perth")
        )
        markerPerth?.tag = 0
        markerSydney = map.addMarker(
            MarkerOptions()
                .position(SYDNEY)
                .title("Sydney")
        )
        markerSydney?.tag = 0
        markerBrisbane = map.addMarker(
            MarkerOptions()
                .position(BRISBANE)
                .title("Brisbane")
        )
        markerBrisbane?.tag = 0

        // Set a listener for marker click.
        map.setOnMarkerClickListener(this)
    }

    /** Called when the user clicks a marker.  */
    override fun onMarkerClick(marker: Marker): Boolean {

        // Retrieve the data from the marker.
        val clickCount = marker.tag as? Int

        // Check if a click count was set, then display the click count.
        clickCount?.let {
            val newClickCount = it + 1
            marker.tag = newClickCount
            Toast.makeText(
                this,
                "${marker.title} has been clicked $newClickCount times.",
                Toast.LENGTH_SHORT
            ).show()
        }

        // Return false to indicate that we have not consumed the event and that we wish
        // for the default behavior to occur (which is for the camera to move such that the
        // marker is centered and for the marker's info window to open, if it has one).
        return false
    }
}

Java


/**
 * A demo class that stores and retrieves data objects with each marker.
 */
public class MarkerDemoActivity extends AppCompatActivity implements
    GoogleMap.OnMarkerClickListener,
    OnMapReadyCallback {

    private final LatLng PERTH = new LatLng(-31.952854, 115.857342);
    private final LatLng SYDNEY = new LatLng(-33.87365, 151.20689);
    private final LatLng BRISBANE = new LatLng(-27.47093, 153.0235);

    private Marker markerPerth;
    private Marker markerSydney;
    private Marker markerBrisbane;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_markers);
        SupportMapFragment mapFragment =
            (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /** Called when the map is ready. */
    @Override
    public void onMapReady(GoogleMap map) {
        // Add some markers to the map, and add a data object to each marker.
        markerPerth = map.addMarker(new MarkerOptions()
            .position(PERTH)
            .title("Perth"));
        markerPerth.setTag(0);

        markerSydney = map.addMarker(new MarkerOptions()
            .position(SYDNEY)
            .title("Sydney"));
        markerSydney.setTag(0);

        markerBrisbane = map.addMarker(new MarkerOptions()
            .position(BRISBANE)
            .title("Brisbane"));
        markerBrisbane.setTag(0);

        // Set a listener for marker click.
        map.setOnMarkerClickListener(this);
    }

    /** Called when the user clicks a marker. */
    @Override
    public boolean onMarkerClick(final Marker marker) {

        // Retrieve the data from the marker.
        Integer clickCount = (Integer) marker.getTag();

        // Check if a click count was set, then display the click count.
        if (clickCount != null) {
            clickCount = clickCount + 1;
            marker.setTag(clickCount);
            Toast.makeText(this,
                marker.getTitle() +
                    " has been clicked " + clickCount + " times.",
                Toast.LENGTH_SHORT).show();
        }

        // Return false to indicate that we have not consumed the event and that we wish
        // for the default behavior to occur (which is for the camera to move such that the
        // marker is centered and for the marker's info window to open, if it has one).
        return false;
    }
}

Aşağıda, verileri depolamanın ve almanın yararlı olduğu senaryolarla ilgili bazı örnekler verilmiştir işaretçilerle:

  • Uygulamanız farklı türde işaretçiler sunuyor olabilir ve bunları kullanmak istiyorsunuz farklı şekilde ele alacağız. Bunu yapmak için, Türü belirten işaretçiyle String.
  • Benzersiz kayıt tanımlayıcıları olan bir sistemle çalışıyor olabilirsiniz. burada işaretçiler, söz konusu sistemdeki belirli kayıtları temsil eder.
  • İşaretçi verileri, bir öğenin Z-endeksine karar verilirken kullanılacak bir öncelik belirtebilir kullanabilirsiniz.

İşaretçiyi sürüklenebilir hale getirme

Haritaya eklenen bir işaretçiyi yeniden konumlandırabilmeniz için, draggable özelliği true olarak ayarlandı. Etkinleştirmek için işaretçiye uzun basın tıklayın. Parmağınızı ekrandan kaldırdığınızda, işaretçi görebilirsiniz.

İşaretçiler varsayılan olarak sürüklenemez. İşaretçiyi açıkça eklemeden önce MarkerOptions.draggable(boolean) ile sürüklenebilir haritada veya haritaya eklendikten sonra Marker.setDraggable(boolean). İşaretçi üzerindeki sürükleme etkinliklerini dinleyebilirsiniz (İşaretçi sürükleme etkinliğinde açıklandığı gibi). etkinlikler ile ilgili daha fazla bilgi edinin.

Aşağıdaki snippet'te Avustralya'nın Perth şehrinde sürüklenebilir bir işaretçi eklendi.

Kotlin



val perthLocation = LatLng(-31.90, 115.86)
val perth = map.addMarker(
    MarkerOptions()
        .position(perthLocation)
        .draggable(true)
)

Java


final LatLng perthLocation = new LatLng(-31.90, 115.86);
Marker perth = map.addMarker(
    new MarkerOptions()
        .position(perthLocation)
        .draggable(true));

İşaretçiyi özelleştirme

Bu videoda, konumları haritada görselleştirmek için işaretçilerin nasıl kullanıldığı gösterilmektedir.

İşaretçiler, varsayılan simgenin yerine gösterilecek özel bir resim tanımlayabilir. Bir simgenin tanımlanması, o simgenin tanımlanmasını etkileyen bir dizi özelliğin işaretçinin görsel davranışını kontrol eder.

İşaretçiler, aşağıdaki özellikler aracılığıyla özelleştirmeyi destekler:

Konum (Zorunlu)
LatLng değer. Sadece bu özelliği hakkında daha fazla bilgi edinin.Marker
Bağlayıcı
Resimde, grafiğin EnlBoy konumuna yerleştirilecek nokta kullanabilirsiniz. Bu değer, varsayılan olarak resmin alt kısmının ortasına ayarlanır.
Alfa
İşaretçinin opaklığını ayarlar. Varsayılan olarak 1.0 değerine ayarlanır.
Başlık
Kullanıcı kullanabilirsiniz.
Snippet
Başlığın altında gösterilen ek metin.
Simge
Varsayılan işaretçi resminin yerine görüntülenen bir bit eşlem.
Sürüklenebilir
Kullanıcının taşımasına izin vermek istiyorsanız ayarı true olarak ayarlayın tıklayın. Varsayılan olarak false değerine ayarlanır.
Gösteriliyor
İşaretçiyi görünmez yapmak için false olarak ayarlayın. Varsayılan değer: true
Düz veya İlan Tahtası yönü
İşaretçiler, varsayılan olarak ilan tahtası yönünü kullanır. Yani, cihaz ekranına göre değil, harita yüzeyine göre ayarlanır. Haritayı döndürmek, yatırmak veya yakınlaştırmak sayfanın yönünü değiştirmez kullanabilirsiniz. İşaretçinin yönünü dünya üzerinde düz olacak şekilde ayarlayabilirsiniz. Düz işaretçiler, harita döndürüldüğünde döner ve harita döndürüldüğünde perspektifi harita eğik. İlan tahtası işaretçilerinde olduğu gibi, düz işaretçiler de yakınlaştırılır veya uzaklaştırılır.
Döndürme
İşaretçinin yönü (saat yönünde derece cinsinden belirtilir). Varsayılan Konum değişir. Bir düzlem için varsayılan konum İşaretçi kuzey hizasındadır. İşaretçi düz görünmediğinde varsayılan yukarı işaret ediyor ve dönüş, işaretçi her zaman bakmaktır.

Aşağıdaki snippet, varsayılan simgeyi içeren basit bir işaretçi oluşturur.

Kotlin



val melbourneLocation = LatLng(-37.813, 144.962)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLocation)
)

Java


final LatLng melbourneLocation = new LatLng(-37.813, 144.962);
Marker melbourne = map.addMarker(
    new MarkerOptions()
        .position(melbourneLocation));

İşaretçi rengini özelleştir

Varsayılan işaretçi resminin rengini, bir BitmapDescriptor nesnesini icon() yöntemine ekleyin. Hedeflerinize göre BitmapDescriptorFactory özelliğinde önceden tanımlanmış renkler veya BitmapDescriptorFactory.defaultMarker(float hue) yöntemi. Ton, bir değerdir renk çemberindeki noktaları temsil eden 0 ile 360 arasında bir değerdir.

Kotlin



val melbourneLocation = LatLng(-37.813, 144.962)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLocation)
        .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE))
)

Java


final LatLng melbourneLocation = new LatLng(-37.813, 144.962);
Marker melbourne = map.addMarker(
    new MarkerOptions()
        .position(melbourneLocation)
        .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE)));

İşaretçi opaklığını özelleştirin

Bir işaretçinin opaklığını MarkerOptions.alpha() yöntemiyle kontrol edebilirsiniz. Alfa, 0,0 ile 1,0 arasında bir hareketli değer olarak belirtilmelidir. 0, tamamen şeffaf ve 1 tamamen opaktır.

Kotlin



val melbourneLocation = LatLng(-37.813, 144.962)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLocation)
        .alpha(0.7f)
)

Java


final LatLng melbourneLocation = new LatLng(-37.813, 144.962);
Marker melbourne = map.addMarker(new MarkerOptions()
    .position(melbourneLocation)
    .alpha(0.7f));

İşaretçi resmini özelleştirin

Varsayılan işaretçi resmini özel bir işaretçi resmiyle değiştirebilirsiniz. bir simge kullanır. Özel simgeler her zaman BitmapDescriptor olarak ayarlanır ve yöntemlerden biri kullanılarak tanımlanan BitmapDescriptorFactory sınıfı.

fromAsset(String assetName)
Öğelerde bir bit eşlem resminin adını kullanarak özel bir işaretçi oluşturur. dizin.
fromBitmap(Bitmap image)
Bit eşlem görüntüsünden özel işaretçi oluşturur.
fromFile(String fileName)
dahili depolama.
fromPath(String absolutePath)
Bir bit eşlemi görüntüsünün mutlak dosya yolundan özel işaretçi oluşturur.
fromResource(int resourceId)
Bir bit eşlemi görüntüsünün kaynak kimliğini kullanarak özel işaretçi oluşturur.

Aşağıdaki snippet, özel simge içeren bir işaretçi oluşturuyor.

Kotlin



val melbourneLocation = LatLng(-37.813, 144.962)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLocation)
        .title("Melbourne")
        .snippet("Population: 4,137,400")
        .icon(BitmapDescriptorFactory.fromResource(R.drawable.arrow))
)

Java


final LatLng melbourneLocation = new LatLng(-37.813, 144.962);
Marker melbourne = map.addMarker(
    new MarkerOptions()
        .position(melbourneLocation)
        .title("Melbourne")
        .snippet("Population: 4,137,400")
        .icon(BitmapDescriptorFactory.fromResource(R.drawable.arrow)));

İşaretçiyi düzeltme

İşaretçi simgeleri normalde ekrana göre çizilir; döndürme, yatırma veya haritayı yakınlaştırmak, işaretçinin yönünü değiştirmez. Faturalandırma hesabınızdaki ücretleri takip etmek için işaretçinin yönünü dünya üzerinde düz olacak şekilde ayarlayın. İşaretçiler: harita döndürüldüğünde de dönecek ve perspektifi değiştirecektir hareket ettirebilirsiniz. Düz işaretçilerin boyutu korunurken, harita yakınlaştırın veya uzaklaştırın.

İşaretçinin yönünü değiştirmek için flat özelliğini true.

Kotlin



val perthLocation = LatLng(-31.90, 115.86)
val perth = map.addMarker(
    MarkerOptions()
        .position(perthLocation)
        .flat(true)
)

Java


final LatLng perthLocation = new LatLng(-31.90, 115.86);
Marker perth = map.addMarker(
    new MarkerOptions()
        .position(perthLocation)
        .flat(true));

İşaretçiyi döndürme

Bir işaretçiyi, sabitleme noktası etrafında döndürebilirsiniz. MarkersetRotation() yöntemini çağırın. Dönüş, saat yönünde derece cinsinden ölçülür bu şekilde ayarlayabilirsiniz. İşaretçi haritada düz olduğunda, varsayılan kuzeydir. İşaretçi düz olmadığında varsayılan konum yukarı doğru ve işaretçi her zaman kameraya bakacak şekilde döndürülür.

Aşağıdaki örnekte işaretçi 90° döndürülür. Sabitleme noktasını 0.5,0.5, işaretçinin kendi çevresinde değil, kendi etrafında döndürülmesine neden olur. büyütmek açısından önemlidir.

Kotlin



val perthLocation = LatLng(-31.90, 115.86)
val perth = map.addMarker(
    MarkerOptions()
        .position(perthLocation)
        .anchor(0.5f, 0.5f)
        .rotation(90.0f)
)

Java


final LatLng perthLocation = new LatLng(-31.90, 115.86);
Marker perth = map.addMarker(
    new MarkerOptions()
        .position(perthLocation)
        .anchor(0.5f,0.5f)
        .rotation(90.0f));

İşaretçi z-endeksi

Z-endeksi, bu işaretçinin diğer işaretçilere göre grup sırasını belirtir. tıklayın. Z-endeksi yüksek olan bir işaretçi, alt yönü düşük olan işaretçilerin üzerine çizilir z endeksleridir. Varsayılan Z-endeksi değeri 0 olarak ayarlanmıştır.

MarkerOptions.zIndex(), aşağıdaki kod snippet'inde gösterildiği gibi:

Kotlin



map.addMarker(
    MarkerOptions()
        .position(LatLng(10.0, 10.0))
        .title("Marker z1")
        .zIndex(1.0f)
)

Java


map.addMarker(new MarkerOptions()
    .position(new LatLng(10, 10))
    .title("Marker z1")
    .zIndex(1.0f));

İşaretçinin Z-endeksine erişmek için Marker.getZIndex() kodunu çağırın. Marker.setZIndex() numaralı telefonu arayarak bunu değiştirebilirsiniz.

İşaretçiler her zaman karo katmanlarının ve işaretleyici olmayan diğer bindirmelerin (zemin veya döşeme) üzerine çizilir örtüşme, çoklu çizgiler, poligonlar ve diğer şekiller) yer paylaşımlı olarak kullanabilirsiniz. İşaretçiler etkin bir şekilde ayrı bir Z-endeksi grubu, diğer yer paylaşımlarıyla karşılaştırıldığında

Aşağıdaki Z-endeksinin tıklama etkinlikleri üzerindeki etkisi hakkında bilgi edinin.

Herkese açık kullanıcı adı etkinlikleri

Haritalar API'si, işaretçi etkinliklerini dinlemenize ve yanıtlamanıza olanak tanır. Dinlemek için bu etkinlikler için GoogleMap üzerinde ilgili işleyiciyi ayarlamanız gerekir bir nesnedir. Etkinlik dinleyicinin geri çağırması, ekranın üzerinde bulunan işaretçilerle karşılık gelen Marker nesnesini ifade eder. Bunu karşılaştırmak için Marker nesnesine kendi referansınıza sahip Marker nesnesi; == değil equals().

Aşağıdaki etkinlikleri dinleyebilirsiniz:

İşaretçi tıklama etkinlikleri

Dinlemek için OnMarkerClickListener kullanabilirsiniz için de aynı talimatları uygulayın. Bu işleyiciyi haritaya eklemek için şu numarayı arayın: GoogleMap.setOnMarkerClickListener(OnMarkerClickListener) Kullanıcı bir işaretçiyi tıkladığında, onMarkerClick(Marker) çağrılır ve işaretçi geçirilebilir. Bu yöntem, etkinliği kullanıp kullanmadığınız (diğer bir deyişle, varsayılan ) gösterir. false değerini döndürürse varsayılan davranış şurada gerçekleşir: yardımcı olacak bir uygulamadır. İşaretçi tıklaması için varsayılan davranış bilgi penceresini (varsa) göstermek ve fotoğraf makinesini, işaretçiyi harita üzerinde ortalayacak şekilde ayarlayın.

Z-endeksinin tıklama etkinlikleri üzerindeki etkisi:

  • Kullanıcı bir işaretçi kümesini tıkladığında tıklama etkinliği şunun için tetiklenir: en yüksek Z-endeksine sahip işaretçiyi seçin.
  • Tıklama başına en fazla bir etkinlik tetiklenir. Başka bir deyişle, tıklama alt Z-endeksi değerlerine sahip işaretçilere veya diğer bindirmelere aktarılmaktadır.
  • Bir işaretçi kümesini tıkladığınızda, sonraki tıklamaların teker teker seçin. Döngüde ilk öncelik sıralaması Z-endeksi, ardından tıklama noktasına yakınlık.
  • Kullanıcı kümenin yakınlığının dışında bir yeri tıklarsa API, yeniden hesaplama yaparak devre dışı bırakır ve tıklama döngüsünün durumunu sıfırlar. Böylece, döngü başlar.
  • Tıklama etkinliği, işaretçi kümelerinden diğer şekillere ve yer paylaşımlarına denk gelir yeniden başlatmadan önce çalıştırın.
  • İşaretçiler, diğerlerine kıyasla etkili bir şekilde ayrı bir Z-endeksi grubunda yer alır. diğer bindirmelere ya da şekillere (çoklu çizgiler, poligonlar, daireler ve/veya zemin) bulunur. Birden fazla İşaretçiler, yer paylaşımları veya şekiller, tıklama etkinliğinin üzerine yerleştirilmiştir. önce işaretçi kümesi üzerinden döndürülür, ardından tıklanabilir yer paylaşımları veya şekiller gösterilir.

İşaretçi sürükleme etkinlikleri

Dinlemek için OnMarkerDragListener kullanabilirsiniz bir işaretçiye sürükleyebilirsiniz. Bu işleyiciyi haritaya eklemek için şu numarayı arayın: GoogleMap.setOnMarkerDragListener İşaretçiyi sürüklemek için kullanıcının uzun basması gerekir tıklayın. Kullanıcı parmağını ekrandan kaldırdığında, işaretçi o konumda kalmaya devam eder. Bir işaretçi sürüklendiğinde onMarkerDragStart(Marker) başlangıçta çağrılır. İşaretçi onMarkerDrag(Marker), sürekli olarak çağrılır. Sürüklemenin sonunda onMarkerDragEnd(Marker) çağrıldı. İşaretçinin konumunu dilediğiniz zaman Marker.getPosition() numaralı telefonu arayabilirsiniz.