zoukankan      html  css  js  c++  java
  • 百度地图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>

    根据实际情况来使用吧!

  • 相关阅读:
    Advanced Configuration Tricks
    Reviewing the Blog Module
    Editing and Deleting Data
    Making Use of Forms and Fieldsets
    Understanding the Router
    SQL Abstraction and Object Hydration
    Preparing for Different Databases
    Java学习理解路线图
    Openstack学习历程_1_视频
    CentOS安装Nginx负载
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/5002746.html
Copyright © 2011-2022 走看看