How to hide the list of Geofences. I am using <Geofence />
from the AmplifyGeofenceControl from "maplibre-gl-js-amplify";
Please find the source code below.
import {
Button,
CheckboxField,
Flex,
LocationSearch,
MapView,
Text,
TextField,
View,
} from "@aws-amplify/ui-react";
import "maplibre-gl/dist/maplibre-gl.css";
import "@aws-amplify/ui-react/styles.css";
import "maplibre-gl-js-amplify/dist/public/amplify-ctrl-geofence.css";
import { Geo } from "aws-amplify";
import { useEffect, useState } from "react";
import { toast } from "react-toastify";
import * as mutations from "../../graphql/mutations";
import { AmplifyGeofenceControl } from "maplibre-gl-js-amplify";
import { useControl } from "react-map-gl";
function Geofence() {
const options = {};
useControl(() => new AmplifyGeofenceControl());
return null;
}
export const CreateBikePark = ({ handleChangeIndex, setCreatedBikeParkId }) => {
const [geoProperties, setGeoProperties] = useState({});
return (
<View marginTop={"1rem"}>
<MapView
style={{ width: "100%", height: "100vh" }}
initialViewState={{
latitude: 31.5575783,
longitude: -0.7786816,
zoom: 14,
}}
>
<Geofence />
</MapView>
</View>
</View>
);
};