vue2-leaflet-prunecluster

vue2-leaflet-prunecluster

This is a prunecluster plugin extension for vue2-leaflet package

Install

npm install --save vue2-leaflet-prunecluster

Usage

<template>
    <v-map ref="map">

      <v-prune-cluster
      :items="items"
      :mapRef="this.$refs"
      @clickOnItem="doWhateverYouWant"
       />

    </v-map>
</template>

<script>
import PruneCluster from 'vue2-leaflet-prunecluster'

export default {
  components: {
    'v-prune-cluster': PruneCluster
  }
}
</script>

Explanations & options

• You need a leaflet map around your vue2-leaflet-prunecluster component with a ref="map"

• items must be an array like this:

[
 { lng: -1.219482, lat: 47.413220, id: '65y' },
 { lng: -1.219482, lat: 47.413220, id: '65y' }
] ```

* The function _doWhateverYouWant_ can simply be
``` javascript
() => console.log('i just clicked');

But doWhateverYouWant can be much more advanced in case you want to use full arguments inherited from pruneCluster:

(item,leafletMarker,pruneCluster) => console.log('i just clicked on this item',item);

• In case you want to customize your icon, you can also pass the option :setIcon=setIcon with setIcon beging a Leaflet Icon like:

setIcon(){
    return L.icon({
    iconUrl: '../../static/icons/icon_search_violet.svg',
    iconSize: [29, 29],
  })
} ```


## Develop

### See an example (with hot-reloads)
``` bash
git clone https://github.com/guillim/vue2-leaflet-prunecluster.git vue2prune && cd vue2prune && npm install && npm run example

and go to localhost:8080

Compiles + minifies for production

npm run build

Lints and fixes files

npm run lint

Author

Guillim

Contributors

• Guillim

License

MIT

Made with Vue cli with ❤️
Thanks to SINTEF for the awsome prune package