NathanAP / vue-google-maps-community-fork

The community fork for Vue Google Maps library
https://vue-google-maps-community-fork.netlify.app
MIT License
108 stars 33 forks source link

Cluster minimumClusterSize property not working #47

Open RensBoeser opened 1 year ago

RensBoeser commented 1 year ago

Just switched from the original vue google maps library and I noticed my clusters were different. This is because both styles and miunimum-cluster-size properties were not working. I fixed the styles by writing my own render function, but how do I fix my minimum-cluster-size?

My code:

<template>
  <g-map-cluster
    :renderer="{ render }"
    :zoom-on-click="true"
    :minimum-cluster-size="6"
  >
    <slot />
  </g-map-cluster>
</template>

<script setup lang="ts">
const render = ({ count, position }: any) => {
  return new google.maps.Marker({
    icon: { url: '/clusters/m1.png', scaledSize: new google.maps.Size(48, 48) },
    label: { text: String(count), color: 'white' },
    position,
    zIndex: Number(google.maps.Marker.MAX_ZINDEX) + count,
  })
}
</script>

What were your expecting to happen? minimum cluster size set to 6

What happened? minimum cluster size set to 2 (default)

NathanAP commented 1 year ago

Hello! Sorry for the delay on answering you.

Our cluster was changed by some PRs if you compare to the original one, thats the probably reason to be different. We could test adding minimumClusterSize to its props to see if it would work for you.

rabume commented 1 year ago

This is how you can archive it now:

<GMapCluster :algorithm="algorithm">
</GMapCluster>

<script setup lang="ts">
const algorithm = new SuperClusterAlgorithm({
    minPoints: 6,
    minZoom: 5,
    radius: 400
})
</script>