百度地图API示例之设置级别setZoom与禁止拖拽disableDragging

设置级别

<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 {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
#allmap{width:100%;height:500px;}
p{margin-left:5px; font-size:14px;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=sSelQoVi2L3KofLo1HOobonW"></script>
<title>缩放地图</title>
</head>
<body>
<div id="allmap"></div>
<p>初始化展示中心点为(116.4035,39.915),缩放级别为8的北京市地图,2秒后,通过设置缩放级别将地图放大到14级</p>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
//map.centerAndZoom(new BMap.Point(116.4035,39.915),8);
map.centerAndZoom('宿迁',8);
setTimeout(function(){
map.setZoom(14); // setZoom 方法,负责设置级别,只有停留几秒,才能看到效果
}, 2000); //2秒后放大到14级
map.enableScrollWheelZoom(true);
</script>

禁止拖拽

<!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=sSelQoVi2L3KofLo1HOobonW"></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.4035,39.915),8); //初始化时,即可设置中心点和地图缩放级别。
map.enableScrollWheelZoom(true);
map.disableDragging(); //禁止拖拽
setTimeout(function(){
map.enableDragging(); //两秒后开启拖拽
//map.enableInertialDragging(); //两秒后开启惯性拖拽
}, 2000);
</script>

百度地图API示例之设置级别setZoom与禁止拖拽disableDragging的更多相关文章

  1. 百度地图API示例之设置地图最大、最小级别

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  2. 百度地图API示例之设置地图显示范围

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  3. 百度地图API示例之根据城市名设置地图中心点

    代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" con ...

  4. 百度地图API示例之移动地图

    级别为6 级别为8 级别为12 代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Conten ...

  5. 百度地图API示例之添加自定义控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  6. 百度地图API示例之文本标注

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  7. 百度地图API示例之添加/删除工具条、比例尺控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  8. 百度地图API示例之添加定位相关控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  9. 百度地图API示例:鼠标绘制点线面 控件修改

    需求 :在使用地图API时,绘制工具栏控件想自己选择哪些要,哪些不要. 可以查看相应的类:官网地址: http://api.map.baidu.com/library/DrawingManager/1 ...

随机推荐

  1. cookie窃取和session劫持

    Updates 2014-08-17 感谢@搞前端的crosser的提醒,加入了HTTP Response Splitting的内容. 此篇文章的Presentation戳这里. 一.cookie的基 ...

  2. ABOUT LIFETIME

    This is where we started We've come a long way since our beginning. It all started as an idea in a g ...

  3. Day14 summary

    Since I am writing blog in Ubuntu which has not installed Chinese language package, this blog will b ...

  4. html,if标签使用

    $vo.auth_id eq $vo2.auth_pid报错不能用 condition里面访问变量,不能用点的形式,应该用['']的形式访问

  5. Xml Schema:C#访问在complextype中插入新元素

    最近用c#写Xml Schema代码,找了很久也找不到如何在已有的complextype中插入新的element,最后我充分发挥自己的聪明才智,哈哈,终于从...中找到了灵感. XmlSchemaSe ...

  6. 第三个Sprint冲刺第四天

    讨论地点:宿舍 讨论成员:邵家文.李新.朱浩龙.陈俊金 讨论问题:强化界面功能

  7. 我的Java后端书架 (2016年暮春3.0版)

      04月 24, 2016 | Filed under 技术 http://calvin1978.blogcn.com/articles/javabookshelf.html 书架主要针对Java后 ...

  8. Android-->Genymotion虚拟机(模拟器)的配置

    --> Genymotion 是一套完整的工具,它提供了Android虚拟环境.它简直就是开发者.测试人员.推销者甚至是游戏玩家的福音. 我只能说非常好用,模拟器中顶级,具体好处可以度娘. -- ...

  9. LintCode Balanced Binary Tree

    Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced binary ...

  10. 如何在一个网站或者一个页面规划JS

    规划主要分为两部分:1.JS的分层,2.Js的规划 1.JS的分层(功能) 1-1.底层的库 : jquery  1-2.组件(ui) : 比如拖拽等,模块之间没有必然的联系,可以重复利用  1-3. ...