2017-04-26 73 views
-2

我得到的代碼,我可以把地址,而不是緯度,它顯示在地圖上,該部分工作正常,我添加第二個var地址,但這是遠我可以與我的知識編碼,請幫助谷歌地圖,Java腳本,在地圖上添加第二個地址

<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
<title>Google Maps JavaScript API v3 Example: Geocoding Simple</title> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
    var geocoder; 
    var map; 
    var address ="UNIT 1A LOWER TINAHISK SOUTH QUAY ARKLOW co.wicklow"; 
    var addresss ="UNIT 4 INDUSTRIAL ESTATE DONORE ROAD DROGHEDA CO LOUTH"; 
    function initialize() { 
    geocoder = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(-34.397, 150.644); 
    var myOptions = { 
     zoom: 9, 
     center: latlng, 
    mapTypeControl: true, 
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
    navigationControl: true, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    if (geocoder) { 
     geocoder.geocode({ 'address': address}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      if (status != google.maps.GeocoderStatus.ZERO_RESULTS) { 
      map.setCenter(results[0].geometry.location); 

      var infowindow = new google.maps.InfoWindow(
       { content: '<b>'+address+'</b>', 
       size: new google.maps.Size(150,50) 
       }); 

      var marker = new google.maps.Marker({ 
       position: results[0].geometry.location, 
       map: map, 
       title:address 
      }); 
      google.maps.event.addListener(marker, 'click', function() { 
       infowindow.open(map,marker); 
      }); 

      } else { 
      alert("No results found"); 
      } 
     } else { 
      alert("Geocode was not successful for the following reason: " + status); 
     } 
     }); 
    } 
    } 
</script> 
</head> 
<body style="margin:0px; padding:0px;" onload="initialize()"> 
<div id="map_canvas" style="width:100%; height:100%"> 
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script> 
    </body> 
</html> 
+0

這個問題無關的Java。它與Car類似於Javascript的地毯。 –

+0

@JoeC對不起,你對 –

+0

目前只是地址解析,你需要調用一個函數來對每個你想要進行地理編碼的地址進行地理編碼。 –

回答

1

把地址放入一個數組,並在每個項目上運行地理編碼。

Working example here

<script type="text/javascript"> 
var geocoder; 
    var map; 

    var addresses = [ 
    "UNIT 1A LOWER TINAHISK SOUTH QUAY ARKLOW co.wicklow", 
    "UNIT 4 INDUSTRIAL ESTATE DONORE ROAD DROGHEDA CO LOUTH" 
    ] 

function initialize() { 

geocoder = new google.maps.Geocoder(); 

var latlng = new google.maps.LatLng(-34.397, 150.644); 

var myOptions = { 
    zoom: 9, 
    center: latlng, 
    mapTypeControl: true, 
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
    navigationControl: true, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

// Geocode each address 
addresses.forEach(function(address) { 
    geocode(address) 
}); 
} 

// Function to geocode addresses 
function geocode(address) { 
if (geocoder) { 
    geocoder.geocode({ 'address': address}, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
     if (status != google.maps.GeocoderStatus.ZERO_RESULTS) { 

     map.setCenter(results[0].geometry.location); 

     var infowindow = new google.maps.InfoWindow(
      { content: '<b>'+address+'</b>', 
      size: new google.maps.Size(150,50) 
      } 
     ); 

     var marker = new google.maps.Marker({ 
      position: results[0].geometry.location, 
      map: map, 
      title:address 
     }); 

     google.maps.event.addListener(marker, 'click', function() { 
      infowindow.open(map,marker); 
     }); 

     } else { 
     alert("No results found"); 
     } 

    } else { 

     alert("Geocode was not successful for the following reason: " + status); 
    } 
    }); 
} 
} 
</script> 
<div id="map_canvas" style="width:750px; height:750px"> 
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initialize"></script> 
+0

保羅,工作很好,非常感謝你! –