地图不是一直居中的

时间:2012-03-30 18:30:11

标签: google-maps google-maps-markers center

我正在使用以下代码将地图居中,因此将标记置于中心。问题是标记大多数时间都在左上角,当我放大和缩小时,标记将再次位于左上角。

怎么了?您可以在erik-edgren.nu/weather处看到问题/网站。

function initialize_map() {
    var myOptions = {
        zoom: 4,
        mapTypeControl: true,
        navigationControl: true,
        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.SMALL
        },
        streetViewControl: false,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
}

function initialize() {
    $('#map_canvas').hide();

    if(geo_position_js.init()) {
        $('#current').html('Söker efter din plats. Var god vänta...');
        geo_position_js.getCurrentPosition(show_position, function() {
            $('#current').html('Kunde tyvärr inte hitta din position.');
        }, {
            enableHighAccuracy: true
        });
    } else {
        $('#current').html('Det verkar som att din webbläsare inte tillåter att webbsidan hämtar din position. Ta en titt i webbläsarens inställningar för att se om denna funktion är igång eller inte, och försök sedan igen.');
    }
}

function show_position(p) {
    $('#current').html('');
    $('#map_canvas').show();

    var pos = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
    map.setCenter(pos);
    map.setZoom(10);

    var marker = new google.maps.Marker({
        position: pos,
        map: map
    });

    $('#weather-data').load('weather-set.php?lat=' + p.coords.latitude.toFixed(6).replace(/\./, '') + '&long=' + p.coords.longitude.toFixed(6).replace(/\./, ''));
}

提前致谢!

1 个答案:

答案 0 :(得分:0)

确保您在map_canvas div元素上明确设置了一个大小,当我意外地将其删除时,我在某些浏览器上遇到了这个问题。

<div id="map_canvas" style="width: 100%; height: 100%"></div> 

来自API docs

  

请注意,地图的大小始终与其大小相同   包含元素,因此您必须始终在其上设置大小   明确。