Question

我初始化API的代码如下：

jQuery(function($) {
// Asynchronously Load the map API 
var script = document.createElement('script');
script.src = "http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize";
document.body.appendChild(script);
});

function initialize() {

    var bounds = new google.maps.LatLngBounds();
    var mapOptions = {
        mapTypeId: 'roadmap'
    };

    // Display a map on the page
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
    map.setTilt(45);

    // Multiple Markers
    var markers = [
        //php code to get markers from DB
    ];

    // Info Window Content
    var infoWindowContent = ['some text here'];

    // Display multiple markers on a map
    var infoWindow = new google.maps.InfoWindow(), marker, i;

    // Loop through our array of markers & place each one on the map  
    for( i = 0; i < markers.length; i++ ) {
        var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
        bounds.extend(position);
        marker = new google.maps.Marker({
            position: position,
            map: map,
            title: markers[i][0]
        });

        //push markers to mapMarkers array.
        mapMarkers.push(marker);

        // Allow each marker to have an info window    
        google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infoWindow.setContent(infoWindowContent[i][0]);
                infoWindow.open(map, marker);
            }
        })(marker, i));

        // Automatically center the map fitting all markers on the screen
        map.fitBounds(bounds);

    }

}

问题是我不希望地图以我从数据库中获取的标记为中心。但是，如果我删除map.fitBounds(bounds);并尝试使用map.setCenter({lat: -34, lng: 151});，我会看到一个空白屏幕。如果我甚至触摸此代码中的任何内容，我会得到一个空白屏幕而不是我的地图！

Answer 1

地图必须有zoom。

您最初没有为地图设置zoom。

当您使用fitBounds()时，将自动设置缩放，但是当您不使用缩放时，仍然会丢失缩放。

解决方案：在mapOptions

中设置缩放

谷歌地图API重新定位我的地图

1 个答案: