Reverse Geocode Example
This sample shows to use geocoding service API to find the address of a location on the map.
Code review
<script>
var gssMap, accessToken = '7fNWCXhqQ_OSyB4fd8C6539PYQ1G8YjdsOCoTtio';
var markers = new Map();
$(function(){
var defaults = {
zoomControl: true,
zoom: 16
};
gssMap = new gssmaps.GSSMap(accessToken, 'map', defaults);
var latLng = new gssmaps.GSSLatLng(33.666372,-117.685852);
gssMap.setView(latLng);
gssMap.on('contextmenu', function(e){
var lat = e.latlng.lat;
var lng = e.latlng.lng;
var marker = addMarker(lat, lng);
markers.set(marker.getMarkerId(), marker);
getReverseGeocode(lat, lng, marker);
});
function getReverseGeocode(lat, lng, marker){
var requestUrl = "https://apis.location.studio/geo/v2/reversegeocode/json?coordinate={lat},{lng}&api_key={access_token}";
requestUrl = requestUrl.replace('{access_token}', accessToken).replace('{lat}', lat).replace('{lng}', lng);
$.ajax({
url: requestUrl,
crossDomain: true,
contentType: 'application/json',
processData: false,
success: function( data, textStatus, jQxhr ){
if(data && data.locations){
var locations = data.locations;
var str = JSON.stringify(data.locations, undefined, 4);
// console.log('Response: ' + str);
if(locations && locations.length > 0){
marker.bindPopupContent(prepareFormattedAddress(locations[0]));
marker.openPopup();
}
}
},
error: function( jqXhr, textStatus, errorThrown ){
console.log( errorThrown );
}
});
}
function prepareFormattedAddress(address){
return address.formatted_address;
}
function addMarker(lat, lng, popupContent){
var gssLatLng = new gssmaps.GSSLatLng(lat, lng);
var gssMarker = new gssmaps.GSSMarker(gssLatLng);
return gssMap.addMarker(gssMarker, popupContent);
}
function removeMarker(gssMarker){
gssMap.removeMarker(gssMarker);
}
})
function deleteMarker(markerId){
marker = markers.get(markerId);
markers.delete(markerId);
gssMap.removeMarker(marker);
}
</script>