控制冲突行为

请选择平台： 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