最近要做一个百度地图的拉框效果，仔细一查，百度地图竟然已经封装好了，兴奋了一下，问题来了，百度实现的是拉框搜索，而我要做的却不是这样的功能，唉，又看不懂百度的源码，只好发挥一下自己的聪明才智自己封装一下。
拉框.html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>拉框</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
</head>
<body>
<input type="button" onclick="openbut()" value="开启"/>
<input type="button" onclick="closebut()" value="关闭"/>
<div style="width:1200px;height:570px;border:1px solid gray" id="container"></div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("container"); //设置卫星图为底图
var point1 = new BMap.Point(117.263865,34.151257);
map.centerAndZoom(point1,15);//设定地图的中心点和坐标并将地图显示在地图容器中
map.addControl(new BMap.NavigationControl()); //为地图添加鱼骨
map.enableScrollWheelZoom();//启用地图滚轮放大缩
var dflag="0";
var sflag="0";
var a1="";
var b1="";
var a2="";
var b2="";
var polygon="";
function openbut(){
dflag="1";
}
map.addEventListener("click", function(e){
if(sflag=="1"){
dflag="0";
return;
}
if(dflag=="1"){
a1=e.point.lng;
b1=e.point.lat;
beginMove();
}
});
function beginMove(){
map.addEventListener("mousemove", function(e){
if(dflag=="1"){
if(polygon!=""){
map.removeOverlay(polygon);
polygon="";
}
a2=e.point.lng;
b2=e.point.lat;
polygon = new BMap.Polygon([
new BMap.Point(a1,b1),
new BMap.Point(a2,b1),
new BMap.Point(a2,b2),
new BMap.Point(a1,b2)
], {strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5});
map.addOverlay(polygon);
sflag="1";
}
});
}
</script>
这做法不错，百度地图 提供的拉框获取不到矩形的几点 
相关推荐
百度地图基础功能封装，定位，计算，编码，等。。。。。。
基于高德地图Android SDK进行封装，配合Kotlin实现展示地图效果
地图展示 异步加载地图 同时加载两个地图 通过城市名设置中心(不支持)...鼠标拉框放大地图 鼠标点击拾取坐标 事件示例 地图加载完成 地图单击事件 覆盖物注册事件 传递事件参数 多个点注册事件 个性化 设置地图模板样式
百度地图的定位封装，包含点对点的距离判断（是否进入区域内）
本组件是用于在地图上选点、回显坐标等
现在将市面上应用最广泛的三家地图服务集成到一个APP上，实现百度地图、高德地图、腾讯地图的对比。现将整个开发步骤进行记录。 ———————————————— 版权声明：本文为CSDN博主「nanjumufeng」的原创...
当点下定位按钮时，可以在页面上显示所在区域的大致位置（精确到市级...使用百度地图的API实现定位功能，将返回的json数据封装成接口；点击按钮向接口请求数据，将请求后的定位信息使用javascript嵌入到文本域中。
使用百度SDK，封装了几个方法，实现定位功能。
这是一款简单的百度地图MVC实例，目前仅封装了百度地图的API，仅供学习交流使用， 需要的朋友可以下载学习一下。 二、注意事项 1、开发环境为Visual Studio 2013，无数据库，使用.net 4.0开发。 2、该源码仅供...
使用百度地图API可作为项目的类库文件，可以实现查看目标地区的全景，附近景点，乘车路线等。
百度、高德、腾讯、天地图、谷歌、必应等自定义地图/图片叠加层/瓦片图/金字塔图地图切图高清切片生成工具 MapCutter（旧名MapTiler） ，定位便捷，支持超大地图，支持leaflet、maptalks、openlayers、cesium、及...
jQuery实现标题滑动框效果，已经打包好的封装源码！
基于百度地图JavaScript Api封装的React组件库，使用这个库最好需要先了解React和百度地图JavaScript Api。
python实现直接读取excle数据实现的百度地图标注：https://blog.csdn.net/weixin_41290949/article/details/120638695 项目说明 百度地图标注数据量不大，希望直接读取excle生成标注；同时会有修改、编辑的需求。 ...
这个zip解压后会有三个文件，除jquery文件，另两个的源码都有。是调用百度地图的api写的一个小工具，对ip地址没有限制的，在web开发中都可以直接调用。js文件是地图的生成。demo实例，可以看出调用。有详细的注释
NULL 博文链接：https://javasam.iteye.com/blog/2054435
实现以下功能： 1、VU3百度地图根据当前IP定位城市 2、VU3百度地图创建自定义MARKER图标 3、VU3百度地图创建自定义窗体信息 4、VU3百度地图单击自定义窗体定位放大跳转到...5、VU3百度地图MARKER图标实现水波纹动画效果
Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，Api接口调用封装,实现POSt,GET等数据请求，...
android高德地图封装工具类地图定位，绘制路径等等android高德地图封装工具类地图定位，绘制路径等等android高德地图封装工具类地图定位，绘制路径等等android高德地图封装工具类地图定位，绘制路径等等android高德...