谷歌地图设置新的标记位置和panTo

google map set new marker position and panTo

本文关键字：位置 panTo 设置 谷歌地图      更新时间：2023-09-26

我试图修改现有主题的js，以便能够在地图上显示不同的位置。以下是原始代码:

function initialize() {
    var map;
    var brooklyn = new google.maps.LatLng(parseFloat("<?php echo $coordinates[0]; ?>"), parseFloat("<?php echo $coordinates[1]; ?>"));
    var stylez = [{
        featureType: "all",
        elementType: "all",
        stylers: [{
                saturation: -100
            } // <-- THIS
        ]
    }];
    var mapOptions = {
        zoom: parseInt("<?php the_field("google_map_zoom_level"); ?>"),
        center: brooklyn,
        mapTypeControlOptions: {
            mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'tehgrayz']
        }
    };
    map = new google.maps.Map(document.getElementById("map"), mapOptions);
    var mapType = new google.maps.StyledMapType(stylez, {
        name: "Grayscale"
    });
    map.mapTypes.set('tehgrayz', mapType);
    map.setMapTypeId('tehgrayz');
    marker = new google.maps.Marker({
        title: "<?php echo $map["
        address "]; ?>",
        position: new google.maps.LatLng(parseFloat("<?php echo $coordinates[0]; ?>"), parseFloat("<?php echo $coordinates[1]; ?>")),
        map: map
    });
}
initialize();
 //google.maps.event.addDomListener(window, 'load', initialize);
}

我还设法使用各种教程来创建一个函数，该函数将标记移动到新位置。

function changeMarkerPos(lat, lon){
    myLatLng = new google.maps.LatLng(lat, lon);
    marker.setPosition(myLatLng);
    map.panTo(myLatLng);
}

然而，尽管标记确实移动了，但地图并没有像我希望的那样以它为中心。有人能帮我吗?我不太擅长使用js，所以请保持事情简单…

谢谢! !

需要全局声明映射变量。函数changeMarkerPos目前不能使用它。

var map;
function initialize() {
    var brooklyn = new googl............

EDIT -以下内容这次不会产生任何影响。setCenter()是有用的，但不是你问题的答案。

本周早些时候我正在做类似的事情，并使用map.setCenter();

function changeMarkerPos(lat, lon){
    myLatLng = new google.maps.LatLng(lat, lon);
    marker.setPosition(myLatLng);
    map.panTo(myLatLng); 
    map.setCenter(myLatLng);    
}
相关文章：