谷歌地图API-缩小时默认标记不准确

Google Maps API - Default marker inaccurate when zoomed out

本文关键字：不准确默认小时 API- 缩小谷歌地图更新时间：2023-09-26

我的默认标记有问题，缩小后似乎偏移了。我在这里仔细查看了一下，但只能找到自定义标记图像和在图像上设置锚点的答案。我使用的是谷歌默认的标记图像。

http://thecompleteanimaldirectory.com

这是有问题的网站，你会注意到书中的地图一旦缩小就会不准确，例如怀特岛的客户最终会在德国！

然而，在这个页面上，地图是准确的。

http://www.thecompleteanimaldirectory.com/search.php?category=dog&面积=

geocoder = new google.maps.Geocoder();
                                var mapOptions = {
                                    center: { lat: 32.00, lng: 15.00},
                                    zoom: 8
                                };

                                function initialize() {
                                    var map20 = new google.maps.Map(document.getElementById("map_canvas_barrie"), mapOptions);
                                    function codeAddress20() {
                                        var address20 = "11 Ashey Park, Ashey Road Ryde, I.O.W, PO33 4AL";

                                        geocoder.geocode( { "address": address20}, function(results, status) {
                                            if (status == google.maps.GeocoderStatus.OK) {
                                                map20.setCenter(results[0].geometry.location);
                                                var marker20 = new google.maps.Marker({
                                                    map: map20, 
                                                    position: results[0].geometry.location,
                                                });
                                            } else {
                                                map20.setZoom(0);
                                            }
                                        });
                                    }
                                    codeAddress20();

两个页面的代码都是相同的，我甚至在两个页面上对地图进行了相同的样式设计，但运气不好。感谢您的帮助！

这是一个CSS问题。

问题的根源是main.css中的这条规则，它也适用于地图中的图像：

        .booklet .b-wrap-right img,
        #book-right-side img {
            position: absolute;
            bottom: 10px;
            right: 15px;
            height: 30px;
        }

添加此规则以覆盖它：

  .right-book .gm-style img{
            bottom: 0;
            right: 0;
            position:relative;
            height:auto;
  }