Google地图标注（最新版V3下的写法）基础篇

女爷i 2021-09-10 05:06 335阅读 0赞

<script type="text/javascript">  
    		var map;
            var markersArray = [];
    
           function initialize()
            {
    		   if(window.top.$('#<?php echo $field?>').val()) {
    		   var data = window.top.$('#<?php echo $field?>').val();
    			var data = data.split('|');
    			var lngX = data[0];
    			var latY = data[1];
    			var zoom = data[2] ? Number(data[2]) : 10;
                var latlng = new google.maps.LatLng(latY, lngX);
    		   }
    		   else
    			{
    			    var latlng = new google.maps.LatLng(41, 29);
    				var zoom = 10;
    			}
                var myOptions = {
                    zoom: zoom,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                map = new google.maps.Map(document.getElementById("mapObj"), myOptions);
    
                // add a click event handler to the map object
                google.maps.event.addListener(map, "click", function(event)
                {
                    // place a marker
                    addMarker(event.latLng);
    
                    // display the lat/lng in your form's lat/lng fields
                });
            }
            function addMarker(location) {
                // first remove all markers if there are any
                deleteOverlays();
    
                var marker = new google.maps.Marker({
                    position: location, 
                    map: map
                });
    
                // add marker in markers array
                markersArray.push(marker);
    			var ZoomLevel = map.getZoom();
    				window.top.$('#<?php echo $field?>').val(location.lat()+'|'+location.lng()+'|'+ZoomLevel);
                //map.setCenter(location);
            }
    
            // Deletes all markers in the array by removing references to them
            function deleteOverlays() {
                if (markersArray) {
                    for (i in markersArray) {
                        markersArray[i].setMap(null);
                    }
                markersArray.length = 0;
                }
            }
    google.maps.event.addDomListener(window, 'load', initialize);
        </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，335人围观）

还没有评论，来说两句吧...

相关阅读

相关 mapv地图文字标注

效果 ![609c0741e6eb48ee904b85b8953ba58f.png][] 代码 //文字标注 function text() {

男娘i/ 2024年03月30日 08:46/ 0 赞/ 32 阅读

相关基础地图-在线地图-天地图（标注）

基础地图-在线地图-天地图（标注）效果图如下： ![1340563-20190820162754704-675404651.png][] 在xbsj-earthSDK中

￡神魔★判官ぃ/ 2023年06月04日 12:53/ 0 赞/ 44 阅读

相关基础地图-在线地图-天地图（无标注）

示例效果： ![1340563-20190820154351458-1955697710.png][] 代码展示： <!DOCTYPE html> <h

柔情只为你懂/ 2023年06月04日 12:53/ 0 赞/ 48 阅读

相关最简单的Google地图实现全屏在地图内部下方增加标注，小屏将标注显示在地图外面

最简单的方法实现Google地图实现全屏在地图内部下方增加标注，小屏将标注显示在地图外面 React代码 > 自己引入一下google地图 import Re

比眉伴天荒/ 2022年12月28日 14:05/ 0 赞/ 136 阅读

相关 Bootstrap V4 最新版中文翻译！

Bootstrap是当前世界最受欢迎的响应式、移动设备优先的门户和应用前端框架。在其中，你将发现高质量的HTML、CSS以及JavaScript，使您的WEB工程项目变得无比简

╰半橙微兮°/ 2022年05月30日 23:06/ 0 赞/ 202 阅读

相关精准测试白皮书v3.0-2019最新版

精准测试诞生的背景　现代社会是建立在各种以计算机为基石的软件技术基础之上的。随着日新月异的需求变化，软件系统越来越复杂。很多人觉得软件开发才是重要环节，但实际上，

电玩女神/ 2022年02月13日 00:15/ 0 赞/ 161 阅读

相关 Google Map V3笔记总结

谷歌V3版本已经不需要key了，JAVASCRIPT的API与百度也差不多(想了解百度地图的可以看下我的博客)，但总体来说谷歌的API更多，功能更强大，开发的灵活性也更好。然而

浅浅的花香味﹌/ 2022年01月27日 08:49/ 0 赞/ 206 阅读

相关高德Mapabc地图标注基础篇

<SCRIPT LANGUAGE="JavaScript"> //设置中心点为北京 //设置地图初始化参数对象 var mapOpt

绝地灬酷狼/ 2021年09月10日 05:08/ 0 赞/ 390 阅读

相关百度地图标注基础篇

<script type="text/javascript"> var mapObj = new BMap.Map("mapObj");

蔚落/ 2021年09月10日 05:06/ 0 赞/ 407 阅读

相关 Google地图标注（最新版V3下的写法）基础篇

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

女爷i/ 2021年09月10日 05:06/ 0 赞/ 336 阅读