关于百度地图API显示地区范围控制的问题

2024-05-12 23:17:45

关于百度地图API显示地区范围控制的问题，这个有很多种方法，需要看个人需求下面列举两种方法
1.假如我只想在

加载地图的时候显示郑州市所包含的范围，其他地方屏蔽掉，或者不让拖拽（如有图所示）

2.

控制区域范围，比如我只想显示北京市，只能在北京市内拖曳——地图控制在某一区域，具体实现

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html, #allmap {
width: 100%;
height: 100%;
overflow: hidden;
margin: 0;
font-family: "微软雅黑";
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
<title>地图展示</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
//var map = new BMap.Map("allmap"); // 创建Map实例
//map.centerAndZoom(new BMap.Point(116.404, 39.915), 15); // 初始化地图,设置中心点坐标和地图级别
var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(116.404, 39.915), 13);
map.enableScrollWheelZoom(); // 允许滚动

map.addControl(new BMap.MapTypeControl()); //添加地图类型控件

//添加地图平移缩放控件

map.addControl(new BMap.NavigationControl());

//控制地图的最大和最小缩放级别
map.setMinZoom(16);
map.setMaxZoom(18);
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放

var strictBounds=new Bmap.Bounds(new BMap.Point(116.3645,39.9673),new BMap.Point(116.3646,39.9685));//sw西南,ne东北
var strictBounds=map.getBounds();
map.addEventListener("dragend", function(){
if(strictBounds.containsPoint(map.getCenter()))return;
var c=map.getCenter();
x=c.lng,
y=c.lat,
maxX=strictBounds.getNorthEast().lng,
maxY=strictBounds.getNorthEast().lat,
minX=strictBounds.getSouthWest().lng,
minY=strictBounds.getSouthWest().lat;
if (x < minX) x = minX;
if (x > maxX) x = maxX;
if (y < minY) y = minY;
if (y > maxY) y = maxY;
map.centerAndZoom(new BMap.Point(x,y),map.getZoom());
})
</script>

关于百度地图API显示地区范围控制的问题相关推荐

百度地图API 显示区域边界及地名定位
百度地图API 显示区域边界及地名定位这个定位一共用了两个方法组成一个是定位绘制区域边界线,另一个是地名定位原理: 当用户输入省.市.县.区这种大地名时,我们要定位用户输入的这个位置,并显示轮廓 ...
百度地图API显示多个标注点的代码以及修改传参
引用的页面原始数据 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
百度地图API显示多个标注点带提示的代码 / 单个标注点带提示代码
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head><me ...
百度地图API显示车辆运行轨迹并动画展示
百度地图api 版本:3.0 开发文档:http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference_3_0.html#a0b0 需求描述项 ...
【QT】--调用百度地图API显示
编译运行环境 Qt 5.15.2 MSVC2019 release编译 1.html文件百度地图提供API示例程序将代码复制到html文件中,用编辑器打开,这里用vs打开在图中位置替换为个人申请 ...
利用百度地图api显示北京某区电影院
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>北 ...
移动端百度地图多点标注php,百度地图API多重打点标注
因为之前的html地图页面,所以去找了很多Demo和代码来学习,其中有一个Demo,不知道出处但是最后用了他的方法来处理百度地图的多重打点并且显示标注信息的方法,具体代码我就不贴了,去搜索:百度地图A ...
android应用控制百度地图,Android中应用百度地图API开发地图APP实例-显示百度地图...
场景效果在使用百度地图API之前需要先在百度地图开放平台中申请API_KEY 申请API_KEY 登录百度开放平台后找到控制台下的应用管理-创建应用依次输入应用名,应用类型选择Android S ...
Android中应用百度地图API开发地图APP实例-显示百度地图
场景效果在使用百度地图API之前需要先在百度地图开放平台中申请API_KEY http://lbsyun.baidu.com/index.php 申请API_KEY 登录百度开放平台后找到控制台下 ...

最新文章

热门文章