Tips and Tricks in a world of Mix

Posts tagged ‘Maps’

Google maps location , longitude , longitude in MVC without Map display

I have a nested object of address inside presented model of the view
At the View page I add the js functionality of google maps services

http://maps.googleapis.com/maps/api/js?key=GET_YOUR_KEY&sensor=false&libraries=places

function initialize() {
var input = document.getElementById(‘Address_Name’);
var options = {
componentRestrictions: { country: “il” }
};
var autocomplete = new google.maps.places.Autocomplete(input, options);
google.maps.event.addListener(autocomplete, ‘place_changed’, function () {
var place = autocomplete.getPlace();
console.log(JSON.stringify(place));
document.getElementById(‘Address_Name’).value = place.formatted_address;
document.getElementById(‘Address_Latitude’).value = place.geometry.location.lat();
document.getElementById(‘Address_Longitude’).value = place.geometry.location.lng();

});
}
google.maps.event.addDomListener(window, ‘load’, initialize);

 

@Html.LabelFor(model => model.Address.Name, htmlAttributes: new { @class = “control-label col-md-2” })

@Html.EditorFor(model => model.Address.Name, new { htmlAttributes = new { @class = “form-control” } })
@Html.ValidationMessageFor(model => model.Address.Name, “”, new { @class = “text-danger” })

@Html.LabelFor(model => model.Address.Latitude, htmlAttributes: new { @class = “control-label col-md-2” })

@Html.EditorFor(model => model.Address.Latitude, new { htmlAttributes = new { @class = “form-control” } })
@Html.ValidationMessageFor(model => model.Address.Latitude, “”, new { @class = “text-danger” })

@Html.LabelFor(model => model.Address.Longitude, htmlAttributes: new { @class = “control-label col-md-2” })

@Html.EditorFor(model => model.Address.Longitude, new { htmlAttributes = new { @class = “form-control” } })
@Html.ValidationMessageFor(model => model.Address.Longitude, “”, new { @class = “text-danger” })

 

And that’s what you get

 

The json of the response is very rich

 

 

Enjoy

 

 

 

Advertisements

Google maps april’s fool pranks 2017

  1. As always for 1 of April Google geeks are comping up with different guffy stuff to make us smile.

 

Today, as you go out to get some Friday beer, navigate through Google Maps.

 

You can see the Pacman button near drive to button.

 

Randomly, Google maps will choose some area on the global map and change the map to Pacman game.

 

Try It!

If you did, please, like this post.

 

Screenshot_2017-03-31-20-57-52Screenshot_2017-03-31-22-05-45

 

 

Tag Cloud

%d bloggers like this: