antv-l7/docs/api/component/markerLayer.zh.md

1.6 KiB

title order
Marker 图层 3

MarkerLayer 不同于 PointLayer 图层

技术差异

  • MarkerLayer 地图元素采用 Dom 元素绘制
  • PointLayer 通过 WebGL 绘制元素。

功能差异

  • MarkerLayer 元素的自定义性比较强,任何 HTML+ CSS 的组合都可可以绘制在地图上。
  • PointLayer 自定义性比较弱,实现成本比较高,优势可以绘制大量的数据,性能比交互。

使用

import { Marker, MarkerLayer } from '@antv/l7';

构造函数

const markerLayer = new MarkerLayer(option);

// 调用 addMarker方法 将多个Marker添加到Layer

scene.addMarkerLayer(markerLayer);

option

  • cluster 是部分聚合 boolean 默认 false

  • clusterOption 聚合配置

  • cluster 是部分聚合

    • element function

后续会增加更多配置项目

方法

addMarker

参数

  • marker Marker 需要添加的 Marker

添加 Marker

通过 Marker 对象实例化一个 Marker

const marker = new Marker().setLnglat(); // 添加进Marker必须设置经纬度才能添加
markerLayer.addMarker(marker);

removeMarker

从 MarkerLayer 移除 Marker

getMarkers

获取 MarkerLayer 中的所有 Marker

clear

清除掉所有的 Marker

Scene

addMarkerLayer

添加 MarkerLayer

scene.addMarkerLayer(layer);

removeMarkerLayer

移除 MarkerLayer

scene.removeMarkerLayer(layer);

demo 地址

markerLayer

markerLayer 聚合