解决kindeditor编辑器中使用百度地图时不能拖动坐标的问题
覆盖\plugins\baidumap文件夹下的map.html代码即可
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Baidu Maps </title>
<style>
html {
height: 100%;
}
body {
height: 100%;
margin: 0;
padding: 0;
background-color: #FFF;
}
#map_canvas {
height: 100%;
width:100%;
}
</style>
</head>
<body>
<div id="map_canvas"></div>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
<script type="text/javascript">
function getUrlParas() {
var hash = location.hash,
para = {},
tParas = hash.substr(1).split("&");
for (var p in tParas) {
if (tParas.hasOwnProperty(p)) {
var obj = tParas[p].split("=");
para[obj[0]] = obj[1];
}
}
return para;
}
var para = getUrlParas(),
center = para.address ? decodeURIComponent(para.address) : "百度大厦",
city = para.city ? decodeURIComponent(para.city) : "北京市";
var marker_trick = false;
var map = new BMap.Map("map_canvas");
map.enableScrollWheelZoom();
var marker = new BMap.Marker(new BMap.Point(116.404, 39.915), {
enableMassClear: false,
raiseOnDrag: true
});
marker.enableDragging();
map.addOverlay(marker);
map.addEventListener("click", function (e) {
if (!(e.overlay)) {
map.clearOverlays();
marker.show();
marker.setPosition(e.point);
setResult(e.point.lng, e.point.lat);
}
});
marker.addEventListener("dragend", function (e) {
setResult(e.point.lng, e.point.lat);
});
var local = new BMap.LocalSearch(map, {
renderOptions: { map: map },
pageCapacity: 1
});
local.setSearchCompleteCallback(function (results) {
if (local.getStatus() !== BMAP_STATUS_SUCCESS) {
alert("无结果");
} else {
marker.hide();
}
});
local.setMarkersSetCallback(function (pois) {
for (var i = pois.length; i--;) {
var marker = pois[i].marker;
marker.addEventListener("click", function (e) {
marker_trick = true;
var pos = this.getPosition();
setResult(pos.lng, pos.lat);
});
}
});
window.onload = function () {
local.search(center);
};
function search(address) {
local.search(address);
}
/*
* setResult : 定义得到标注经纬度后的操作
* 请修改此函数以满足您的需求
* lng: 标注的经度
* lat: 标注的纬度
*/
function setResult(lng, lat) {
map.panTo(new BMap.Point(lng, lat));
}
</script>
</body>
</html>
解决kindeditor编辑器中使用百度地图时不能拖动坐标的问题的更多相关文章
- 在iOS APP中使用H5显示百度地图时如何支持HTTPS?
现象: 公司正在开发一个iOSAPP,使用h5显示百度地图,但是发现同样的H5页面,在安卓可以显示出来,在iOS中就显示不出来. 原因分析: 但是现在iOS开发中,苹果已经要求在APP中的所有对外连接 ...
- C# 程序中嵌入百度地图
本例是对WinForm中使用百度地图的简要介绍.百度地图目前支持Android开发,IOS开发,Web开发,服务接口,具体可以参照'百度地图开放平台'. [动态加载百度地图]涉及到的知识点: WebB ...
- Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图
标签: Android百度地图API Key 分类: Android 百度地图开发(2) 最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地 ...
- Android应用中使用百度地图API并加入标注(一)
网上一些资料这样的的内容已经过时了,这里是最新的内容,假设哪里不正确,请吐槽... 1)下载百度地图移动版API(Android)开发包 要在Android应用中使用百度地图API,就须要 ...
- AngularJS进阶(十九)在AngularJS应用中集成百度地图实现定位功能
在AngularJS应用中集成百度地图实现定位功能 注:请点击此处进行充电! 前言 根据项目需求,需要实现手机定位功能,考虑到百度业务的强大能力,遂决定使用百度地图第三方服务. 添加第三方模块的步骤与 ...
- 如何在vue单页应用中使用百度地图
作为一名开发人员,每次接到开发任务,我们首先应该先分析需求,然后再思考技术方案和解决方案.三思而后行,这是一个好的习惯. 需求:本项目是采用vue组件化开发的单页应用项目,现需要在项目中引入百度的地图 ...
- pc网页中嵌入百度地图
pc网页中嵌入百度地图 1 打开百度地图生成器: http://api.map.baidu.com/lbsapi/creatmap/ 2 设置好了之后,点击获取代码,将代码粘贴到文件中保存为html文 ...
- 在ionic/cordova中使用百度地图插件
在ionic项目中,如果想实现定位功能,可以使用ng-cordova提供的cordova-plugin-geolocation. 但由于高墙的缘故,国内andorid环境下,此插件不起作用(ios环境 ...
- 网页中嵌入百度地图报错:The request has been blocked,the content must served over Https
网页中嵌入百度地图 1.进入百度地图开发平台:http://lbsyun.baidu.com/index.php?title=jspopular 2.获取密钥:http://lbsyun.baidu. ...
随机推荐
- MYSQL导入数据报错|MYSQL导入超大文件报错|MYSQL导入大数据库报错:2006 - MySQL server has gone away
导SQL数据库结构+数据时,如果数据是批量插入的话会报错:2006 - MySQL server has gone away. 解决办法:找到你的mysql目录下的my.ini配置文件(如果安装目录没 ...
- HTTP协议 URL
http(超文本传输协议)是一个基于请求与响应模式的.无状态的.应用层的协议,常基于TCP的连接方式,HTTP1.1版本中给出一种持续连接的机制,绝大多数的Web开发,都是构建在HTTP协议之上的We ...
- kali系统破解WPA密码实战
上次发布过一篇在OSX系统破解WIFI密码的教程, 这次发布一篇使用kali破解wifi的教程 WEP和WPA/PSK的区别 WPA/PSK的加密方式相对于WEP的加密方式更加安全,WEP是一种老式的 ...
- js倒计时函数和(js禁用和恢复a标签的操作)
<script type="text/javascript"> /*获取手机号*/ var start_time=60; function get_phone_nums ...
- 【Android Developers Training】 42. 从另一台设备接收文件
注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...
- 11.page,pagcontext,config对象
- 基于REM的移动端响应式适配方案
视口 在前一段时间,我曾经写过一篇关于viewport的文章.最近由于在接触移动端开发,对viewport有了新的理解.于是,打算重新写一篇文章,介绍移动端视口的相关概念. 关于这篇文章说到的所有知识 ...
- 数据结构(C语言版)顺序表相关算法代码实现
这两天实现了一下顺序表的相关操作,包括顺序表初始化.创建.遍历.第i个元素前插入,删除第i个元素.查找元素e的位置.清空顺序表.销毁顺序表.合并两个非递减顺序表操作. 这次在网上学习到了新的布局方法, ...
- MyBatis基础
一.大配置 <?xml version="1.0" encoding="UTF-8" ?> <!--文档类型,头文件--> <!D ...
- 开源自己写的图片转Ascii码图工具
GitHub地址:https://github.com/qiangzi7723/img2Ascii 如果觉得不错可以给个star或者提出你的建议 img2Ascii,基于JS的图片转ASCII示意图. ...