{"id":16875509,"url":"https://github.com/ghybs/leaflet.markercluster.layersupport","last_synced_at":"2025-03-17T06:31:25.384Z","repository":{"id":56855885,"uuid":"45910914","full_name":"ghybs/Leaflet.MarkerCluster.LayerSupport","owner":"ghybs","description":"Sub-plugin for Leaflet.markercluster plugin; brings compatibility with Layers Control and other plugins","archived":false,"fork":false,"pushed_at":"2018-02-08T11:26:32.000Z","size":116,"stargazers_count":60,"open_issues_count":0,"forks_count":11,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-11T01:08:21.335Z","etag":null,"topics":["clustering","javascript","leaflet","leaflet-plugins","markercluster"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ghybs.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-11-10T12:37:50.000Z","updated_at":"2024-10-16T13:08:41.000Z","dependencies_parsed_at":"2022-08-29T07:20:43.108Z","dependency_job_id":null,"html_url":"https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ghybs%2FLeaflet.MarkerCluster.LayerSupport","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ghybs%2FLeaflet.MarkerCluster.LayerSupport/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ghybs%2FLeaflet.MarkerCluster.LayerSupport/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ghybs%2FLeaflet.MarkerCluster.LayerSupport/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ghybs","download_url":"https://codeload.github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243847060,"owners_count":20357317,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["clustering","javascript","leaflet","leaflet-plugins","markercluster"],"created_at":"2024-10-13T15:36:16.249Z","updated_at":"2025-03-17T06:31:24.802Z","avatar_url":"https://github.com/ghybs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003c!-- ##########################################################################\nNOTE TO CONTRIBUTOR:\nthis README is automatically generated from build/readme.template.md.\nShould you need to modify the README, please make your modifications on\nthe template file.\n########################################################################### --\u003e\n\n# Leaflet.MarkerCluster.LayerSupport\nSub-plugin for [Leaflet.markercluster](https://github.com/Leaflet/Leaflet.markercluster)\nplugin (MCG in short); brings compatibility with\n[L.Control.Layers](http://leafletjs.com/reference.html#control-layers)\nand other Leaflet [plugins](http://leafletjs.com/plugins.html).\nI.e. everything that uses direct calls to `map.addLayer` and `map.removeLayer`.\n\n[Leaflet.markercluster](https://github.com/Leaflet/Leaflet.markercluster) plugin\nprovides beautiful animated Marker Clustering functionality.\n\n[Leaflet](http://leafletjs.com/) is the leading open-source JavaScript library\nfor mobile-friendly interactive maps.\n\n[![GitHub releases](https://img.shields.io/github/release/ghybs/leaflet.markercluster.layersupport.svg?label=GitHub)](https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/releases)\n[![npm](https://img.shields.io/npm/v/leaflet.markercluster.layersupport.svg)](https://www.npmjs.com/package/leaflet.markercluster.layersupport)\n\nSize: 6 kB minified, \u003c 2 kB gzipped.\n\n\n**NOTE:** _if your usage requires only compatibility of MCG with\n[L.Control.Layers](http://leafletjs.com/reference.html#control-layers),\nyou might be interested in this more simple plugin:\n[Leaflet.FeatureGroup.SubGroup](https://github.com/ghybs/Leaflet.FeatureGroup.SubGroup)._\n\n\n## Requirements\n- Requires Leaflet 1.x.x\n- [Leaflet.markercluster](https://github.com/Leaflet/Leaflet.markercluster) plugin, version 1.0.0+\n- For Leaflet 0.7.x use the [`v0.1.0` release](https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/releases/tag/v0.1.0) or the [`leaflet-0.7` branch](https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/tree/leaflet-0.7)\n\n\n## Demos\n- [LayerSupport with standard L.Control.Layers](https://ghybs.github.io/Leaflet.MarkerCluster.LayerSupport/examples/mcgLayerSupport-controlLayers-realworld.388.html)\n- [LayerSupport with LeafletSlider plugin](https://ghybs.github.io/Leaflet.MarkerCluster.LayerSupport/examples/mcgLayerSupport-leafletslider.html)\n\n\n## Usage instructions\n\n### Quick Guide\n**HTML:**\n```html\n\u003c!-- After Leaflet and Leaflet.markercluster scripts --\u003e\n\u003cscript src=\"leaflet.markercluster.layersupport.js\"\u003e\u003c/script\u003e\n```\n\n**JavaScript:**\n```javascript\nvar map = L.map(\"map\"),\n    mcgLayerSupportGroup = L.markerClusterGroup.layerSupport(options),\n    myLayerGroup = L.layerGroup(arrayOfMarkers);\n    \nmcgLayerSupportGroup.addTo(map);\nmcgLayerSupportGroup.checkIn(myLayerGroup); // \u003c= this is where the magic happens!\n\nmyLayerGroup.addTo(map);\n```\n\nNow adding the Layer Group to the map adds clustered markers!\n\nWorks also with individual markers, so this means it should virtually be compatible\nwith any plugin that adds to / removes markers from map (e.g. [LeafletSlider](https://github.com/dwilhelm89/LeafletSlider)).\n\n\n### Installing the sub-plugin\n\n#### Local copy\n1. Download the \"\u003ca href=\"https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/releases/download/v2.0.1/leaflet.markercluster.layersupport.js\"\u003e`leaflet.markercluster.layersupport.js`\u003c/a\u003e\" file from the [`v2.0.1` release](https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/releases/tag/v2.0.1).\n2. Place the file alongside your page.\n3. Add the `script` tag (see [Quick Guide \u003e HTML](#quick-guide)) to your page after Leaflet and Leaflet.markercluster scripts.\n\n#### CDN\nYou can alternatively use the free [unpkg](https://unpkg.com) CDN service, but keep in mind that it\n\"[_is a free, best-effort service and cannot provide any uptime or support guarantees_](https://unpkg.com/#/about)\".\n\n```html\n\u003c!-- After Leaflet and Leaflet.markercluster scripts --\u003e\n\u003cscript src=\"https://unpkg.com/leaflet.markercluster.layersupport@2.0.1/dist/leaflet.markercluster.layersupport.js\"\u003e\u003c/script\u003e\n```\n\n#### npm\n1. Add this package to your project:\n    ```bash\n    $ npm install leaflet.markercluster.layersupport --save\n    ```\n\n2. If you are using a bundling tool, import in your JavaScript.\nIt only performs the side effect of attaching to the global `L` namespace,\nso you do not need to store it into a local variable or import a namespace.\n    ```javascript\n    require('leaflet.markercluster.layersupport');\n    // Or with ES6:\n    import 'leaflet.markercluster.layersupport';\n    ```\n\n\n### Creation\nSimply use the `L.markerClusterGroup.layerSupport` factory instead of your regular `L.markerClusterGroup`:\n\n```javascript\nvar mcgLayerSupportGroup = L.markerClusterGroup.layerSupport(options);\n\nmcgLayerSupportGroup.addTo(map);\n```\n\nDo not forget to add it to your map.\n\n\n### Adding and removing Markers / Layer Groups\nUse the regular MCG methods (like `addLayer`, `addLayers`, etc.) to add Markers\nand/or Layer Groups to the MCG Layer Support group and to show them on to the\nmap at the same time.\n\nLayer Support provides 2 new methods `checkIn` and `checkOut` that do the same\nbut do not show right away the passed Markers and/or Layer Groups on to the map.\nThey accept a single layer or an array of layers.\n\nAdding will automatically check in.\n\nCheck out will automatically remove from map.\n\n\n### Dynamically add to and remove from map while clustering\nOnce Markers and/or Layer Groups are added (or checked in) to the MCG Layer\nSupport group, you can then directly add and remove them from the map; all child\nMarkers will be added to or removed from the group, as if you had called\n`group.addLayer` (or `group.removeLayer`) instead.\n\n**This means that other Leaflet plugins (including standard Layers Control) that\ndynamically add to or remove markers from the map are now compatible with the\nclustering functionality!**\n\nFor example, you can now gather Markers into several Layer Groups and use them\nas Overlays in L.Control.Layers: when ticking / un-ticking the Overlay name in\nthe Control, markers will automatically cluster / be removed.\n\n\n\n## API Reference\n\n### Options\n| Option  | Type  | Default | Description |\n| :------ | :-----| :------ | :---------- |\n| **singleAddRemoveBufferDuration** | `Number` | `0` | Gathers all calls to `addLayer` and `removeLayer` single operations (on this MCG) that happen during the specified duration (in ms) for batch processing. Similar to throttling with execution on trailing edge only. Use `0` to disable throttling. Disabled by default (see [#11](https://github.com/ghybs/Leaflet.MarkerCluster.LayerSupport/issues/11)) |\n\n\n### Methods\n| Method  | Returns  | Description |\n| :------ | :------- | :---------- |\n| **checkIn**( `\u003cILayer\u003e` or `\u003cILayer[]\u003e` layers ) | `this` | Stamps the given Marker(s) or Layer Group(s) so that whenever they are added to or removed from the map later on, they are added to or removed from this group instead. If they are already on a map when `checkIn` is called, but they do not belong to this group yet, they are removed from that map. |\n| **checkOut**( `\u003cILayer\u003e` or `\u003cILayer[]\u003e` layers ) | `this` | Un-Stamps the given Marker(s) or Layer Group(s) so that they retrieve their normal behaviour. Also removes the layers from the map. |\n\nMCG Layer Support does not provide any extra event.\n\n\n### Regular MCG options, events and methods\nAll regular MCG [options](https://github.com/Leaflet/Leaflet.markercluster#all-options),\n[events](https://github.com/Leaflet/Leaflet.markercluster#events) and\n[methods](https://github.com/Leaflet/Leaflet.markercluster#methods) are\navailable within MCG Layer Support. Refer to Leaflet.markercluster documentation.\n\n| Method  | Returns  | Description |\n| :------ | :------- | :---------- |\n| addLayer and addLayers | `this` | Check in all passed layers, besides the normal behaviour. |\n| removeLayer and removeLayers | `this` | Normal behaviour only. They do not check out layers. |\n\n\n\n## Limitations\n\n### No clustering before at least one MCG Layer Support group has been added to map\nAs long as **no** MCG Layer Support group has been added to a given map, the\nlatter will not be able to redirect calls to `addLayer` to the appropriate Layer\nSupport group, even if you have properly checked in all Markers and Layer Groups.\nThey will appear on the map without clustering. Once you add an MCG Layer Support\ngroup, it will collect its layers and re-add them properly clustered.\n\nAfter that, markers already added on map will be collected by their respective\nLayer Support group once the latter are added to the map.\n\nLater additions of checked in markers to the map will not show anything as long\nas the Layer Support group they belong to is not on map. If it is on map, then\nthey show up normally (clustered).\n\n\n### Checked in Layer Group with child checked out marker\nRefrain from doing the following: check in a Layer Group into an MCG Layer\nSupport group (this checks in all child markers of that group) then check out\none or several of the child markers individually.\n\nThe result is simple: when adding the Layer Group to the map, all child markers\nbut the checked out ones will cluster. Checked out ones will be directly added\nto the map, without clustering. What did you expect? :-)\n\n## License\n[![license](https://img.shields.io/github/license/ghybs/leaflet.markercluster.layersupport.svg)](LICENSE)\n\nLeaflet.MarkerCluster.LayerSupport is distributed under the\n[MIT License](http://choosealicense.com/licenses/mit/) (Expat type), like\nLeaflet.markercluster.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fghybs%2Fleaflet.markercluster.layersupport","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fghybs%2Fleaflet.markercluster.layersupport","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fghybs%2Fleaflet.markercluster.layersupport/lists"}