123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126 |
- <%@ page language="java" contentType="text/html; charset=UTF-8"
- pageEncoding="UTF-8"%>
- <%@ include file="../common/meta.jsp"%>
- <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=mHjQLONxGpRtrZHZkxr9t3cD3n0HupQ0"></script>
- <title>商户管理</title>
- </head>
- <body>
- <div id="map" style="width:100%;height:385px; font-size:16px;"></div>
- <form class="layui-form layui-form-horizontal" action id="form-add" style="margin-top:10px">
- <div class="layui-form-item layui-row">
- <label class="layui-form-label" style="width: 10%; float: left;"><span
- class="c-red">*</span>当前经度</label>
- <div class="layui-input-block" style="width: 20%; float: left;">
- <input type="text" id="longitude" name="longitude"
- lay-verify="required" autocomplete="off"
- class="layui-input">
- </div>
- <label class="layui-form-label" style="width: 10%; float: left;"><span
- class="c-red">*</span>当前纬度</label>
- <div class="layui-input-block" style="width: 20%; float: left;">
- <input type="text" id="latitude" name="latitude"
- lay-verify="required" autocomplete="off"
- class="layui-input">
- </div>
- <div class="layui-input-block" style="width: 20%; float: left;padding-left:20px;">
- <button class="layui-btn layui-btn-small" id="ok">确定</button>
- </div>
- </div>
- </form>
- <script type="text/javascript">
- var map = new BMap.Map("map");
- var address=web.getUrlVars("address");
- var lng=web.getUrlVars("lng");
- var lat=web.getUrlVars("lat");
- layui.define(['layer','laydate', 'form'], function (exports) {
- var $ = layui.jquery,layer = layui.layer,form = layui.form,laydate=layui.laydate;
- initMap();
- var options = {
- onSearchComplete: function(results){
- if (local.getStatus() == BMAP_STATUS_SUCCESS){
- if(results.getCurrentNumPois()>0){
- var place = results.getPoi(0);
- var point = new BMap.Point(place.point.lng,place.point.lat);
- $("#longitude").val(place.point.lng);
- $("#latitude").val(place.point.lat);
- initPoint(point);
- }else{
- layer.msg("地址定位失败,请拖动坐标选定位置");
- var point = new BMap.Point(117.950, 28.463);
- initPoint(point);
- }
- }else{
- layer.msg("地址定位失败,请拖动坐标选定位置");
- var point = new BMap.Point(117.950, 28.463);
- initPoint(point);
- }
- }
- };
- var local = new BMap.LocalSearch(map, options);
- if(lng&&lat){
- $("#longitude").val(lng);
- $("#latitude").val(lat);
- var point = new BMap.Point(lng, lat);
- initPoint(point);
- }else{
- local.search(decodeURI(address));
- }
- $("#ok").on("click",function(){
- if($("#longitude").val()==""||$("#latitude").val()==""){
- layer.msg("经度、纬度不能为空");
- return false;
- }
- parent.$("#longitude").val($("#longitude").val());
- parent.$("#latitude").val($("#latitude").val());
- var index = parent.layer.getFrameIndex(window.name);
- parent.layer.close(index);
- return false;
- });
- });
- function initMap(){
- map.centerAndZoom(new BMap.Point(117.950, 28.463), 18);
- map.enableScrollWheelZoom();
- map.enableDragging();
- }
- function initPoint(point){
- map.panTo(point);
- function PositionControl() {
- // 默认停靠位置和偏移量
- this.defaultAnchor = BMAP_ANCHOR_TOP_LEFT;
- this.defaultOffset = new BMap.Size($(document).width()/2 - 12, $('#map').height()/2 - 26); // 距离左上角位置
- }
- // 通过JavaScript的prototype属性继承于BMap.Control
- PositionControl.prototype = new BMap.Control();
- // 自定义控件必须实现自己的initialize方法,并且将控件的DOM元素返回
- // 在本方法中创建个div元素作为控件的容器,并将其添加到地图容器中
- PositionControl.prototype.initialize = function(map) {
- // 创建一个DOM元素,24X26
- var div = document.createElement("div");
- // 设置样式
- div.className = "iconfont icon-coordinates";
- div.style.color = 'red';
- div.style.fontSize = '36px';
- // 绑定事件
- div.onclick = function(e) {
- }
- // 添加DOM元素到地图中
- map.getContainer().appendChild(div);
- // 将DOM元素返回
- return div;
- }
- // 创建控件
- var myZoomCtrl = new PositionControl();
- // 添加到地图当中
- map.addControl(myZoomCtrl);
- map.addEventListener('moveend', function() {
- var pos = map.getCenter();
- $("#longitude").val(pos.lng);
- $("#latitude").val(pos.lat);
- });
- }
- </script>
- </body>
- </html>
|