All geek questions in one place

How to integrate Google Maps in a web application?

I have a web application. I want to integrate Google Maps to display a location map where a user enters data into a search location. Any help?

+4
source share
3 answers

If I understand your question correctly, you want your users to search for a location and then display it on a map. If so, this can be done very easily using the Geocoding Services provided by the Google Maps JavaScript API . Consider the following example:

<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Google Maps Geocoding Demo</title> <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> </head> <body> <div id="map" style="width: 400px; height: 300px;"></div> <script type="text/javascript"> var address = 'London, UK'; var map = new google.maps.Map(document.getElementById('map'), { mapTypeId: google.maps.MapTypeId.TERRAIN, zoom: 6 }); var geocoder = new google.maps.Geocoder(); geocoder.geocode({ 'address': address }, function(results, status) { if(status == google.maps.GeocoderStatus.OK) { new google.maps.Marker({ position: results[0].geometry.location, map: map }); map.setCenter(results[0].geometry.location); } else { // Google couldn't geocode this request. Handle appropriately. } }); </script> </body> </html>

Screenshot:

Google Maps v3 Geocoding Demo

You can simply replace the value of the address variable, which in this example is set to 'London, UK' , with the location that your users found.

+3
source

STEP 1: open the card you want to insert. This can be a map that you created on the My Maps tab, or a search for an address, local business, or driving directions.

STEP 2: Copy the HTML code from the text box after clicking "Link to this page." You can also adjust the size of the map and view it before embedding.

STEP 3: Paste the HTML into your website or blog editor.

or more See this site http://www.higheredblogcon.com/library/deweese/presentation.html

0
source

you need

geocoding (a way to turn the address into a long one, lat) http://code.google.com/apis/ajax/playground/#geocoding_simple

and a simple map http://code.google.com/apis/ajax/playground/#map_simple

0
source

Source: https://habr.com/ru/post/1316011/

More articles:


All Articles