If you occasionally receive requests from business/property owners asking that their location be removed from your game, then you might consider implementing a request form for this on your website.
Sample form
The following image provides an example of what a location removal request form might look like.
Sample HTML code
The following sample HTML code renders the request form's user interface.
<header>Report or Remove a Location from the Game</header> <div id="form" class="form"> <form action="submit.html" method="post"> <label for="email">Tell us your email address so we can contact you if necessary.</label> <br/> <br/> <input type="text" id="email" class="input_email"/> <br/> <br/> <label for="issue">Select the issue you want to report.</label> <br/> <br/> <select id="issue" class="input_issue"> <option id="remove_location" value="remove_location">Remove a location from the game</option> <option id="unsafe_location" value="unsafe_location">Report an unsafe location</option> <option id="other" value="other">A different issue</option> </select> <br/> <br/> <label for="description">Describe the issue in as much detail as possible.</label> <br/> <br/> <textarea id="description" rows="10" cols="20"></textarea> <br/> <br/> <label for="place_name">What is the place called?</label> <br/> <br/> <input type="text" id="place_name"/> <br/> <br/> <label for="location_map">If you have the Google Maps link, please paste it here</label> <br/> <br/> <input type="text" id="google_maps_url"/> <br/> <br/> <label for="latitude_longitude">If you know the coordinates (latitude and longitude) of the location, paste them here, separated by a comma. E.g., 51.456789, -0.123456</label> <br/> <br/> <input type="text" id="latitude_longitude"/> <br/> <br/> <label for="place_id">Google Place ID</label><br><br/><span>Leave blank. If you use the map to select a place, its ID will appear here.</span> <br/> <br/> <input type="text" id="place_id"></input> <br/> <br/> <div id=place_id_picker> <div id="autocomplete_container"> <label for="pac-input">Start typing the name or address of the place, and we'll show you a list of suggestions.</label> <br/> <br/> <input id="pac-input" class="controls" type="text" placeholder="Enter a location"> </div> <br/> <div id="map_canvas"></div> </div> <br/> <br/> <input type="submit"/> </form> </div>
Sample JavaScript code
The following sample JavaScript code uses the Places Autocomplete widget to allow the user to search for and select a place. The code then displays an info window that contains the place ID and other information about the place that the user selected.
<script> function initMap() { // This creates a map in the <div> with the id "map_canvas". var map = new google.maps.Map(document.getElementById('map_canvas'), { center: {lat: -33.8688, lng: 151.2195}, zoom: 13 }); var input = document.getElementById('pac-input'); var autocomplete = new google.maps.places.Autocomplete(input); autocomplete.bindTo('bounds', map); var marker = new google.maps.Marker({ map: map }); autocomplete.addListener('place_changed', function() { var place = autocomplete.getPlace(); if (!place.geometry) { return; } if (place.geometry.viewport) { map.fitBounds(place.geometry.viewport); } else { map.setCenter(place.geometry.location); map.setZoom(17); } // Set the position of the marker using the place ID and location. marker.setPlace({ placeId: place.place_id, location: place.geometry.location }); marker.setVisible(true); var formInput = document.getElementById('place_id'); formInput.value = place.place_id; var formLatLng = document.getElementById('latitude_longitude'); formLatLng.value = place.geometry.location; var formName = document.getElementById('place_name'); formName.value = place.name; }); } </script>
The following JavaScript code calls the Maps JavaScript API, passes it your API
key, specifies a dependency on the Places library, and then specifies the
initMap()
function (above) as the callback.
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initMap" async defer></script>