Управлять поведением при наложении.

Выберите платформу: Android iOS JavaScript

В этой статье рассказывается, как настроить поведение маркера при наложении. Настройки поведения при наложении определяют, как будет отображаться маркер в случаях, когда он пересекается с другим маркером.

Чтобы настроить поведение при наложении, задайте для атрибута collisionBehavior одно из следующих значений:

• REQUIRED. Маркер показывается всегда, независимо от наложения.
• REQUIRED_AND_HIDES_OPTIONAL. Маркер показывается всегда, независимо от наложения. При этом совпадающие с ним маркеры OPTIONAL_AND_HIDES_LOWER_PRIORITY и ярлыки скрываются.
• OPTIONAL_AND_HIDES_LOWER_PRIORITY. Маркер показывается только при отсутствии пересечения с другими маркерами. Если два маркера этого типа накладываются друг на друга, показывается тот, у которого выше zIndex. При одинаковом значении zIndex показывается маркер, расположенный ниже по вертикали.

В примере ниже показано, как настроить поведение маркера при наложении.

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

Как настроить поведение ярлыка при наложении

Вы можете отдельно настроить поведение при наложении для маркера и текста ярлыка. В некоторых случаях может быть полезно скрыть ярлыки, оставив маркеры видимыми на экране, чтобы сохранить контекст. Для этого добавьте элемент <gmp-label-3d> как дочерний элемент <gmp-marker-3d> и свяжите их с помощью атрибута for.

В примере кода ниже показано, как настроить поведение при наложении для ярлыка отдельно от маркера.

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);
index.js