İşaretçiler

Platform seçin: Android iOS JavaScript

İşaretçiler haritada tek bir konumu belirtir. Varsayılan rengi değiştirerek veya işaretçi simgesini özel bir resimle değiştirerek işaretçilerinizi özelleştirebilirsiniz. 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. Varsayılan olarak click etkinlikleri alırlar ve genellikle bilgi pencerelerini açmak için etkinlik işleyicilerle birlikte kullanılırlar. 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 kılavuzuna göz atı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 göstermek, 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 rastgele bir veri nesnesini işaretçiyle saklayabilir ve Marker.getTag() kullanarak veri nesnesini alabilirsiniz. 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ünü belirten işaretleyiciyle bir String saklayabilirsiniz.
  • İşaretçilerin, söz konusu sistemdeki belirli kayıtları temsil ettiği, benzersiz kayıt tanımlayıcılarına sahip bir sistemle arayüz oluşturabilirsiniz.
  • İşaretçi verileri, bir işaretçinin z-dizinine karar verirken kullanılacak önceliği belirtebilir.

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

Haritaya eklendikten sonra, işaretleyicinin doğru yere 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. Simge tanımlamak, işaretçinin görsel davranışını etkileyen bir dizi özelliği ayarlamayı içerir.

İş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çilerde varsayılan olarak billboard yönü kullanılır. Yani işaretçiler, haritanın yüzeyine göre değil, cihazın ekranına göre çizilir. Haritayı döndürmek, yatırmak veya yakınlaştırmak sayfanın yönünü değiştirmez kullanabilirsiniz. Bir işaretçiyi, dünya üzerinde düz olacak şekilde yönlendirebilirsiniz. Düz işaretçiler, harita döndürüldüğünde döner ve harita eğildiğinde perspektifi değiştirir. İ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 değilse varsayılan konum yukarı dönüktür ve işaretçi her zaman kameraya bakacak şekilde döndürülü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ştirin

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 BitmapDescriptorFactory sınıfındaki yöntemlerden biri kullanılarak tanımlanır.

fromAsset(String assetName)
assets dizininde bir bitmap resminin adını kullanarak özel bir işaretçi oluşturur.
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şturur.

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 genellikle ekrana göre çizilir. Haritayı döndürmek, eğmek veya yakınlaştırmak, işaretçinin yönünü değiştirmez. İşaretçinin yönünü, dünya üzerinde düz olacak şekilde ayarlayabilirsiniz. İş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şaretleyicinin haritadaki diğer işaretleyicilere göre grup sırasını belirtir. Z-endeksi yüksek olan bir işaretçi, alt yönü düşük olan işaretçilerin üzerine çizilir z-indexes. Varsayılan Z-endeksi değeri 0 şeklindedir.

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.

İşaretçi etkinliklerini işleme

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 ait olduğu nesnedir. Etkinlik dinleyicinin geri çağırması, ekranın üzerinde bulunan işaretçilerle karşılık gelen Marker nesnesini ifade eder. Bu Marker nesnesini, Marker nesnesine ait kendi referansınızla karşılaştırmak için == yerine equals() kullanmanız gerekir.

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) Bir 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 (yani, 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-endeksi'nin tıklama etkinlikleri üzerindeki etkisi:

  • Kullanıcı bir işaretçi kümesini tıkladığında, en yüksek z-dizini değerine sahip işaretçi için tıklama etkinliği tetiklenir.
  • 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 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 kümeyi yeniden hesaplar ve tıklama döngüsünün durumunu baştan başlayacak şekilde sıfırlar.
  • 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 sürüklenirken onMarkerDrag(Marker) sürekli olarak çağrılır. Sürecin sonunda onMarkerDragEnd(Marker) çağrılır. İşaretçinin konumunu dilediğiniz zaman Marker.getPosition() numaralı telefonu arayabilirsiniz.