解决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>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现