Integrating Google Map Places Api in Asp.Net MVC
Google Map Places API-
Google Map places api help us to integrate a dynamic place search in any input box which searches from the places available on google map and gives exact locations. For integrating google map api in Asp.Net MVC you have to follow these steps:
Step 1-
First of all you have to create a account on google console . After creating the account on google console you have to create api key for places api. Remember, places api is paid and you have to add a billing account for making that work. Once you get api key, you have to follow further steps :-
So , you have to add a input box and then add the following script into your view.
<script src="https://maps.googleapis.com/maps/api/js?v=3.11&sensor=false&libraries=places&key=<You Key HERE>" type="text/javascript"></script>
Remember, in this script you have to place your api key in place of <Your Key Here>
After placing your api key in the script you have to add the script given into your view.
google.maps.event.addDomListener(window, 'load', function () { var places = new google.maps.places.Autocomplete(document.getElementById('PickUpLocation')); google.maps.event.addListener(places, 'place_changed', function () { var place = places.getPlace(); var address = place.formatted_address; var latitude = place.geometry.location.lat(); var longitude = place.geometry.location.lng(); }); });
So , just place this script on your view and pass the id of your input box. After that, just reload the page and your will see whenever you will type any name. It will show places related to that search. Have a look at below result.
So, this is how will see it finally and use it for places search in future. If you have any issues you can comment and ask.