The webpage has gone over the requests limit in too short a period of time. Google Map

Hello Friends. I want to ask error: Geocoder failed due to MapsRequestError: GEOCODER_GEOCODE: OVER_QUERY_LIMIT: The webpage has gone over the requests limit in too short a period of time. in Google Map.

Following is my code:

HTML

  <div class="form-group col-12 delivery_address">
      <label for="searchInput" class="text-dark">Type Location</label>
      <input id="searchInput" name="address" class="form-control" value="{{ old('address', isset($data)?$data->area_location:'') }}" type="text" placeholder="Enter a location" required>

      <button class="btn icon right-icon-btn locate-me" style="top: 31px;">
         <span role="presentation" class="map-closed h6 mr-2 mb-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="ic-locate-me-round" width="24" height="24">
             <defs>
                   <path id="a" d="M11.5 18a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM12 4v2.019A6.501 6.501 0 0 1 17.981 12H20v1h-2.019a6.501 6.501 0 0 1-5.98 5.981L12 21h-1v-2.019a6.501 6.501 0 0 1-5.981-5.98L3 13v-1h2.019A6.501 6.501 0 0 1 11 6.02V4h1zm-.5 11a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5zm0 1a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7zm0-2.5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path>
             </defs>
             <use fill="#858585" xlink:href="#a"></use>
         </svg></span>
      </button>
                                       
      <input id="area_lat" name="area_lat" type="hidden">
      <input id="area_lng" name="area_lng" type="hidden">
      <div id="map_canvas" style="height: 250px;" class="mt-2"></div>
 </div>

JAVASCRIPT CODE:

To Load Map AND Autocomplete Address Search Box

        google.maps.event.addDomListener(window, 'load', function() {

            var map = new google.maps.Map(document.getElementById("map_canvas"), {
                center: {
                    lat: -18.1259833,
                    lng: 178.4460672
                },
                zoom: 19,
            });

            var geocoder = new google.maps.Geocoder();
            var myLatlng = new google.maps.LatLng(-18.1259833, 178.4460672);

            var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
            });

            OnclickLocation(geocoder, map);

            var places = new google.maps.places.Autocomplete(document.getElementById('searchInput'));
            google.maps.event.addListener(places, 'place_changed', function() {
                var place = places.getPlace();
                var address = place.formatted_address;
                var latitude = place.geometry.viewport.tc.g;
                var longitude = place.geometry.viewport.Hb.g;

                document.getElementById('area_lat').value = place.geometry.viewport.tc.g;
                document.getElementById('area_lng').value = place.geometry.viewport.Hb.g;

                var myLatlng = new google.maps.LatLng(latitude, longitude);
                var myOptions = {
                    zoom: 15,
                    center: myLatlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                }
                var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                });

                var map_canvas = document.getElementById("map_canvas");
                map_canvas.style.display = "block";

                var geocoder = new google.maps.Geocoder();

                OnclickLocation(geocoder, map);
            });
        });

On CLick Get Location Function

      function OnclickLocation(geocoder, map) {
            var myLatlng = new google.maps.LatLng(-18.1259833, 178.4460672);
            var myOptions = {
                zoom: 15,
                center: myLatlng
            }
            google.maps.event.addListener(map, 'click', function(event) {
                geocoder.geocode({
                    'latLng': event.latLng
                }, function(results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                        if (results[0]) {
                            document.getElementById("searchInput").value = results[0].formatted_address;

                            document.getElementById('area_lat').value = results[0].geometry.viewport.tc.g;
                            document.getElementById('area_lng').value = results[0].geometry.viewport.Hb.g;

                            geocodeLatLng(geocoder, map);
                        }
                    }
                });
            });
        }

Geocode Latitude AND Longitude on map

   function geocodeLatLng(geocoder, map) {
            var lat = document.getElementById("area_lat").value;
            var lng = document.getElementById("area_lng").value;

            var latlng = {
                lat: parseFloat(lat),
                lng: parseFloat(lng),
            };
            geocoder
                .geocode({
                    location: latlng
                })
                .then((response) => {
                    if (response.results[0]) {
                        map.setZoom(15);

                        if (marker && marker.setMap) {
                            marker.setMap(null);
                        }

                        var marker = new google.maps.Marker({
                            position: latlng,
                            map: map,
                        });
                    } else {
                        window.alert("No results found");
                    }
                })
                .catch((e) => window.alert("Geocoder failed due to: " + e));
        }

For Current Location

  $('.locate-me').on('click', function() {
            if ("geolocation" in navigator) {
                navigator.geolocation.getCurrentPosition(function(position) {
                    var currentLatitude = position.coords.latitude;
                    var currentLongitude = position.coords.longitude;

                    document.getElementById('area_lat').value = currentLatitude;
                    document.getElementById('area_lng').value = currentLongitude;

                    var myLatlng = new google.maps.LatLng(currentLatitude, currentLongitude);
                    var myOptions = {
                        zoom: 15,
                        center: myLatlng,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                    }

                    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                    var geocoder = new google.maps.Geocoder();

                    var marker = new google.maps.Marker({
                        position: myLatlng,
                        map: map,
                    });

                    if (geocoder) {
                        geocoder.geocode({
                            'latLng': myLatlng
                        }, function(results, status) {
                            if (status == google.maps.GeocoderStatus.OK) {
                                console.log(results[0].formatted_address);
                                document.getElementById("searchInput").value = results[0].formatted_address;
                            } else {
                                alert('Geocoding failed: ' + status);
                                console.log("Geocoding failed: " + status);
                            }
                        });
                    }

                    OnclickLocation(geocoder, map);
                });
            }
        })

This is my all code:

I am getting:

1. User Current Location
2. AutoComplete Location(Google)
3. Click on the map to get the location of that point.

There are Two Problems:

1. When the user clicks almost at 4 to 5 times on google map it returns alert Geocoder failed due to MapsRequestError: GEOCODER_GEOCODE: OVER_QUERY_LIMIT: The webpage has gone over the requests limit in too short a period of time.

2. The old markers remain there when the user clicks on the new location.

I google my issues but do not get the solutions. So Plz Help me to solve the above bug.