谷歌地圖的網頁

Question

我使用下面的代碼爲我的網頁，但我想地圖顯示在this example邊框。
我怎麼弄出來的？

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
<script language="javascript" type="text/javascript"> 

var map; 
var geocoder; 
function InitializeMap() { 

    var latlng = new google.maps.LatLng(39.646859, 27.883121); 
    var myOptions = 
    { 
     zoom: 8, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     disableDefaultUI: true 
    }; 
    map = new google.maps.Map(document.getElementById("map"), myOptions); 
} 

function FindLocation(whichone) { 
    geocoder = new google.maps.Geocoder(); 
    InitializeMap(); 

    var control1 = document.getElementById('<%= DDL_Ilce.ClientID %>'); 
    var selectedvalue1 = control1.options[control1.selectedIndex].text; 
    var control2 = document.getElementById('<%= DDL_Mahalle.ClientID %>'); 
    var selectedvalue2 = control2.options[control2.selectedIndex].text; 
    if (whichone == 1) { 
     var address = " Balıkesir" ; 
    } 
    else 
    { 
     var address = selectedvalue2 + " Balıkesir" ; 
    } 
    alert(address); 
    geocoder.geocode({ 'address': address, 'region':'Turkey' }, function (results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      map.fitBounds(results[0].geometry.bounds); 
      var marker = new google.maps.Marker({ 
       map: map, 
       position: results[0].geometry.location 

      }); 
     } 
     else { 
      alert("Geocode was not successful for the following reason: " + status); 
     } 
    }); 

} 

window.onload = InitializeMap; 

</script> 

Answer 1

添加Polyline方法。作爲一個例子發生這樣的事情你InitializeMap（）函數中：

var flightPlanCoordinates = [ 
            {lat: 39.646859, lng: 27.883121}, 
            {lat: 40.646859, lng: 28.883121}, 
            {lat: 42.646859, lng: 30.883121}, 
            {lat: 43.646859, lng: 32.883121}, 
            {lat: 39.646859, lng: 27.883121} 
           ]; 
     var flightPath = new google.maps.Polyline({ 
           path: flightPlanCoordinates, 
           geodesic: true, 
           strokeColor: '#FF0000', 
           strokeOpacity: 1.0, 
           strokeWeight: 2 
         }); 

    flightPath.setMap(map); 

所以你的函數看起來像現在這樣：

function InitializeMap(){ 
     var latlng = new google.maps.LatLng(39.646859, 27.883121); 
     var myOptions = { zoom: 8, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, disableDefaultUI: true }; 
     map = new google.maps.Map(document.getElementById("map"), myOptions); 

     var flightPlanCoordinates = [ 
            {lat: 39.646859, lng: 27.883121}, 
            {lat: 40.646859, lng: 28.883121}, 
            {lat: 42.646859, lng: 30.883121}, 
            {lat: 43.646859, lng: 32.883121}, 
            {lat: 39.646859, lng: 27.883121} 
           ]; 
     var flightPath = new google.maps.Polyline({ 
           path: flightPlanCoordinates, 
           geodesic: true, 
           strokeColor: '#FF0000', 
           strokeOpacity: 1.0, 
           strokeWeight: 2 
         }); 

    flightPath.setMap(map); 
} 

你可以閱讀更多關於它在這裏： https://developers.google.com/maps/documentation/javascript/shapes