- Congratulations! This post is now a Staff Pick as distinguished by a badge on your profile! Thank you, keep it coming, and consider contributing your work to the The Notebook Archive! We added your image also to the top for leading above the fold graphics. You might want to consider using Permissions -> "Public" in CloudDeploy as currently the content at URL you has given at the end cannot be viewed by general public.

And here is the extension to do the same thing using OpenStreetMap and Leaflet.js:

mapControl[name_, defaultPosition_, defaultZoom_:15]:=Function[EmbeddedHTML@StringTemplate["
<input type=\"hidden\" id=\"mapField\" name=\"`Name`\">
<link
rel=\"stylesheet\"
href=\"https://unpkg.com/leaflet@1.3.4/dist/leaflet.css\"
/>

<div id=\"selectionMap\" style=\"width:400px;height:400px;\"></div>

<script
src=\"https://unpkg.com/leaflet@1.3.4/dist/leaflet.js\">
</script>

<script>
field = document.getElementById(\"mapField\")
defaultPosition = [`Latitude`,`Longitude`]
var map = L.map(\"selectionMap\").setView(defaultPosition, `DefaultZoom`);
field.value=[map.getCenter().lat,map.getCenter().lng]
mapLink ='<a href=\"https://openstreetmap.org\">OpenStreetMap</a>';
L.tileLayer(
    'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: 'Map data &copy;'  + mapLink,
    maxZoom: 18
    }).addTo(map);
var marker = L.marker(defaultPosition,
{draggable: false})
.addTo(map);

map.on('move',function(ev){
    field.value=[map.getCenter().lat,map.getCenter().lng]
    marker.setLatLng(map.getCenter())
})
if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(p){map.panTo([p.coords.latitude,p.coords.longitude])}, 
    console.log, {enableHighAccuracy: true});
}

</script>

"][<|"Name"-> name, "Latitude"->defaultPosition[[1,1]],"Longitude"->defaultPosition[[1,2]],"DefaultZoom"->defaultZoom|>]]

Deploying it:

CloudDeploy[FormFunction[{"location"-><|
    "Label"->"Drag the map so the marker points at your location",
    "Interpreter"->"StructuredGeoCoordinates",
    "Control"->mapControl["location",Entity["City",{"Champaign","Illinois","UnitedStates"}]["Position"]]|>},
    {#location,GeoGraphics[GeoMarker[#location],GeoRange->Quantity[1,"Miles"]]}&],
    "https://www.wolframcloud.com/objects/b0aa199f-a39b-446f-b19b-53ccd4a14847",Permissions->"Public"]

The new form: The new result: The link to the OSM form: https://www.wolframcloud.com/objects/b0aa199f-a39b-446f-b19b-53ccd4a14847