Javascript 谷歌地图标记定位与自定义图标

Javascript 谷歌地图标记定位与自定义图标,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,我遇到了一个问题,我的带有自定义图标的标记似乎显示在地图上稍有不同的点上,具体取决于缩放级别。我以前使用过带有自定义图标的标记,所以我不知道我做错了什么。您将看到,最初它看起来像是位于道路上的标记,但如果缩小两次,它看起来像是在上面,如果放大两次,它看起来像是在下面 代码: var映射; 函数初始化(){ 变量映射选项={ 中心:新的google.maps.LatLng(-38.255338144.30834), 缩放:11, mapTypeId:google.maps.mapTypeId.R

我遇到了一个问题,我的带有自定义图标的标记似乎显示在地图上稍有不同的点上,具体取决于缩放级别。我以前使用过带有自定义图标的标记,所以我不知道我做错了什么。您将看到,最初它看起来像是位于道路上的标记,但如果缩小两次,它看起来像是在上面,如果放大两次,它看起来像是在下面

代码:


var映射;
函数初始化(){
变量映射选项={
中心:新的google.maps.LatLng(-38.255338144.30834),
缩放:11,
mapTypeId:google.maps.mapTypeId.ROADMAP,
真的,
动物控制:对,
滚轮:错误,
disableDefaultUI:true,
};
map=new google.maps.map(document.getElementById(“map”)、mapOptions);
var location=new google.maps.LatLng(-38.174379144.237155);
var icon1='数据:图像/png;base64,IVBorW0Kggoaaaansuheugaaaaaaaaaaaaoaoayaaaafsc3RaaacXbiwxmaaastaalWeampwyaaAakt2DQ1BqAg90B3Nob3aNob3aGSUndihbyB2 ZpbGuaahjanVnVnpfPfJ333VRCS4IAletVuhuiIfjIfjIfjIfjIfjIqqOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjOjAjAjAjAjAjAjAjAjAjAjAjA2.B+B+B+B+B+B+B+B+B+B+B+B+C+B+C+B+C+B+B+B+B+B+B+B+B+B+C(C)C(C)的一个C(C)是一个C(C)C(C)是一个C(C)C(C)C(C)是一个C(C)C(C(C)C(C)C(C)是一个C(C(C)C(C)C(C)是一个C(C(C)C(C)是一个C(C(C)是一个C(C(C)是一个C)是一个C(C(C(C)是一个C(C)是一个C(C)是一个C(C(C(C)是一个C(C)是一个C(C)是一个C(C(C(C(C)是一个C)是一个C奥恩aV/aV/1+8/PF4 4 4 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7 7巴亚格蒂谢亚菲这篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章,一篇文章是一篇文章的一篇文章是一篇论文的一篇文章,一篇文章是一篇文章是一篇文章的一篇文章,一篇文章是一篇文章是一篇文章,一篇文章是一篇文章,一篇是一篇文章是一篇关于关于一篇文章,一篇文章,一篇是关于关于关于关于关于关于关于某某某某个关于某个政府政府政府政府的研究的研究的研究,一个政府的研究,一个关于关于某某某某某某某某个政府的政府的政府的政府的政府的研究,一个政府的研究,一个政府的政府的研究,一个关于某某某某某某某某某某某某某某某某某KG+Qh8lsKnWJAc2.一个非公开的研究结果表明,一个非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的非公开的QZNKM1EzuvouzJ8H45HX+Jx0Tg2.在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国,在中国na0l1rutu6crp7lok06rntz2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2、2 cubzwojgugbwwl7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4Kt2.在未来的某一时期,某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的某一领域的Q2QBOVFOO1YOHS2.这两个词的意思是:一个词的意思是:一个词的意思是,一个词的意思是,这个词的意思是一个词的意思是,这个词的意思是一个词的意思是一个词的意思是,一个词的意思是,这个词的意思是,一个词的意思是,这个词的意思是,这个词的意思是,这个词的意思是一个词的意思是,这个词的意思是一个词的意思是,这个词的意思是,这个词的意思是一个词的意思是一个词的意思是一个单词的意思是一个单词的意思是一个单词的意思是,或者或者或者或者是,或者是,或者是,或者是一个单词的意思意思是一个单词的意思是一个单词的意思是一个单词的意思,或者或者或者或者或者是,或者或者或者或者或者是,或者或者或者或者或者是一个单词的意思是一个单词的意思,或者或者或者或者或者或者或者是一个单词1WBVZFTJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6月6日,6月6日,6月6日,6月6日,6月6日,6月6日,6月6日,8月2日,8月2日,6月2日,6月2日,6月2日,6月2日,6月6日,6月6日,6月6日,6月6日,6月6日,6月6日,6月6日,6月6日,6月6日,6日,6月6日,6日,6日,8号,6月2号,6月2号,6号,6月2号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,6号,QDLD3YFVP1V+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw96.我/某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某TD7EOXLL/TN54CLLCM89CM9J4TSI3UV93AL2.中国政府提出了一个8+6+6+6+6+6+6+6+6+6+6+6+6+2 2 2两个框架,一个8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8 8/7Yjhkr189DUGwYDoThqEKPOt7bO3j7lkjhWot8/MRC1PDN1YZXMIMQGJI4CDPZTF0T48MDW69HAH6ERIMUXVMB9HHR1AWCLBOKIABRIYWAABJRU5ERKJGG==';
变量markerImage1={
url:icon1,
scaledSize:新的google.maps.Size(14,14),
};
var marker=new google.maps.marker({
位置:位置,,
地图:地图,
图标:markerImage1
});
}
#地图{
高度:500px;
保证金:0自动;
宽度:1024px;
}

如果希望图标的锚定不位于底部边缘的中心,则必须设置
锚定
属性

F
<!DOCTYPE html>
   <html>
       <head>
           <script src="https://maps.googleapis.com/maps/api/js"></script>

           <script type="text/javascript">
           var map;

        function initialize() {


            var mapOptions = {
                center: new google.maps.LatLng(-38.255338, 144.30834),
                zoom: 11,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                draggable: true,
                zoomControl: true,
                scrollwheel: false,
                disableDefaultUI: true,
            };

            map = new google.maps.Map(document.getElementById("map"), mapOptions);

            var location = new google.maps.LatLng(-38.174379, 144.237155);
            var icon1 = 'data:image/png;base64,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';

            var markerImage1 = {
                url: icon1,
                scaledSize: new google.maps.Size(14, 14),
            };
            var marker = new google.maps.Marker({
                position: location,
                map: map,
                icon: markerImage1
            });
        }
        </script>
        <style>
            #map {
                height: 500px;
                margin: 0 auto;
                width: 1024px;
            }
        </style>
    </head>
    <body onload='initialize()'>
        <div id='map'></div>
    </body>
</html>
var markerImage1 = {
  url: icon1,
  scaledSize: new google.maps.Size(14, 14),
  anchor: new google.maps.Point(7,7)  
};