이 글은 PHP Amap(1)을 사용하여 다각형을 그리고 편집하여 좌표를 얻는 내용을 소개합니다(간단한 요약). 이제 필요한 친구들이 참고할 수 있도록 공유합니다. Amap API를 처음 사용하는 경우 먼저 Amap 키를 신청해야 합니다.
주요 지침:1. Amap 표시2. Amap 지도를 클릭하여 좌표를 가져옵니다
3. Amap 지도에서
4 . 다각형을 편집하고 좌표를 가져오는 Amap 마우스
<style> .map-list{float: left; margin-left: 10px;} .pbot10{ padding-bottom: 10px;} .marleft{ margin-left: 10px;} </style> <p class="panel panel-default"> <p class="panel-body"> <p> <p id="container" style="width: 70%; height: 500px; float: left;"></p> <p style="margin-bottom: 5px;"> <ul class="map-list-add"> <?php foreach ($oldRegionArr as $k => $v): ?> <li> [<?=$v;?>], </li> <?php endforeach;?> </ul> <ul class="map-list-hidden hidden"> <?php foreach ($oldLngLatArr as $key => $val):?> <li> <?php foreach ($val as $k => $v):?> <span><?=$v;?></span> <?php endforeach;?> </li> <?php endforeach;?> </ul> <textarea class="form-control hidden" name="region" rows="3"> </textarea> </p> <a class="btn btn-primary btn-sm fl" id="clearMarker" onclick="clearMap()">清空所有 </a> <a class="btn btn-primary btn-sm fl marleft" id="huaMarker">生成抢修范围 </a> <br><br> <a class="btn btn-primary btn-sm fl marleft" id="PolyEditor" onClick="startEditPolygon()">开始编辑抢修范围 </a> <a class="btn btn-primary btn-sm fl marleft" id="CircleEditor" onClick="closeEditPolygon()">结束编辑抢修范围 </a> </p> </p> </p> </p> </p> <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.4&key=高德key&plugin=AMap.MouseTool,AMap.PolyEditor,AMap.CircleEditor"> </script> <script type="text/javascript"> var city = '济南'; //生成地图 var map = new AMap.Map('container',{ resizeEnable: true, zoom: 13 }); //地图上添加工具 AMap.plugin(['AMap.ToolBar','AMap.Scale','AMap.OverView'], function() { map.addControl(new AMap.ToolBar()); map.addControl(new AMap.Scale()); }); //设置地图中心 var lngLat = map.getCenter(); var lng = lngLat.lng; var lat = lngLat.lat; if(city) { map.setCity("" + city + ""); } else { map.setCenter([lng, lat]); } //清空地图 function clearMap() { map.clearMap(); $('.map-list-add').html(''); positions = []; $('textarea[name=region]').val(''); $('.map-list-hidden').html(''); } //点击地图获取坐标 function huaNew() { var positions = []; //地图上点击事件 map.on('click', function(e) { //显示点击的坐标 var lngLat = e.lnglat.getLng() + ',' + e.lnglat.getLat(); //将坐标填的 ul var html = $('.map-list-add').html(); html += '<li>[' + lngLat + ']</li>'; positions.push([e.lnglat.getLng(), e.lnglat.getLat()]); $('.map-list-add').html(html); }); } //画多边形的参数 var xian = { strokeColor: "#FF33FF", //线颜色 strokeOpacity: 0.2, //线透明度 strokeWeight: 3, //线宽 fillColor: "#1791fc", //填充色 fillOpacity: 0.35//填充透明度 }; //画多边形 var mouseTool = new AMap.MouseTool(map); //在地图中添加MouseTool插件 AMap.event.addDomListener(document.getElementById('huaMarker'), 'click', function() { clearMap(); huaNew(); mouseTool.polygon(xian); }, false); //默认加载的多边形 $(function () { var markers = [], positions = []; var valRegion = '[116.97174,36.707879],[116.986675,36.681658],[116.983241,36.677665],[116.954059,36.675256],'; var len = $('.map-list-hidden li').length; for(var p=0; p < len; p++) { var posit = []; var defaultLng = $('.map-list-hidden li:eq('+p+') span:eq(0)').html(); var defaultLat = $('.map-list-hidden li:eq('+p+') span:eq(1)').html(); posit.push(parseFloat(defaultLng)); posit.push(parseFloat(defaultLat)); positions.push(posit); } $('textarea[name=region]').val(valRegion); //编辑多边形 var _polygon = (function(){ var arr = positions; xian.path = positions; xian.map = map; return new AMap.Polygon(xian); })(); //编辑多边形初始化 _polygonEditor = new AMap.PolyEditor(map, _polygon); //开始编辑 startEditPolygon = function(){ _polygonEditor.open(); } //结束编辑 closeEditPolygon = function(){ var html = '', htmlText = ''; _polygonEditor.close(); var a = _polygon.getPath(); for(var q = 0; q < a.length; q++) { var posit = []; posit.push(parseFloat(a[q]['lng'])); posit.push(parseFloat(a[q]['lat'])); html += "<li>[" + posit + "],</li>"; htmlText += "[" + posit + "],"; } $('.map-list-add').html(html); $('textarea[name=region]').val(htmlText); } }); </script>
:
http:// lbs.ama p.com/api/javascript -api/guide/create-map/show-map 지도 표시
http://lbs.amap.com/api/javascript-api/guide/draw-on -map/marker-point 포인트 마크
http://lbs.amap.com/api/javascript-api/example/marker/marker-content 포인트 마크 예시
http://lbs.amap. com/api/javascript-api/example/overlayers/polyline-circle-polygon 폴리라인, 폴리곤, 원 예제
http://lbs.amap.com/api/javascript-api/example/mouse-operate- map/mouse-draw-overlayers 마우스 그리기 점 선 표면
http://lbs.amap.com/faq/web/javascript-api/327
http://lbs.amap.com/api/javascript-api/example/overlayers/edit-polyline-circle-polygon 폴리라인, 폴리곤, 원 편집
http://lbs. amap.com/faq/web/javascript-api/editpolygon-getpath
위 내용은 PHP는 Amap(1)을 사용하여 다각형을 그리고 편집하여 좌표를 얻습니다(간단한 요약).의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!