# @asymmetrik/ngx-leaflet-markercluster 中文文档

规范地址：https://npmcn.com/package/%40asymmetrik/ngx-leaflet-markercluster/

版本：18\.0\.0
npm 元数据更新时间：2026-03-13T16:28:46.007Z
中文译文更新时间：2026-11-07T01:32:55.405Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40asymmetrik/ngx-leaflet-markercluster
原文对照：https://npmcn.com/package/%40asymmetrik/ngx-leaflet-markercluster/?lang=original
项目主页：https://github.com/bluehalo/ngx-leaflet-markercluster#readme
源码仓库：https://github.com/bluehalo/ngx-leaflet-markercluster

弃用说明：Packaged moved to @bluehalo/ngx-leaflet-markercluster for all future versions, including minor and patch releases\.

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：28.2 kB，14 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：leaflet 1，@angular/core 18，@angular/common 18，@bluehalo/ngx-leaflet 18，leaflet\.markercluster 1
- 首次发布：2017-08-28T17:39:39.684Z
- 最新版本发布：2024-06-01T20:24:45.436Z
- 近 30 天下载量：14324（2026-10-07 至 2026-11-05，npm 官方下载统计）
- 已发布版本数：19（近 12 个月 0 个）

## 中文简介

Leaflet Marker 集群插件的 Angular.io 组件

## 安装

```sh
npm install @asymmetrik/ngx-leaflet-markercluster
```

也可以使用：`pnpm add @asymmetrik/ngx-leaflet-markercluster`、`yarn add @asymmetrik/ngx-leaflet-markercluster`、`bun add @asymmetrik/ngx-leaflet-markercluster`

## README

# @ bluehalo/ngx-leaflet-marker 分组

[![Build Status](https://travis-ci.org/Asymmetrik/ngx-leaflet-markercluster.svg)](https://travis-ci.org/Asymmetrik/ngx-leaflet-markercluster/)

> 扩展为 Angular.io 的 @ bluehalo/ngx-leaflet 包 为Angular.io项目提供传单。 与Leaflet v1.x和传单相兼容. marker cluster v1.x 支持Angular v17和Ivy,并在基于Angular-CLI的项目中使用

## 目录

-   [安装](https://npmcn.com/package/%40asymmetrik/ngx-leaflet-markercluster/#readme-install)
-   [使用量](https://npmcn.com/package/%40asymmetrik/ngx-leaflet-markercluster/#readme-usage)
-   [贡献](https://npmcn.com/package/%40asymmetrik/ngx-leaflet-markercluster/#readme-contribute)
-   [许可证](https://npmcn.com/package/%40asymmetrik/ngx-leaflet-markercluster/#readme-license)

## 安装

通过 npm 安装软件包及其对等依赖性 :

```
npm install leaflet @bluehalo/ngx-leaflet
npm install leaflet.markercluster @bluehalo/ngx-leaflet-markercluster
```

如果您打算在打字计划中使用此库( 使用打字), 您还需要通过 npm 安装传单打字:

```
npm install @types/leaflet @types/leaflet.markercluster
```

## 使用量

此插件用于此 [Angular.io 叶片插件](https://github.com/bluehalo/ngx-leaflet)。 。 。 .

第一步是遵循指示. 接下来,遵循类似的进程安装和配置此插件. 这些步骤一般是:

-   安装此软件包及其依赖性(见上文).
-   导入传单. marker 集群样式表(即 , `node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css` 财务报告和审定财务报表 `.../MarkerCluster.css` )).
    -   遵循与文件记录相同的程序 `@bluehalo/ngx-leaflet`。 。 。 .
-   导入 `LeafletMarkerClusterModule` 输入您的角应用模块和本地模块(如果适用).
-   创建和配置地图(见下文和/或演示文件)

要创建地图,请使用 `leaflet` 属性指令。 此指令必须先出. 您必须通过 `leafletOptions` 或通过约束 `leafletZoom`, (中文(简体) ), `leafletCenter`,以及 `leafletLayers`。 。 。 .

```html
<div style="height: 400px;"
     leaflet
     [leafletOptions]="options"
     [leafletMarkerCluster]="markerClusterData"
     [leafletMarkerClusterOptions]="markerClusterOptions">
</div>
```

最后,要初始化并配置传单标记集群插件,使用以下属性指令: 1

### 小册子《Marker分类》

此属性是启动标记集群插件并绑定标记数据的属性指令.

#### 小册子MarkerCluster 选项

对创建时直接传递到标记集群插件的选项输入绑定. 这些选项目前仅在创建时处理.

选项对象传递到传单.marker集群对象. 因此,你可以参考 [他们的文档](https://github.com/Leaflet/Leaflet.markercluster) 用于帮助配置此插件.

### 获取标记图层的引用

有一个可选的输出事件发送器将曝光名为插件使用的标记集群组 `leafletMarkerClusterReady`。 。 。 . 见以下例子:

```html
<div style="height: 400px;"
     leaflet
     [leafletOptions]="options"
     [leafletMarkerCluster]="markerClusterData"
     [leafletMarkerClusterOptions]="markerClusterOptions"
     (leafletMarkerClusterReady)="markerClusterReady($event)">
</div>
```

```js
markerClusterReady(markerCluster: L.MarkerClusterGroup) {
    // Do stuff with group
}
```

## 贡献

公关接受。 如果你是BlueHalo的一部分,请在图上贡献 `develop` 树枝。 如果你在BlueHalo外,请 叉我们的回购做贡献.

## 许可证

详情见LICENSE.

## 常见问题

### @asymmetrik/ngx-leaflet-markercluster 是什么？

Leaflet Marker 集群插件的 Angular\.io 组件注意：该包已被作者标记为弃用——Packaged moved to @bluehalo/ngx-leaflet-markercluster for all future versions, including minor and patch releases\.

### 如何安装 @asymmetrik/ngx-leaflet-markercluster？

在项目目录运行 npm install @asymmetrik/ngx-leaflet-markercluster，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：leaflet（1）、@angular/core（18）、@angular/common（18）、@bluehalo/ngx-leaflet（18）、leaflet\.markercluster（1）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @asymmetrik/ngx-leaflet-markercluster 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @asymmetrik/ngx-leaflet-markercluster 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @asymmetrik/ngx-leaflet-markercluster 可以商用吗？

@asymmetrik/ngx-leaflet-markercluster 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @asymmetrik/ngx-leaflet-markercluster 的下载量有多少？

根据 npm 官方下载统计，@asymmetrik/ngx-leaflet-markercluster 在 2026/10/07 – 2026/11/05 这 30 天内被下载 14,324 次，日均约 477 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @asymmetrik/ngx-leaflet-markercluster 还在维护吗？

最新版本 18\.0\.0 发布于 2024/06/02（2 年前）；至今共发布 19 个版本，其中过去 12 个月发布了 0 个；首次发布于 2017/08/29。作者已将其标记为弃用，新项目建议寻找替代方案。