baidu.html 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="renderer" content="webkit">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <title>{$web.name} - {$web.title}</title>
  8. {load href="__PUBLIC__/base/base.css,__PUBLIC__/manage/style.css,__PUBLIC__/js/do.js,__PUBLIC__/js/package.js,__PUBLIC__/admin/common.js" /}
  9. <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=F51571495f717ff1194de02366bb8da9&s=1"></script>
  10. <style>
  11. html,body{background-color: #f4f5f9;}
  12. #allmap{height:400px}
  13. #footer{background-color: #f4f5f9;border-top: 0;text-align: center;height:40px;padding:20px}
  14. </style>
  15. </head>
  16. <body>
  17. <div id="allmap"></div>
  18. <div id="footer">
  19. <input id="longitude" readonly="true" class="input w100 readonly" type="text" name="longitude" />
  20. <input id="latitude" readonly="true" class="input w100 readonly" type="text" name="latitude" />
  21. <input type="button" value="确定当前坐标" class="button button-red selectID" />
  22. </div>
  23. </body>
  24. </html>
  25. <script type="text/javascript">
  26. Do('base','layer',function(){
  27. // 百度地图API功能
  28. var map = new BMap.Map("allmap");
  29. var point = new BMap.Point(116.331398,39.897445);
  30. map.centerAndZoom(point,12);
  31. var myGeo = new BMap.Geocoder();
  32. myGeo.getPoint("{$address}", function(point){
  33. if (point) {
  34. $("input[name='longitude']").val(point.lng);
  35. $("input[name='latitude']").val(point.lat);
  36. map.centerAndZoom(point, 16);
  37. var marker = new BMap.Marker(point);
  38. var label = new BMap.Label("拖动精准定位",{offset:new BMap.Size(20,-10)});
  39. label.setStyle({color : "blue",fontSize : "14px",height : "30px",lineHeight : "25px",fontFamily:"微软雅黑"});
  40. marker.setLabel(label)
  41. map.addOverlay(marker);
  42. marker.enableDragging(); //可拖拽
  43. marker.addEventListener("dragend", function(e){
  44. $("input[name='longitude']").val(e.point.lng);
  45. $("input[name='latitude']").val(e.point.lat);
  46. });
  47. }else{
  48. var myCity = new BMap.LocalCity();
  49. myCity.get(myFun);
  50. }
  51. },"{$cityname}");
  52. map.enableScrollWheelZoom(true);
  53. map.enableDragging(); //两秒后开启拖拽
  54. map.enableInertialDragging(); //两秒后开启惯性拖拽
  55. //城市定位
  56. function myFun(result){
  57. var cityName = result.name;
  58. map.setCenter(cityName);
  59. }
  60. $(".selectID").click(function(){
  61. var index = parent.layer.getFrameIndex(window.name);
  62. var lng = $("#longitude").val(),lat = $("#latitude").val();
  63. var point = {
  64. 'lng':lng,
  65. 'lat':lat,
  66. }
  67. parent.$("#iframe")[0].contentWindow.setPoint(point);
  68. parent.layer.close(index);
  69. })
  70. })
  71. </script>