Marker 主题
本文回答：Marker 主题总览 —— 创建 / 参数 / 内置图标 / 自定义 DOM / 锚点 / 缩放行为 / 动画 / 拖拽 / 事件 / 聚合 / 与 Popup 联动 / 性能。
Marker 是基于 DOM 的点标注，<div> 形式浮在地图之上。优点：可随意写 HTML、CSS、Vue/React 组件；缺点：数量多时性能差（>500 个就要考虑 Symbol 图层）。
子项索引
| 文件 | 主题 |
|---|---|
| create | 创建 Marker：new / setLngLat / addTo / remove |
| options | MarkerOptions 完整参数（17 个） |
| builtin-icons | 默认水滴 SVG / 修改颜色 / 批量预设 |
| custom-dom | 自定义 DOM：纯图标 / 图+文 / Vue/React 复合 |
| anchor-offset | 锚点与偏移的数学关系（缩放不飘移） |
| zoom-behavior | minZoom / maxZoom / scaleMaxZoom / removeWhenNoInMapView |
| animation | setAnimation / CSS 光圈呼吸旋转荧光 |
| drag | draggable / dragstart / drag / dragend |
| events | click / hover / autoAdd / autoRemove / contextmenu |
| cluster | Marker 聚合：noOverlap / Symbol 版 / Marker 版 |
| with-popup | setPopup / togglePopup / getPopup |
| performance-tips | 何时改用 Symbol；大数量时建议 |
最小示例
const marker = new vjmap.Marker({ color: "#f00" })
.setLngLat(map.toLngLat([725.32, 18969.19]));
marker.addTo(map); // addTo 返回 undefined，勿接链尾
marker.getElement().addEventListener("click", () => {
alert("点击了 Marker");
});
主题级 Top 3 陷阱
- 经纬度 vs CAD 坐标：
setLngLat只接受经纬度；CAD 坐标要先map.toLngLat([x, y])。 - 缩放时位置飘：自定义 DOM 时，默认
anchor: "center"会让图标中心锚在点上；底端对齐需要anchor: "bottom"或offset: [0, -h/2]（y 向下为正，负值上移）。详见 anchor-offset。 - 组件销毁时 Marker 残留：Vue/React 卸载时必须
marker.remove()，否则会在下次初始化时累积。