标记

您可以使用标记来吸引用户注意地图上的某个位置。本指南演示了如何在 3D 地图中添加和自定义标记。您可以控制标记的形状、大小和颜色，以及标记显示的海拔高度。以下示例展示了一个基本标记：

Maps JavaScript 中的 3D 地图提供了两个不同的标记类，每个类都针对特定用途进行了优化。下表显示了两种可用等级之间的区别和权衡取舍：

能力	MarkerElement	Marker3DElement
自定义	高（支持自定义 HTML 元素、核心动画 API 等）	低（自定义程度较低）
性能	互动性能较低（标记数量较多时，FPS 会下降）	更高的互动性能（针对渲染大型数据集进行了优化）
建议的容量	可靠的互动性能，最多可支持约 1,000 个标记	建议用于处理 1,000 个以上的标记

自定义颜色、比例和图标图片

自定义默认标记的背景、字形、边框颜色和大小。

将默认标记图标替换为自定义 SVG 资源。

设置标记的海拔高度

您可以通过拉伸标记并设置海拔高度来设置标记的海拔高度。

让标记响应点击事件和键盘事件

通过添加 click 事件监听器，使标记响应点击和键盘事件。

const interactiveMarker = new Marker3DInteractiveElement({
    position,
    gmpPopoverTargetElement: popover,
});
index.js

设置标记冲突行为

指定某个标记与其他标记或地图标签冲突时的行为方式。

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

标记效果

自定义 HTML 标记 (MarkerElement) 的性能低于标准 3D 标记 (Marker3DElement)。对于包含 1,000 个以上标记的应用，强烈建议使用 Marker3dElement 类，以确保最佳性能。

下一步

• 添加标记