解决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. ...
随机推荐
- php的数据访问和封装运用
php数据访问: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...
- javascript所有的节点和方法
属性: 1.Attributes 存储节点的属性列表(只读) 2.childNodes 存储节点的子节点列表(只读) 3.dataType 返回此节点的数据类型 4.Definition 以DTD或X ...
- java web项目中 读取properties 路径的问题
可以先获取项目的classPath String classPath = this.getClass().getResource("/").getPath();//获取classP ...
- Docker 初步认识
1.docker 是什么? 一个开源的应用容器引擎,个人理解 就是虚拟的应用运行环境. 2.安装Docker for windows 下载地址 :https://store.docker.com/ed ...
- VMware-VCSA-6.5安装过程
1.新建虚拟机 2.选择从OVF或OVA文件导入 3.给虚拟机命名,并选择OVF文件. 4.选择虚拟机的存储位置.这里没有配置共享存储宿,这里选择的宿主机的存储. 5.许可协议同意就OK了. 6.部署 ...
- PHP实现简单的评论与回复功能还有删除信息
我们首先先看一下功能 上面黑色的是评论的下面红色的字体是回复的 再来看看怎么实现的 1.发布评论 <form action="pinglunchili.php" method ...
- 《物联网框架ServerSuperIO教程》-22.Web端对传感器实时监测与控制。附:v3.6.8版本,支持WebSocket
1.ServerSuperIO v3.6.8更新内容 1.1 增加WebSocket服务端功能,支持自控模式.并发模式.单例模式,不支持轮询模式1.2 接收数据缓存与现有的IO实例分离.1.3 优化代 ...
- SQL数据库操作(CURD)
对数据仓库的操作(CURD): 新增: create database db_test; 新增的时候设置编码: create database da_test_1 character set utf ...
- java中方法的定义
所谓的方法(将方法称为函数)指的就是一段可以被重复调用的代码块. 对于方法的返回值类型有两种使用形式: · 有数据返回:返回值类型就使用 Java 中定义的数据类型: · 无数据返回:使用 void ...
- Tween 若干年后我尽然还要学数学 曲线到底是什么鬼啊
var Tween = { linear: function (t, b, c, d){ //匀速 return c*t/d + b; }, easeIn: function(t, b, c, d){ ...