谷歌地图 API 中的多个标记 无法读取未定义的属性“lat”

Multiple Markers In Google Maps Api Cannot read property 'lat' of undefined

本文关键字：未定义 读取 属性 lat API 谷歌地图      更新时间：2023-09-26

我有一个对象数组，我在地图上放置了标记。这些项目都在检索中，但是我在"bounds.extend（myLatLng[i]）;"上收到"无法读取未定义的属性'lat'"的错误你能看出原因吗 

function _studentsNearBySuccess(data) {
                    vm.notify(function () {
                        vm.studentsNearBy = data.items;
                        for (var i = 0; i < vm.studentsNearBy.length; i++) {
                            var myLatLng = new google.maps.LatLng(vm.studentsNearBy[i].latitude, vm.studentsNearBy[i].longitude);
                            var bounds = new google.maps.LatLngBounds();
                            var marker = new google.maps.Marker({
                                position: myLatLng[i],
                                title: 'Student Near By named ' + vm.studentsNearBy[i].firstName,
                            });
                            bounds.extend(myLatLng[i]);
                            var mapOptions = {
                                zoom: 10,
                                center: myLatLng
                            }
                            vm.map = new google.maps.Map($('#map-canvas')[0], mapOptions);
                            marker.setMap(vm.map)
                            vm.map.fitBounds(bounds);
                            var infowindow = new google.maps.InfoWindow({
                                content: vm.studentsNearBy[i].firstName + vm.studentsNearBy[i].lastName + vm.studentsNearBy[i].email
                            });
                        }

当您执行以下操作时，您可以将myLatLng创建为单个 LatLng：

var myLatLng = new google.maps.LatLng(vm.studentsNearBy[i].latitude, vm.studentsNearBy[i].longitude);

但是，当您这样做时，您可以尝试将其引用为LatLng的数组：

position: myLatLng[i],

和

bounds.extend(myLatLng[i]);

它不是一个数组。 只需将这两个都更改为：

position: myLatLng,

和 

bounds.extend(myLatLng);

更新：添加了函数的新版本。看起来您正在为每个标记创建一个新地图。 我假设你只需要 1 张地图，而不是每个学生一张？ 并移动了创建 LatLngBounds 的代码，然后使地图适合这些边界，在循环之外。 您仍然可以在循环中扩展边界。 

function _studentsNearBySuccess(data) {
    vm.notify(function () {
        vm.studentsNearBy = data.items;
        var bounds = new google.maps.LatLngBounds();
        var mapOptions = {
            zoom: 10,
            center: myLatLng
        }
        vm.map = new google.maps.Map($('#map-canvas')[0], mapOptions);
        for (var i = 0; i < vm.studentsNearBy.length; i++) {
            var myLatLng = new google.maps.LatLng(vm.studentsNearBy[i].latitude, vm.studentsNearBy[i].longitude);
            var marker = new google.maps.Marker({
                map: vm.map,
                position: myLatLng,
                title: 'Student Near By named ' + vm.studentsNearBy[i].firstName,
            });
            bounds.extend(myLatLng);
            var infowindow = new google.maps.InfoWindow({
                content: vm.studentsNearBy[i].firstName + vm.studentsNearBy[i].lastName + vm.studentsNearBy[i].email
            });
        }
        vm.map.fitBounds(bounds);
    }
}
相关文章：