Çakışma davranışını kontrol etme

Platform seçin: Android iOS JavaScript

Bu sayfada, bir işaretçinin çakışma davranışının nasıl ayarlanacağı gösterilmektedir. Çakışma davranışı, bir işaretçinin başka bir işaretçiyle çakışması (üst üste binmesi) durumunda nasıl görüntüleneceğini kontrol eder.

Çakışma davranışını ayarlamak için collisionBehavior değerini aşağıdakilerden birine ayarlayın:

  • REQUIRED: Çakışmadan bağımsız olarak işaretçiyi her zaman göster
  • REQUIRED_AND_HIDES_OPTIONAL: Çakışma olup olmadığına bakılmaksızın işaretçiyi her zaman gösterir ve işaretçiyle çakışacak OPTIONAL_AND_HIDES_LOWER_PRIORITY işaretçileri veya etiketleri gizler.
  • OPTIONAL_AND_HIDES_LOWER_PRIORITY: İşaretçiyi yalnızca diğer işaretçilerle çakışmıyorsa gösterir. Bu türden iki işaretçi çakışırsa zIndex değeri daha yüksek olan gösterilir. Aynı zIndex değerine sahiplerse dikey ekran konumu daha düşük olan gösterilir.

Aşağıdaki örnekte, bir işaretçi için çakışma davranışının nasıl ayarlanacağı gösterilmektedir:

const marker = new Marker3DElement({
    position: { lat, lng },
    // Try setting a different collision behavior here.
    collisionBehavior: 'REQUIRED',
});

Etiketin çakışma davranışını kontrol etme

Bir işaretçinin raptiye ve etiket metninin çakışma davranışını ayrı ayrı kontrol edebilirsiniz. Bazı durumlarda, bağlamı korumak için işaretçi raptiyelerini ekranda görünür bırakırken etiketleri gizlemek faydalı olabilir. Bunu yapmak için <gmp-marker-3d> öğesinin kardeşi olarak bir <gmp-label-3d> öğesi ekleyin ve bunları for özelliğini kullanarak bağlayın.

Aşağıdaki kod örneğinde, bir etiketin çakışma davranışının işaretçiden ayrı olarak nasıl ayarlanacağı gösterilmektedir:

const markerWithIndependentLabel = new Marker3DElement({
    position: { lat: 37.423, lng: -122.015 },
});
markerWithIndependentLabel.id = 'marker-1';
const label = new Label3DElement({
    collisionBehavior: CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY,
    for: 'marker-1',
});
label.append('Independent label example');
map.append(markerWithIndependentLabel);
map.append(label);