{"bugs":{"url":"https://github.com/eJuke/Leaflet.Canvas-Markers/issues"},"dist":{"shasum":"3d9289c74fd09b73a3706916aa4929fe8b0c6e30","tarball":"https://registry.npmjs.org/leaflet-canvas-marker/-/leaflet-canvas-marker-0.2.1.tgz","fileCount":10,"integrity":"sha512-+ADidiV/fis0rIzce4TDdeTQTkNDMYGi8mHVOIueIxSiHz8CaMELxrp0TfmgbzFZ5Voz4X6LveElbZdT5SSolw==","signatures":[{"sig":"MEYCIQCeY3UHV3lTTV1mc/bMtaVHd3JYFEcmdXc0y+jVssCCvwIhAOCeq5LolVGD4+oPQsiwmUhgk+OwpH1zHcr37+qyaPrn","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":38148,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJckVYuCRA9TVsSAnZWagAA/8UP/iuc7f8kj8qSf1R1loAk\n7TuzbFIQAjyPgejQz8kd3AcOnq+qUgCyjNjOjnmVhJnjD4VEp/pFQhnQ5Zkw\n45+vDXF2mStrookttF1kKO8kcTSo9/TB96h+SORpOi3gNiDLqiHxgq+Ei7HW\nq/KeNjQDP4daKd6xlx529wXlowLw3oZ0HNVF/onDUAsv0Udk8k/6bDmUa3pl\nHRgiNCbD9WDOZh0B7ftUllnX8LYooJjOD5X3veI4cQjyMDrqJAzqTQX+S7DH\nBGz2lisFVlsZPevhS+3l2HjdJ02DUipFCf3PDFEgkdq/3Mb4GNgfLTmWJtil\nzzEQZ6dA0ok3RtR81pLP1xWwV1thfWlknFweBJPWBxhBnRr4e1KpuE9UtOyE\nL3yJeIX1FDnl3KWYozNv2eYunr/+DfY7kBzwPNGBeXdochZvnYgur/xesCGB\n2tqGUaHGVKHzWpfQwYVnmVqVZszROxnwN8VDr2ZtRch+nRHE8/Qt2JeLAweE\noYG91el9oZNirersthKst5HI9az7uE8duaTYW8wuxFWoF7LWk7phKdcrXBtn\nJ+TmAeYJPJvTvLduUF/uVVYP3bE7VkjQ10OheKW1/vxH/posg1SLDaDzj7c/\nKMcWPEM8cES5h7xzK+DlW0nP55SV/gJrLIyYTtDGT3xtjknqSv5blp6YAJvT\nSyz3\r\n=DSdu\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/leaflet.canvas-markers.js","name":"leaflet-canvas-marker","author":{"url":"http://github.com/eJuke","name":"Evgeniy Voynov","email":"voynov.ev@gmail.com"},"readme":"# Leaflet.Canvas-Markers\r\nLeaflet plugin for displaying markers on canvas instead of DOM. Working with Leaflet 1.0.0 and above.\r\nFeel free to contribute\r\n\r\n## Demo\r\n\r\nThere's a [demo](http://eJuke.github.io/Leaflet.Canvas-Markers/examples/index.html) for 10000 points, running on Canvas\r\n\r\n## Installation and basic usage\r\n\r\nJust download `leaflet.canvas-markers.js` from the `dist` folder and attach it to your project.\r\n\r\n```html\r\n<script src=\"leaflet.canvas-markers.js\"></script>\r\n```\r\n\r\nNow attach layer to map and some markers.\r\n\r\n```js\r\n// Adds a layer\r\nvar ciLayer = L.canvasIconLayer({}).addTo(map);\r\n\r\n// Marker definition\r\nvar marker =  L.marker([58.5578, 29.0087], {icon: icon});\r\n\r\n// Adding marker to layer\r\nciLayer.addMarker(marker);\r\n```\r\n\r\n## Benchmark\r\n\r\nPlugin was tested in Google Chrome v66 & IE11. There is results for 100000 markers:\r\n\r\n<table>\r\n  <thead>\r\n    <tr>\r\n      <th>Parameter</th>\r\n      <th>Default Leaflet Markers</th>\r\n      <th><b>Leaflet.Canvas-Markers</b></th>\r\n    </tr>\r\n  </thead>\r\n  <tbody>\r\n    <tr>\r\n      <td>Memory used</td>\r\n      <td>up to 2.8 Gb</td>\r\n      <td><b>about 300 Mb</b></td>\r\n    </tr>\r\n    <tr>\r\n      <td>First load time</td>\r\n      <td>160-200 seconds</td>\r\n      <td><b><1 seconds</b></td>\r\n    </tr>\r\n    <tr>\r\n      <td>Zoom and move time</td>\r\n      <td>more than 3 minutes</td>\r\n      <td><b>0.5 seconds</b></td>\r\n    </tr>\r\n  </tbody>\r\n</table>\r\n\r\nAs you can see DOM operations are slow, so you should use canvas for a large number of markers.\r\n\r\nYou can also use L.circleMarker for your points with similar performance, but then you're limited to icon design.\r\n\r\n## Methods\r\n\r\n- **addMarker(marker)**: Adds a marker to the layer.\r\n- **addMarkers(markers)**: Adds a markers to the layer.\r\n- **removeMarker(marker, redraw)**: Removes a marker from the layer. Set **redraw** to `true` if you want to redraw layer after marker remove\r\n- **redraw()**: Redraws the layer\r\n- **addOnClickListener(eventHandler)**: Adds common click listener for all markers\r\n- **addOnHoverListener(eventHandler)**: Adds a hover over listener for all markers\r\n\r\nI also implemented binds for default **addLayer**, **addLayers** and **removeLayer** (equal to removeMarker(marker, _true_) methods.\r\n\r\n## Contributors\r\n\r\n[crzo](https://github.com/crzo), [Spaction](https://github.com/Spaction)\r\n","gitHead":"1cfcf17ea5d9001925c4c50b1d81dcc058593124","license":"MIT","scripts":{"build":"set NODE_ENV=prod&& webpack","watch":"set NODE_ENV=test&& webpack --watch","build:test":"set NODE_ENV=test&& webpack","prepublish":"npm run build"},"_npmUser":{"name":"ejuke","email":"voynov.ev@gmail.com"},"homepage":"https://github.com/eJuke/Leaflet.Canvas-Markers#readme","keywords":["leaflet","leaflet-plugin","marker","map"],"repository":{"url":"git+https://github.com/eJuke/Leaflet.Canvas-Markers.git","type":"git"},"_npmVersion":"6.4.1","description":"Leaflet plugin to display markers on canvas instead of DOM","directories":{"lib":"dist","example":"examples"},"maintainers":[{"name":"ejuke","email":"voynov.ev@gmail.com"}],"_nodeVersion":"8.12.0","dependencies":{"rbush":"^2.0.2"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"webpack":"^4.12.0","webpack-cli":"^3.0.3","script-loader":"^0.7.2","uglifyjs-webpack-plugin":"^1.2.5"},"peerDependencies":{"leaflet":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/leaflet-canvas-marker_0.2.1_1553028653977_0.9225274937623251","host":"s3://npm-registry-packages"},"_id":"leaflet-canvas-marker@0.2.1","version":"0.2.1"}