Estoy tratando de usar leaflet.heat y GeoJSON en reactJS. Ya he creado una biblioteca de folletos para que funcione con ganchos de reacción, pero desafortunadamente no puedo usar leaflet.heat en react. Importo el módulo como:

 import { GeoJSON } from "react-leaflet"; import "leaflet.heat";

Cuando ejecuto la aplicación de reacción, no recibo ningún error, pero no se muestra el mapa de calor del folleto.

Aquí hay un ejemplo de mi codificación para un mapa de calor:

 setIsLoading(true); getHome(body) .then((response) => { const array = []; response.features.forEach((element) => { array.push({ type: "Feature", properties: element["attributes"], geometry: { type: "Point", coordinates: [ element["geometry"]["lat"], element["geometry"]["lng"], ], }, }); }); const FeatureCollection = { type: "FeatureCollection", features: array, }; if (geoJsonLayer.current) { geoJsonLayer.current.clearLayers().addData(FeatureCollection); } setData(FeatureCollection); }) .catch((err) => console.log(err)) .finally(() => setIsLoading(false));

y desde la sección de codificación de getHome es API de datos:

 export const getNonAPC = async (params) => { try { const body = FormDataCustom(params); const result = await instanceArcgis.post( "/rest/Home/MapServer/5/query", body, ); return await result?.data; } catch (error) { return error?.response?.data; } };