Google Maps V3信息框始终位于中心位置

时间:2013-11-26 10:41:54

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

我正在努力使用谷歌地图。 昨天我有一个问题是在我想要的地方显示一个infowindow,stackoverflow的用户告诉我试试这个:

http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.5/src/infobox.js

那个插件解决了我的问题,但我得到另一个。 我希望能够调整页面大小并始终将标记位置放在地图的中心。我怎么能这样做?

继承我的代码:

function initialize() {

    var loc, map, marker, infobox;

    loc = new google.maps.LatLng(40.20384, -8.39935);

    map = new google.maps.Map(document.getElementById("map"), {
         zoom: 18,
         center: loc,
         mapTypeId: google.maps.MapTypeId.HYBRID,
         scrollwheel: false,
         draggable: false,


    });

    marker = new google.maps.Marker({
        map: map,
        position: loc,
        visible: true,
        icon: "public/images/logo.png",
    });

    infobox = new InfoBox({
         content: document.getElementById("over_map"),
         disableAutoPan: false,
         maxWidth: 150,
         pixelOffset: new google.maps.Size(100, -100),
         zIndex: null,
         boxStyle: {
            background: "gray",
            opacity: 0.75,
            width: "280px"
        },
        closeBoxMargin: "10px 2px 2px 2px",
        isHidden: false,
        closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
        infoBoxClearance: new google.maps.Size(1, 1)
    });

    infobox.open(map, marker);

    google.maps.event.addListener(marker, 'click', function() {
        infobox.open(map, this);
        map.panTo(loc);
    });
}
google.maps.event.addDomListener(window, 'load', initialize);

希望有人可以帮助我:)。

1 个答案:

答案 0 :(得分:2)

您可以使用window.onresize

window.onresize=function() {
   map.setCenter(marker.getPosition());
}

参见此工作演示 - > http://jsfiddle.net/Fae26/ - 尝试调整框架大小或调整整个窗口的大小。