[JavaScript] Googlemaps API 3

master2005 · 4. März 2013

Googlemaps API 3

Hallo wir kann ich direkt <input id="address" type="textbox" value="Sydney, NSW"> ersetzen im Script mit der Adresse ?

Code:

<!DOCTYPE html>
<html>
 <head>
 <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
 <meta charset="utf-8">
 <title>Google Maps JavaScript API v3 Example: Geocoding Simple</title>
 <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
 <script>
 var geocoder;
 var map;
 function initialize() {
 geocoder = new google.maps.Geocoder();
 var latlng = new google.maps.LatLng(-34.397, 150.644);
 var mapOptions = {
 zoom: 8,
 center: latlng,
 mapTypeId: google.maps.MapTypeId.ROADMAP
 }
 map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
 }

 function codeAddress() {
 var address = document.getElementById('address').value;
 geocoder.geocode( { 'address': address}, function(results, status) {
 if (status == google.maps.GeocoderStatus.OK) {
 map.setCenter(results[0].geometry.location);
 var marker = new google.maps.Marker({
 map: map,
 position: results[0].geometry.location
 });
 } else {
 alert('Geocode was not successful for the following reason: ' + status);
 }
 });
 }
 </script>
 </head>
 <body onload="initialize()">
 <div>
 <input id="address" type="textbox" value="Sydney, NSW">
 <input type="button" value="Geocode" onclick="codeAddress()">
 </div>
 <div id="map_canvas" style="height:90%;top:30px"></div>
 </body>
</html>

Anzeige

bratz · 4. März 2013

AW: Googlemaps API 3

Hey,

var address = document.getElementById('address').value;

ersetzen durch

var address = "Sydney, NSW";

greetz

master2005 · 4. März 2013

AW: Googlemaps API 3

Das klappt ja leider nicht:

Code:


<!DOCTYPE html>
<html>
 <head>
 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 <style type="text/css">
 html { height: 100% }
 body { height: 100%; margin: 0; padding: 0 }
 #map_canvas { height: 100% }
 </style>
 <script type="text/javascript"
 src="http://maps.googleapis.com/maps/api/js?key=XXX&sensor=true">
 </script>
 <script type="text/javascript">
 function initialize() {
 var mapOptions = {
 center: new google.maps.LatLng(-34.397, 150.644),
 zoom: 8,
 mapTypeId: google.maps.MapTypeId.ROADMAP
 };
 var map = new google.maps.Map(document.getElementById("map_canvas"),
 mapOptions);
 }











 function codeAddress() {
 var address = "Deutschland";
 geocoder.geocode( { 'address': address}, function(results, status) {
 if (status == google.maps.GeocoderStatus.OK) {
 map.setCenter(results[0].geometry.location);
 var marker = new google.maps.Marker({
 map: map,
 position: results[0].geometry.location
 });
 } else {
 alert('Geocode was not successful for the following reason: ' + status);
 }
 });
 }
 </script>
 </head>
 <body onload="initialize()">
 <div id="map_canvas" style="width:760px; height:350px"></div>
 </body>
</html>

Nützliche Suchen

[JavaScript] Googlemaps API 3

Videos zum Themenbereich