Embeding Google Maps

Question

any one tell me that can i embed a complete google map on my website. and how?

Vinay Singh · Answer

Yes you can use complete google map in your website. have a look of the link http://www.aspsnippets.com/Articles/How-to-add-Google-map-in-ASPNet-website.aspx http://aspmvcsnippets.com/Article/Embed-Google-search-API-in-Asp.net-MVC.aspx?AspxAutoDetectCookieSupport=1

Vasanth Natarajan · Answer

ya that one is key problem. if your Google API request more then the limit if you facing the problem i also facing the same but i fixed my error to avoid the request more than limit

Bilawal Niaz · Answer

I try it whe i run the code page will show google map on browser for 3 sec and than show error.

Vasanth Natarajan · Answer

try this... If you going to search on the google map Definitely you want to the Google ApI Key . You may have the key pls try this it will help you... Places Searchbox html body { height: 100%; margin: 0; padding: 0; } #map { height: 100%; } .controls { margin-top: 10px; border: 1px solid transparent; border-radius: 2px 0 0 2px; box-sizing: border-box; -moz-box-sizing: border-box; height: 32px; outline: none; box-shadow: 0 2px 6px rgba(0 0 0 0.3); } #pac-input { background-color: #fff; font-family: Roboto; font-size: 15px; font-weight: 300; margin-left: 12px; padding: 0 11px 0 13px; text-overflow: ellipsis; width: 300px; } #pac-input:focus { border-color: #4d90fe; } .pac-container { font-family: Roboto; } #type-selector { color: #fff; background-color: #4d90fe; padding: 5px 11px 0px 11px; } #type-selector label { font-family: Roboto; font-size: 13px; font-weight: 300; } #target { width: 345px; } function initAutocomplete() { var map = new google.maps.Map(document.getElementById('map') { center: {lat: -33.8688 lng: 151.2195} zoom: 13 mapTypeId: google.maps.MapTypeId.ROADMAP }); // Create the search box and link it to the UI element. var input = document.getElementById('pac-input'); var searchBox = new google.maps.places.SearchBox(input); map.controls[google.maps.ControlPosition.TOP_LEFT].push(input); // Bias the SearchBox results towards current map's viewport. map.addListener('bounds_changed' function() { searchBox.setBounds(map.getBounds()); }); var markers = []; // Listen for the event fired when the user selects a prediction and retrieve // more details for that place. searchBox.addListener('places_changed' function() { var places = searchBox.getPlaces(); if (places.length == 0) { return; } // Clear out the old markers. markers.forEach(function(marker) { marker.setMap(null); }); markers = []; // For each place get the icon name and location. var bounds = new google.maps.LatLngBounds(); places.forEach(function(place) { var icon = { url: place.icon size: new google.maps.Size(71 71) origin: new google.maps.Point(0 0) anchor: new google.maps.Point(17 34) scaledSize: new google.maps.Size(25 25) }; // Create a marker for each place. markers.push(new google.maps.Marker({ map: map icon: icon title: place.name position: place.geometry.location })); if (place.geometry.viewport) { // Only geocodes have viewport. bounds.union(place.geometry.viewport); } else { bounds.extend(place.geometry.location); } }); map.fitBounds(bounds); }); } YOUR_API_KEY &libraries=places&callback=initAutocomplete async defer>

Bilawal Niaz · Answer

ok but they cannot giving me a search box to find any location like google map; i want that i typed something and they give me result. Give Me Answer : Lalit Raghav

Lalit Raghav · Answer

Hi Bilawal Niaz Please check this link and if and problem then tell me. i will try to solve your problem. http://www.c-sharpcorner.com/UploadFile/0c1bb2/integrating-google-map-in-Asp-Net-application/