npm.devtool.tech
👏 You can access react-leaflet-canvas-markers package with using reactLeafletCanvasMarkers variable in browser devtools!
React wrapper of Leaflet.Canvas-Markers for react-laeflet

basic

package
Npm Version
Node Version

popularity

Star
Npm Weekly Downloads
Jsdeliver Month Downloads
Dependents Pkg
Dependents Repo

size

Code Size
Publish Size
Install Size
Minified Size
Gzip Size

quality

Open Issues
Tree Shaking Support
Type Support
Last Commit

health

Package health
Dependency Count
Outdated Dep
Vulnerablities

react-leaflet-canvas-markers

React wrapper of Leaflet.Canvas-Markers for react-leaflet

Description

Leaflet plugin for displaying markers on canvas instead of DOM. Working with react-leaflet v2.x and leaflet 1.x.

Usage

import CanvasMarkersLayer from 'react-leaflet-canvas-markers';
...
<Map center={[22.5774626732038, 114.04924392700197]} zoom={11}>
  <TileLayer
    url="http://{s}.tile.osm.org/{z}/{x}/{y}.png"
    attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
  />
  <CanvasMarkersLayer>
    <Marker position={[22.5774626732038, 114.04924392700197]} icon={defaultIcon}>
        <Popup>
          <div>hello !</div>
        </Popup>
    </Marker>
  </CanvasMarkersLayer>
</Map>

How to run demo app

1. Clone the repo:

git clone https://github.com/jbccollins/react-leaflet-canvas-markers.git

2. Install all dependencies:

yarn

3. Start the server:

yarn start

4. After starting the server, webpack should automatically open the following address:

http://localhost:3000/

License

MIT License

Explore PackageQuick Import