@ bluehalo/ngx-leaflet-marker 分组

扩展为 Angular.io 的 @ bluehalo/ngx-leaflet 包 为Angular.io项目提供传单。 与Leaflet v1.x和传单相兼容. marker cluster v1.x

目录

• 安装
• 使用量
• API 密码
• 烹饪本
• 贡献
• 许可证

安装

通过 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 叶片插件。 。 。 .

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

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

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

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

API 密码

完整的 API 文档在 文件/API.md它涵盖:

• [leafletMarkerCluster] ——指令激活和数据输入
• [leafletMarkerClusterOptions] ——通过选项 leaflet.markercluster
• [leafletMarkerClusterGroup] ——可选预创建 MarkerClusterGroup (用子插头)
• (leafletMarkerClusterReady) - 访问该程序的产出活动 MarkerClusterGroup 实例

烹饪本

共同模式和实例 文件/教科书.md,包括:

• 使用子管道( Layer 支持, 可自由使用) - 通过一个预创的 MarkerClusterGroup 通过 [leafletMarkerClusterGroup] 以使用子插件工厂
• 缩放到 ShowLayer 调用不开火 - 使用 NgZone.runOutsideAngular() js 时间问题
• 解决问题: L.markerClusterGroup is not a function - 建造/共同JS接口问题的三个解决办法

贡献

公关接受。 请对功能分支投稿 并打开一个吸引请求反对 master。 。 。 .

许可证

见 自由主义 详细情况.

贷项

传单 是一个很棒的地图包. 小册子.标记组 此库包是基本的集群插件 .