WildFire Tracker Map JS File

WildFireTrackerMap

const API_KEY = 'YOUR_API_KEY';

const Map = ({ eventData, center, zoom }) => {
    
    const [locationInfo, setLocationInfo] = useState(null);

    const markers = eventData.map(ev => {
        if(ev.categories[0].id === 8) {
            return <LocationMarker 
                lat={ev.geometries[0].coordinates[1]} 
                lng={ev.geometries[0].coordinates[0]} 
                onClick={() => setLocationInfo({ id: ev.id, title: ev.title })}
                />
        }   
        return null;
    });

    return (
        <div className="map">
            <GoogleMapReact
                bootstrapURLKeys={{ key: API_KEY }}
                defaultCenter={ center }
                defaultZoom={ zoom }
            >
                { markers }
            </GoogleMapReact>
            { locationInfo && <LocationInfoBox info={locationInfo} /> }
        </div>
    )
}