Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/452.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/22.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 为什么我无法读取属性';getCenter';当尝试访问我的嵌入谷歌地图时,是否存在未定义的?_Javascript_Angularjs_Google Maps_Google Maps Api 3 - Fatal编程技术网

Javascript 为什么我无法读取属性';getCenter';当尝试访问我的嵌入谷歌地图时,是否存在未定义的?

Javascript 为什么我无法读取属性';getCenter';当尝试访问我的嵌入谷歌地图时,是否存在未定义的?,javascript,angularjs,google-maps,google-maps-api-3,Javascript,Angularjs,Google Maps,Google Maps Api 3,以下是我在页面上构建谷歌地图的方式: var initialize = function(latitude, longitude, boundaries) { // Uses the selected lat, long as starting point var myLatLng = {lat: selectedLat, lng: selectedLong}; // If map has not been create

以下是我在页面上构建谷歌地图的方式:

var initialize = function(latitude, longitude, boundaries) {

            // Uses the selected lat, long as starting point
            var myLatLng = {lat: selectedLat, lng: selectedLong};

            // If map has not been created...
            if (!map){
                // Create a new map and place in the index.html page
                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 12,
                    center: myLatLng
                });
            }

            if(boundaries.length > 0){
                //we don't have a permission for using real GPS of the user
                var bounds = new google.maps.LatLngBounds(
                    new google.maps.LatLng(boundaries[0], boundaries[1]),
                    new google.maps.LatLng(boundaries[2], boundaries[3]) );

                map.fitBounds(bounds);
            }else{
                //we have a permission, let's mark his location with a marker
                // Set initial location as a bouncing red marker
                var initialLocation = new google.maps.LatLng(latitude, longitude);

                var marker = new google.maps.Marker({
                    position: initialLocation,
                    animation: google.maps.Animation.BOUNCE,
                    map: map,
                    icon: 'http://www.google.com/mapfiles/dd-start.png'//'http://maps.google.com/mapfiles/ms/icons/red-dot.png'
                });
                //lastMarker = marker;

            }


            refreshDataOnMap(longitude, latitude, map);
如您所见,我尝试将创建的映射传递给
refreshDataOnMap
方法:

   var refreshDataOnMap = function(long, lat, mymap) {

        console.log("refresh!!");
        var calculatedDistance = calculateRadiusInMiles(mymap);
   }
此方法调用
计算器adiusinmiles

// get the viewable map radius
        var calculateRadiusInMiles = function(map){

            var bounds = map.getBounds();

            var center = bounds.getCenter();
            var ne = bounds.getNorthEast();

            // r = radius of the earth in statute miles
            var r = 3963.0;

            // Convert lat or lng from decimal degrees into radians (divide by 57.2958)
            var lat1 = center.lat() / 57.2958;
            var lon1 = center.lng() / 57.2958;
            var lat2 = ne.lat() / 57.2958;
            var lon2 = ne.lng() / 57.2958;

            // distance = circle radius from center to Northeast corner of bounds
            var dis = r * Math.acos(Math.sin(lat1) * Math.sin(lat2) +
                    Math.cos(lat1) * Math.cos(lat2) * Math.cos(lon2 - lon1));
            return dis;
        };
我的控制台中的结果显示:

刷新

angular.js:12520 TypeError:无法读取的属性“getCenter” 未定义 在calculateRadiusInMiles(gsservice.js:112) 在refreshDataOnMap上(gsservice.js:48) 初始化时(gsservice.js:214) 在Object.googleMapService.refresh(gsservice.js:36) 反对。(gservice.js:225) 在Object.invoke(angular.js:4523) 在Object.enforcedReturnValue[as$get](angular.js:4375) 在Object.invoke(angular.js:4523) 在angular.js:4340 在getService(angular.js:4482)(匿名函数)@angular.js:12520(匿名函数)@angular.js:9292Scope.$apply@ angular.js:16157bootstrapApply@angular.js:1679invoke@ angular.js:4523doBootstrap@angular.js:1677bootstrap@ angular.js:1697angularInit@angular.js:1591(匿名函数)@ angular.js:29013fire@jquery.js:3182self.fireith@ jquery.js:3312jQuery.extend.ready@jquery.js:3531已完成@ jquery.js:3547

刷新

因此,我无法正确使用页面上的地图。我不知道这里可能出了什么问题,对我来说,它看起来像是在我尝试调用其属性后加载的映射,但是-如果这是正确的-我如何防止它

谢谢

编辑===========

这里有一个细节,因为它可能有助于调试此问题:


我加载谷歌地图并根据用户ip地址将其居中,但当浏览器检测到gps数据时,地图将重新加载并指向特定的gps点。这就是为什么在my console.log中可以看到
刷新两次

必须是
边界
未定义,因此
映射
无效。当映射被传递到
calculateRadiusInMiles()
时,您是否检查了它?你检查过边界了吗?地图已经加载了吗

编辑到填空:

v3中似乎有一个事件正是针对这一点:

`google.maps.event.addListener(map, 'bounds_changed', function() {
     alert(map.getBounds());
});


谢谢你的建议,在我的例子中,地图是在加载期间,所以它还没有加载,因此边界是未定义的。但是,你能给我一个直接的提示如何修复它吗?
`google.maps.event.addListener(map, 'idle', function() {
     alert(map.getBounds());
});