javascript Google Map API v3 - 超出最大调用堆栈大小

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/27420052/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 07:28:10  来源:igfitidea点击:

Google Map API v3 - Maximum call stack size exceeded

javascriptjquerygoogle-maps-api-3widget

提问by Matt Alexander

I have been developing a JS widgetfor the last 5 or 6 weeks. The idea is that it can be added to any site by simply adding a href to the remote .js file and also a DIV container with a given ID to contain the contents of the widget.

JS widget在过去的 5 或 6 周里,我一直在开发一个。这个想法是它可以添加到任何站点,只需向远程 .js 文件添加一个 href 以及一个具有给定 ID 的 DIV 容器来包含小部件的内容。

The widget makes extensive use of Google Map API and I am referencing it as follows:

该小部件广泛使用了 Google Map API,我将其引用如下:

https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,places&callback=initializeGoogleMaps

When the widget is loaded, it will ask the user permission to check their location and then perform, amongst other operations, a simply geocoding for the location so that a marker can be plotted on the map.

当小部件加载时,它会要求用户检查他们的位置,然后执行,除其他操作外,对位置进行简单的地理编码,以便可以在地图上绘制标记。

Everything has been working perfectly and I must've tested the searching over 2,000 during development.

一切都运行良好,我必须在开发过程中测试了超过 2,000 次的搜索。

I deployed the widget yesterday and successfully embedded it into a host website - everything worked as perfectly as it always has done. This morning, however, my widget is falling over with Chrome's console reporting:

我昨天部署了这个小部件并成功地将它嵌入到一个主机网站 - 一切都像往常一样完美。然而,今天早上,我的小部件因Chrome 的控制台报告而崩溃:

Uncaught RangeError: Maximum call stack size exceeded{main,geometry,places}.js:27 (anonymous function)VM530:33 cVM530:33 TT.(anonymous function).fitBounds{main,geometry,places}.js:48 (anonymous function){main,geometry,places}.js:26 Uf{main,geometry,places}.js:48 O.fitBoundsWRAPPostcodeLocator.js:1541 setupPageWRAPPostcodeLocator.js:964 jQuery.ajax.successjquery.js?time=95944:3 jjquery.js?time=95944:3 k.fireWithjquery.js?time=95944:12 xjquery.js?time=95944:12 b.onload.b.onreadystatechange

Since the widget last worked, no changes have been made to my code or the host, so I suspect something wrong with the Google API.

自从小部件上次工作以来,我的代码或主机没有任何更改,所以我怀疑 Google API 有问题。

An example of my widget embedded into a dummy host can be seen at:

可以在以下位置看到我的小部件嵌入到虚拟主机中的示例:

http://pcl.solsticecloud.co.uk

Having spent several hours trying to get to the bottom of this, I'm still non the wiser.

花了几个小时试图弄清这件事的真相后,我仍然不聪明。

Any help or advice would be so much appreciated.

任何帮助或建议将不胜感激。

Thank you in advance,

先感谢您,

Matt

马特

回答by Jhollman

Thanks Matt Alexander this was exactly the problem and the solution, however it seems that Google changed the names of the Location properties AGAIN, not .kand .Danymore, now its .Aand .F!, take a look at the following console log:

谢谢马特亚历山大,这正是问题和解决方案,但似乎谷歌再次更改了位置属性的名称,不再是.k.D,现在是.A.F!,看看下面的控制台日志:

Console Log

控制台日志

回答by Dorad

For nowadays it's '.G' and '.K'. And as said - it's better to use '.lat()' and '.lng()'.

现在是'.G'和'.K'。正如所说 - 最好使用 '.lat()' 和 '.lng()'。

回答by Daniel Ram

You can also use

你也可以使用

 keys = Object.keys(LatLng);
 geometry.location[keys[0]]; // Obtain value for latitude

回答by Matt Alexander

I have found the cause of this issue and have a fix.

我已经找到了这个问题的原因并进行了修复。

I was using the following code:

我正在使用以下代码:

        address = document.getElementById("strSearch").value;

    geocoder.geocode({ 'address': address, componentRestrictions: { country: 'GB' } }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            toggleModal();

            deleteMarkers();
            deleteBanks();

            searchSourceLatLng = new google.maps.LatLng(results[0].geometry.location.k, results[0].geometry.location.B);
            setSearchPointPostcode(results, buildResults);
        }

        else {
            callback();
        }
    })

The particular line that caused the issue is:

导致问题的特定行是:

searchSourceLatLng = new google.maps.LatLng(results[0].geometry.location.k, results[0].geometry.location.B);

".B" has worked for weeks, but now it would seem that is no longer a valid property. Instead, ".D" works and so my code now works.

“.B”已经工作了数周,但现在它似乎不再是一个有效的属性。相反,“.D”有效,所以我的代码现在有效。

As the property was no longer valid, I had a LatLng object with a null value and this caused the map to crash when I tried to see my map boundaries.

由于该属性不再有效,我有一个具有空值的 LatLng 对象,这导致当我尝试查看地图边界时地图崩溃。

I would love to know how or why this has changed in the API.

我很想知道这在 API 中是如何或为什么发生变化的。

Also, a stupid question I'm sure, but why ".k" and ".D"? What's wrong with ".Lng" and ".Lat"?

另外,我敢肯定这是一个愚蠢的问题,但为什么是“.k”和“.D”?“.Lng”和“.Lat”有什么问题?

Glad it's sorted though, just hope the API doesn't change again.

很高兴它已经排序,只是希望 API 不会再次改变。

回答by inorganik

You can loop over the properties of locationand get the coordinates without accessing its properties directly:

您可以遍历 的属性location并获取坐标,而无需直接访问其属性:

geocoder.geocode({ 'address': value.address }, function (results, status) {
if (status === google.maps.GeocoderStatus.OK && results.length > 0) {

    var coords = [];
    for (var key in results[0].geometry.location) {
        coords.push(results[0].geometry.location[key]);
    }
    return {
        'latitude': coords[0],
        'longitude': coords[1]
    };
}
});

回答by RaviPatidar

try with this one hope it will help you

试试这个希望它会帮助你

                var map = new google.maps.Map(mappnl.el.dom, {
                    zoom: 8,
                    center: {
                        lat: 52.132633,
                        lng: 5.291265999999999
                    },
                    mapTypeId: google.maps.MapTypeId.TERRAIN
                });
                var latlong = [];
                var geocoder = new google.maps.Geocoder();        
                if(frmvalue.dir_postalcode_standard){
                    geocoder.geocode({
                        'address': frmvalue.dir_postalcode_standard
                    }, function(results, status) {

                        if (status == google.maps.GeocoderStatus.OK) {

                            slat = results[0].geometry.location.lat();
                            slng = results[0].geometry.location.lng();

                            latlong['standard'] = {
                                'lat': slat,
                                'lng': slng
                            };
                            var cityCircle = new google.maps.Circle({
                                strokeColor: '#00FF00',
                                strokeOpacity: 0.8,
                                strokeWeight: 1,
                                fillColor: '#00FF00',
                                fillOpacity: 0.15,
                                map: map,
                                center: {
                                    lat: slat,
                                    lng: slng
                                },
                                radius: frmvalue.dir_radius_standaard * 1000
                            });
                            map.setCenter({
                                lat: slat,
                                lng: slng
                            });

                            geocoder.geocode({
                                'address': frmvalue.dir_postalcode_extended
                            }, function(results, status) {

                                if (status == google.maps.GeocoderStatus.OK) {

                                    elat = results[0].geometry.location.lat();
                                    elng = results[0].geometry.location.lng();
                                    latlong['extended'] = {
                                        'lat': elat,
                                        'lng': elng
                                    };

                                    var cityCircle = new google.maps.Circle({
                                        strokeColor: '#FF0000',
                                        strokeOpacity: 0.8,
                                        strokeWeight: 1,
                                        fillColor: '#FF0000',
                                        fillOpacity: 0.15,
                                        map: map,
                                        center: {
                                            lat: elat,
                                            lng: elng
                                        },
                                        radius: frmvalue.dir_radius_extended * 1000
                                    });
                                    callback(latlong);
                                } else {
                                    console.log("Geocode was not successful for the following reason: " + status);
                                }
                            });
                        } else {
                            console.log("Geocode was not successful for the following reason: " + status);
                        }

                    });
                } else {
                    callback(false);
                }

回答by tika

Sometimes this file has the problem : https://www.gstatic.com/charts/loader.js

有时这个文件有问题:https: //www.gstatic.com/charts/loader.js

So if you use mine it definitely works.

所以如果你使用我的它肯定有效。

Instead of using this :

而不是使用这个:

 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

Use this one:

使用这个:

google-chart-loader.js

google-chart-loader.js

<script src="~/Content/js/google-chart-loader.js"></script>

https://drive.google.com/open?id=1eOPtgJ9FoZ6917q3OcNPKGe3AT-PXIzg

https://drive.google.com/open?id=1eOPtgJ9FoZ6917q3OcNPKGe3AT-PXIzg