| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <!DOCTYPE html> |
| | | <html> |
| | | <head> |
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| | | <title></title> |
| | | <script type="text/javascript" src="../internal.js"></script> |
| | | <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.1&services=true"></script> |
| | | <style type="text/css"> |
| | | .content{width:530px; height: 350px;margin: 10px auto;} |
| | | .content table{width: 100%} |
| | | .content table td{vertical-align: middle;} |
| | | #city,#address{height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;} |
| | | #city{width:60px} |
| | | #address{width:130px} |
| | | #is_dynamic_label span{vertical-align:middle;margin: 3px 0px 3px 3px;} |
| | | #is_dynamic_label input{vertical-align:middle;margin: 3px 3px 3px 50px;} |
| | | </style> |
| | | </head> |
| | | <body> |
| | | <div class="content"> |
| | | <table> |
| | | <tr> |
| | | <td><var id="lang_city"></var>:</td> |
| | | <td><input id="city" type="text" /></td> |
| | | <td><var id="lang_address"></var>:</td> |
| | | <td><input id="address" type="text" value="" /></td> |
| | | <td><a href="javascript:doSearch()" class="button"><var id="lang_search"></var></a></td> |
| | | <td><label id="is_dynamic_label" for="is_dynamic"><input id="is_dynamic" type="checkbox" name="is_dynamic" /><span><var id="lang_dynamicmap"></var></span></label></td> |
| | | </tr> |
| | | </table> |
| | | <div style="width:100%;height:340px;margin:5px auto;border:1px solid gray" id="container"></div> |
| | | |
| | | </div> |
| | | <script type="text/javascript"> |
| | | var map = new BMap.Map("container"),marker,point,styleStr; |
| | | map.enableScrollWheelZoom(); |
| | | map.enableContinuousZoom(); |
| | | function doSearch(){ |
| | | if (!document.getElementById('city').value) { |
| | | alert(lang.cityMsg); |
| | | return; |
| | | } |
| | | var search = new BMap.LocalSearch(document.getElementById('city').value, { |
| | | onSearchComplete: function (results){ |
| | | if (results && results.getNumPois()) { |
| | | var points = []; |
| | | for (var i=0; i<results.getCurrentNumPois(); i++) { |
| | | points.push(results.getPoi(i).point); |
| | | } |
| | | if (points.length > 1) { |
| | | map.setViewport(points); |
| | | } else { |
| | | map.centerAndZoom(points[0], 13); |
| | | } |
| | | point = map.getCenter(); |
| | | marker.setPoint(point); |
| | | } else { |
| | | alert(lang.errorMsg); |
| | | } |
| | | } |
| | | }); |
| | | search.search(document.getElementById('address').value || document.getElementById('city').value); |
| | | } |
| | | //è·å¾åæ° |
| | | function getPars(str,par){ |
| | | var reg = new RegExp(par+"=((\\d+|[.,])*)","g"); |
| | | return reg.exec(str)[1]; |
| | | } |
| | | function init(){ |
| | | var mapNode = editor.selection.getRange().getClosedNode(), |
| | | isMapImg = mapNode && /api[.]map[.]baidu[.]com/ig.test(mapNode.getAttribute("src")), |
| | | isMapIframe = mapNode && domUtils.hasClass(mapNode, 'ueditor_baidumap'); |
| | | if(isMapImg || isMapIframe){ |
| | | var url, centerPos, markerPos; |
| | | if(isMapIframe) { |
| | | url = decodeURIComponent(mapNode.getAttribute("src")); |
| | | $G('is_dynamic').checked = true; |
| | | styleStr = mapNode.style.cssText; |
| | | } else { |
| | | url = mapNode.getAttribute("src"); |
| | | styleStr = mapNode.style.cssText; |
| | | } |
| | | |
| | | centerPos = getPars(url,"center").split(","); |
| | | markerPos = getPars(url, "markers").split(","); |
| | | point = new BMap.Point(Number(centerPos[0]),Number(centerPos[1])); |
| | | marker = new BMap.Marker(new BMap.Point(Number(markerPos[0]), Number(markerPos[1]))); |
| | | map.addControl(new BMap.NavigationControl()); |
| | | map.centerAndZoom(point, Number(getPars(url,"zoom"))); |
| | | }else{ |
| | | point = new BMap.Point(116.404, 39.915); // å建ç¹åæ |
| | | marker = new BMap.Marker(point); |
| | | map.addControl(new BMap.NavigationControl()); |
| | | map.centerAndZoom(point, 10); // åå§åå°å¾,设置ä¸å¿ç¹åæ åå°å¾çº§å«ã |
| | | } |
| | | marker.enableDragging(); |
| | | map.addOverlay(marker); |
| | | } |
| | | init(); |
| | | document.getElementById('address').onkeydown = function (evt){ |
| | | evt = evt || event; |
| | | if (evt.keyCode == 13) { |
| | | doSearch(); |
| | | } |
| | | }; |
| | | dialog.onok = function (){ |
| | | var center = map.getCenter(); |
| | | var zoom = map.zoomLevel; |
| | | var size = map.getSize(); |
| | | var mapWidth = size.width; |
| | | var mapHeight = size.height; |
| | | var point = marker.getPoint(); |
| | | |
| | | if($G('is_dynamic').checked) { |
| | | var URL = editor.options.UEDITOR_HOME_URL, |
| | | url = [URL + (/\/$/.test(URL) ? '':'/') + "dialogs/map/show.html" + |
| | | '#center=' + center.lng + ',' + center.lat, |
| | | '&zoom=' + zoom, |
| | | '&width=' + mapWidth, |
| | | '&height=' + mapHeight, |
| | | '&markers=' + point.lng + ',' + point.lat, |
| | | '&markerStyles=' + 'l,A'].join(''); |
| | | editor.execCommand('inserthtml', '<iframe class="ueditor_baidumap" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + ' frameborder="0" width="' + (mapWidth+4) + '" height="' + (mapHeight+4) + '"></iframe>'); |
| | | } else { |
| | | var url = "http://api.map.baidu.com/staticimage?center=" + center.lng + ',' + center.lat + |
| | | "&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat; |
| | | editor.execCommand('inserthtml', '<img width="'+ size.width +'"height="'+ size.height +'" src="' + url + '"' + (styleStr ? ' style="' + styleStr + '"' :'') + '/>'); |
| | | } |
| | | }; |
| | | document.getElementById("address").focus(); |
| | | </script> |
| | | |
| | | |
| | | </body> |
| | | </html> |