Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

102
Visualizações
google-map-react Use super clusture

I am using use super clusture in react map (i am using package google-map-react) But my clusture function is giving undefined Below is my code

const mapRef = useRef();
  const [zoom, setZoom] = useState(10);
  const [bounds, setBounds] = useState(null);
  const [mapData, setMapData] = useState([]);

const points = pestMap.map((map) => ({
    type: "Feature",
    properties: {
      cluster: false,
      mapId: map.id,
      company_name: map.company_name,
    },
    geometry: {
      type: "Point",
      coordinates: [parseFloat(map.longitude), parseFloat(map.latitude)],
    },
  }));
  // get clustures
  const { clustures } = useSupercluster({
    points,
    bounds,
    zoom,
    options: { radius: 100 , maxZoom: 20 },
  });
  console.log(points)
  console.log(clustures)

i have consoled points and clusture both but there is data shown in points but not in clusture

below is my map component

 <GoogleMapReact
          bootstrapURLKeys={{ key: "process.env.REACT_APP_GOOGLE_KEY" }}
          defaultCenter={{ lat: 20.582146, lng: 78.970778 }}
          defaultZoom={10}
          yesIWantToUseGoogleMapApiInternals
          onGoogleApiLoaded={({ map }) => {
            mapRef.current = map;
          }}
          onChange={({zoom , bounds})=>{
            setZoom(zoom);
            setBounds([
              bounds.nw.lng,
              bounds.se.lat,
              bounds.se.lng,
              bounds.nw.lat
            ])
          }}
        >
          {pestMap.map((map) => (
            <Marker key={map.id} lat={map.latitude} lng={map.longitude}>
              <Button className="crime-marker">
                <img src={faBus.icon} />
              </Button>
            </Marker>
          ))}
        </GoogleMapReact>

can somebody help me with this

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda