Can I use google maps pins to populate a form on my webpage? [closed]

问题

I have a database of over 600 map markers with longitude and latitude and all the applicable information for them to be used by the clients.

I need to create something that allows me to click the pin marker within the map and then any data attached to that pin (phone number, postcode, address, etc) to be pulled from that pin in the database and be added into the form.

Can I extract data from google maps to populate a form on the webpage?

回答1:

you need to do certain steps for this.

Generate key from Google Developer :

Link = https://code.google.com/apis/console/

generated key = "GeneratedKey"

<!DOCTYPE html>
    <html>
  <head>
    <style type="text/css">
      html, body, #map-canvas { height: 100%; margin: 0; padding: 0;}
    </style>
    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=YourGenerateKeyHere">
    </script>
<script>
	
   function getLocation()
    {
	var geocoder = new google.maps.Geocoder();
	var address = document.getElementById("Location").value;
	var latitude = 0;
	var longitude = 0;
	geocoder.geocode( { 'address': address}, function(results, status) {
	if (status == google.maps.GeocoderStatus.OK) {
		latitude = results[0].geometry.location.lat();
        longitude = results[0].geometry.location.lng();
		showPosition(latitude, longitude, address);
	}
	}); 
   }
    function showPosition(latitude, longitude, address)
	{
		var mapOptions = {
          center: { lat: latitude, lng: longitude},
          zoom: 18,
		  mapTypeId: google.maps.MapTypeId.ROADMAP 
        };
        var map = new google.maps.Map(document.getElementById('map-canvas'),
            mapOptions);
		var myLatlng = new google.maps.LatLng(latitude,longitude);

		var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: address,
  });

		google.maps.event.addDomListener(window, 'load', initialize);
    }
     
</script>
<body>
	<input type="text" id="Location" placeholder="Type address here" />
    <button onclick="getLocation()">Click here to see map</button>
  
<div id="map-canvas"></div>
  
</body>
</html>
</html>

回答2:

You should be able to find something useful here:

来源：https://stackoverflow.com/questions/29676226/can-i-use-google-maps-pins-to-populate-a-form-on-my-webpage

标签

php

mysql

database

google-maps

dynamic