2015-03-02 57 views
-1

我正在运行显示一堆API标记的代码。与我的代码一起工作良好,但中心依赖于我的标记进行自我调整。我想预设中心和缩放系数。我知道,我必须在'function initialize()'大概就像添加一些代码:谷歌地图标记API - 初始化中心

var mapOptions = { zoom: 7, center: new google.maps.LatLng(9.22316, 52.35308) 

但是,如果我在运行代码复制在它不工作了。所以请你能帮助我,告诉我我需要修改哪部分代码?

这里是我的代码运行:

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Simple Map</title> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <style> 
     html, body, #map-canvas { 
     height: 100%; 
     margin: 0px; 
     padding: 0px 
     } 
    </style> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 
    <script> 
var map; 





var LocationData = [ xxx, yyy, zzz, 0]; 


var iconURLPrefix = 'http://maps.google.com/mapfiles/ms/icons/'; 

    var icons = [ 
     iconURLPrefix + 'red-dot.png', 
     iconURLPrefix + 'green-dot.png', 
     iconURLPrefix + 'blue-dot.png', 
     iconURLPrefix + 'orange-dot.png', 
     iconURLPrefix + 'purple-dot.png', 
     iconURLPrefix + 'pink-dot.png',  
     iconURLPrefix + 'yellow-dot.png' 
    ] 




function initialize() 
{ 
    var map = 
     new google.maps.Map(document.getElementById('map-canvas')); 
    var bounds = new google.maps.LatLngBounds(); 
    var infowindow = new google.maps.InfoWindow(); 


    for (var i in LocationData) 
    { 
     var p = LocationData[i]; 
     var latlng = new google.maps.LatLng(p[0], p[1]);  
    bounds.extend(latlng); 

     var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      icon : icons[p[3]], 
      title: p[2] 
     }); 

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

    map.fitBounds(bounds); 
} 



google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
    </head> 
    <body> 
    <div id="map-canvas"></div> 
    </body> 
</html> 

非常感谢您的帮助!

+0

我忘了说你好在开始时; ) – Chillkroete1206 2015-03-02 21:51:09

回答

1

删除呼叫:map.fitBounds(bounds);

然后,如the documentation描述,将预定义的缩放和中心:

var map; 
 

 

 
function initialize() { 
 
    var mapOptions = { 
 
    zoom: 7, 
 
    center: new google.maps.LatLng(9.22316, 52.35308) 
 
    }; 
 
    var map = 
 
    new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
 
} 
 

 
google.maps.event.addDomListener(window, 'load', initialize);
html, 
 
body, 
 
#map-canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 
 
<div id="map-canvas"></div>