Question

我的地图工作得很好;绘制带有半径圆圈的标记，并在点击时显示infoWindows。然后突然一无所获

我浏览了git历史记录，但没有对代码进行任何更改。
它既不在本地工作也不在公共领域部署。
没有JS错误。
地址正确地进行了地理编码。
地图本身呈现。
我低于限额。
我查看了Google Maps API更改日志，但没有看到任何相关内容。

有人请找到我没看到的东西！

<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            #map_canvas {
                width:1000px;
                height:700px;
            }
        </style>
    </head>
    <body>
        <div id="map_canvas"></div>
        <script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
        <script>

            var addresses = ["117 Balsam Avenue,Hamilton,Ontario,Canada,L8M 3B4", "47 East Avenue,Hamilton,Ontario,Canada,L8L 5H4"];
            var map;
            var infoWindow;

            function encodeAddresses(addresses, callback) {
                var geocoder = new google.maps.Geocoder();
                for (var i = 0; i < addresses.length; i++) {
                    geocoder.geocode({
                        'address' : addresses[i]
                    }, function (results, status) {
                        if (status === google.maps.GeocoderStatus.OK) {
                            var lat = results[0].geometry.location.Qa;
                            var long = results[0].geometry.location.Pa;
                            var address = results[0].formatted_address;
                            addCircleToMap(lat, long, address);
                            addMarkerToMap(lat, long, address);
                        }
                    });
                }
            }

            function addCircleToMap(lat, long, address) {
                var options = {
                    strokeColor : "#4EA429",
                    strokeOpacity : 0.8,
                    strokeWeight : 1,
                    fillColor : "#4EA429",
                    fillOpacity : 0.35,
                    map : map,
                    center : new google.maps.LatLng(lat, long),
                    radius : 1000,
                    address : address
                };
                var propertyRadius = new google.maps.Circle(options);
                google.maps.event.addListener(propertyRadius, 'click', showInfo);
            }

            function showInfo(e) {
                infoWindow.setContent(this.address + "<br />(1000m/3280ft radius)");
                infoWindow.setPosition(e.latLng);
                infoWindow.open(map);
            }

            function addMarkerToMap(lat, long, address) {
                new google.maps.Marker({
                    title : address,
                    map : map,
                    position : new google.maps.LatLng(lat, long)
                });
            }

            function renderMap() {
                var mapContainer = document.getElementById("map_canvas");
                var mapOptions = {
                        zoom : 9,
                        center : new google.maps.LatLng(43.645004, -79.380707),
                        mapTypeId : google.maps.MapTypeId.ROADMAP
                    };
                adjustMapContainerHeight(mapContainer);
                map = new google.maps.Map(mapContainer, mapOptions);
                infoWindow = new google.maps.InfoWindow();
            }

            function adjustMapContainerHeight(element) {
                element.style.height = (document.height - 90) + "px";
            }

            function getCurrentPosition(defaultLatitude, defaultLongitude, callback) {  
                var currentPosition = {};
                    currentPosition.latitude = defaultLatitude;
                    currentPosition.longitude = defaultLongitude;
                if (navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(
                        function (position) {
                        currentPosition.latitude = position.coords.latitude;
                        currentPosition.longitude = position.coords.longitude;
                    },
                        function (error) {});
                }
                callback(currentPosition);
            }

            getCurrentPosition(43.645004, -79.380707, renderMap);
            encodeAddresses(addresses, addCircleToMap);

        </script>
    </body>
</html>

Answer 1

尝试更改encodeAddresses()函数中的以下行。它在我的机器中运行正常并带有更改：

var lat = results[0].geometry.location.Pa;    
 var long = results[0].geometry.location.Qa;

您使用Pa作为long和Qa作为lat，而不是谷歌支持的。所以更改两行并检查。

希望这可以帮助你： - ）

Answer 2

您正在使用随每个API版本更改的未记录字段。

使用lat()对象上的lng()和LatLng方法。

请参阅reference documentation。

Google Maps API v3标记和圈子突然停止显示

2 个答案: