0

How to hide the list of Geofences. I am using <Geofence /> from the AmplifyGeofenceControl from "maplibre-gl-js-amplify";

enter image description here

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>
    );
};

Dhanuka Perera
  • 1,395
  • 3
  • 19
  • 29

0 Answers0