@amsterdam/arm-cluster v1.0.0

ARM Cluster

Part of Amsterdam React Maps library.

This is the link to the story book demo site with examples

Installation

Add this package to your project by running:

npm install --save @amsterdam/arm-cluster

Usage

import 'leaflet/dist/leaflet.css' // make sure this is always included!
import { Map, BaseLayer, ViewerContainer, Zoom } from '@amsterdam/arm-core'
import { MarkerClusterGroup, createClusterMarkers } from '@amsterdam/arm-cluster'

const markers = []

const MyComponent = () => (
  <Map fullScreen>
    <MarkerClusterGroup markers={createClusterMarkers({
          markers,
          events: {
            click: (e) => {
              window.alert(
                `Marker clicked!, Lat: ${e.latlng.lat}, Lng: ${e.latlng.lng}`,
              )
            },
          },
        })}  
      />
    <ViewerContainer bottomRight={<Zoom />} />
    <BaseLayer />
  </Map>
)

export default MyComponent

Exports component

• MarkerClusterGroup: props
  • markers
  • optionsOverrides?
  • events?
  • setInstance?

Exports service

• createClusterMarkers(markers, events)