Package Exports

react-leaflet-supercluster
react-leaflet-supercluster/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-leaflet-supercluster) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-leaflet-supercluster

Basic React Leaflet wrapper for the fantastic Supercluster library.

Installation

  // npm
  npm i react-leaflet-supercluster

  // yarn
  yarn add react-leaflet-supercluster

Supported Components

Usage

This package primarily exports a React component that can be used anywhere as a child of a MapContainer component. It also provides a "low level" hook that just returns a Supercluster instance. See the Example code for a more detailed usage example.

import 'react-leaflet-supercluster/src/styles.css'
import { MapContainer, Circle, CircleMarker, Marker Polygon, Polyline } from 'react-leaflet'
import { SuperClustering } from 'react-leaflet-supercluster'

export default function App() {
  return (
    <MapContainer>
      <SuperClustering>
        <Circle center={[0, 0]} />
        <Marker position={[1, 2]} />
        <CircleMarker position={[3, 4]} />
        <Polyline positions={[3, 4]} />
        <Polygon positions={[5, 6]} />
      </SuperClustering>
    </MapContainer>
  )
}

Props

Extends all original options from the Supercluster constructor.

Additional props:

Prop	Type	Default	Description
children	ReactNode		Marker, Circle, CircleMarker, Polyline, Polygon, & GeoJSON components
disableZoomEvent	boolean	false	Disable reclustering on `zoomend` event
disableMoveEvent	boolean	false	Disable reclustering on `moveend` event
pointToLayer	(feature, latlng) => Marker	See code	Function that will be used for creating cluster markers.
markerFilter	(ReactNode, number, boolean[]) => boolean	(_, index, markers) => markers[index]	Function that will be used for filtering markers that were not included in clusters.

Contributing

yarn start to start the Vite dev server with HMR enabled.
With VS Code you can open a debugger in Chrome for IDE debugging