显示Google地图偏离中心

时间:2014-12-06 12:48:42

标签: google-maps google-maps-api-3 google-maps-markers

我们正在使用Google Maps API来显示地图,该地图正常运行。

我看到很多人抱怨人们地图上的标记不在中心。

我们实际上想要相反,由于该特定地图上的处所的位置,我们希望地图略微偏离中心,位置和标记朝向地图的右上角(以澄清,我们希望基本上移动地图画布,而不是改变房屋的实际位置。

以下是我们正在使用的代码。 center: latlng是地图的中心,所以我知道我们需要将center参数更改为其他内容,但我不确定是什么。

<script src="//maps.google.com/maps/api/js?sensor=false&amp;region=GB"></script>
<script>
var geocoder1 = new google.maps.Geocoder;
geocoder1.geocode( { 'address': "360 Any Street, 12345"}, function(results, status) {
    myGeocode(results, status, 'map_canvas');
});
function myGeocode(results, status, canvas) {
    if (status == google.maps.GeocoderStatus.OK) {
        var latlng = new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng());
        var myOptions = {
            zoom: 12,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
        };
        var map = new google.maps.Map(document.getElementById(canvas), myOptions);
        var myMarker = new google.maps.Marker({ position: latlng, map: map });
    } else {
        // alert("Geocode was not successful for the following reason: " + status);
    }
}
</script>
<div id="map_canvas" style="width: 600px; height: 600px;"></div>

1 个答案:

答案 0 :(得分:2)

这是当前案例的解决方案,但在缩放更改时不会设置中心以获得所需的视图。如果您想要更优雅的解决方案,可以在每个zoom_changed事件后使用包含缩放值的公式重置中心。

...
var myMarker = new google.maps.Marker({ position: latlng, map: map });
var offsetLat = -0.02;
var offsetLng = -0.02;
map.setCenter(new google.maps.LatLng((map.getCenter().lat() + offsetLat) , (map.getCenter().lng() + offsetLng))); 
} else {
...