1.定义一个控件类,即function

    function ZoomControl(){   

     // 设置默认停靠位置和偏移量   

       this.defaultAnchor = BMAP_ANCHOR_TOP_LEFT;   

         this.defaultOffset = new BMap.Size(10, 10);   

    }     

2.通过JavaScript的prototype属性继承于BMap.Control

ZoomControl.prototype = new BMap.Control();

3.自定义控件必须实现自己的initialize方法,并且将控件的DOM元素返回

ZoomControl.prototype.initialize = function(map){
  
  var b1 = document.createElement("input");   b1.type = "button";
  b1.value="放大1级";
  b1.onclick = function(e){
    map.zoomTo(map.getZoom() + 1);
  }   var b2 = document.createElement("input");
  b2.type = "button";
  b2.value="缩小1级";
  b2.onclick = function(e){
    map.zoomTo(map.getZoom() - 1);
  }   var div = document.createElement("div");
  div.appendChild(b1);
  div.appendChild(b2);   map.getContainer().appendChild(div);
  return div;
}

4.创建控件, 添加到地图当中

var myZoomCtrl = new ZoomControl();   

map.addControl(myZoomCtrl);  

5.打开浏览器

百度地图API的第一次接触——自定义控件的更多相关文章

  1. 百度地图API的第一次接触

    因为项目的需求,第一次接触了百度API. 第一步:引用百度地图API的脚本 如果在局域网环境中,要把地图文件和js文件都要下载下来 <script type="text/javascr ...

  2. 百度地图API的第一次接触——地图事件

    0.初始化地图 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...

  3. 百度地图API的第一次接触——标注和信息窗的使用

    1.定义js函数,用于在指定位置添加标注,在标注位置添加并打开信息窗口 function addMarker(point, index){ // 创建图标对象 var myIcon = new BMa ...

  4. 百度地图API的第一次接触——热区

    1.代码很简单 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...

  5. 百度地图API的第一次接触——右键菜单

    1.初始化地图 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...

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

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

  7. 百度地图api添加自定义控件

    官网栗子:http://lbsyun.baidu.com/jsdemo.htm#b0_6 <!DOCTYPE html><html><head> <meta ...

  8. 百度地图api简单使用方法

    百度地图API的使用方法   百度地图API 开始学习百度地图API最简单的方式是看一个简单的示例.以下代码创建了一个520x340大小的地图区域并以天安门作为地图的中心: 1. <html&g ...

  9. 百度地图API的使用方法

    百度地图API 开始学习百度地图API最简单的方式是看一个简单的示例.以下代码创建了一个520x340大小的地图区域并以天安门作为地图的中心: 1. <html> 2. <head& ...

随机推荐

  1. java 中的final

    在编程语言中都有某种方式,告知编译器一块数据是恒定不变的.有两个需求 1. 一个永不改变的编译器常量 2. 一个在运行时被初始化的值,而这个值不会被改变 在Java中,使用final修饰变量实现这两个 ...

  2. 编写mipsel mt7620 Led驱动(一)

    1.看原理图中知芯片上66引脚控制一个LED 2.在Datasheet中找出GPIO pin 3.在ProgrammingGuid  System Contrl中找到GPIO控制寄存器地址: 4.控制 ...

  3. 解决php网页运行超时问题:Maximum execution time of 30 seconds exceeded

    Fatal error: Maximum execution time of 30 seconds exceeded in C:\Inetpub\wwwroot\ry.php on line 11 意 ...

  4. 【selenium+Python unittest】之发送带中文附件的邮箱

    完整原码如下: import smtplib from email.mime.text import MIMEText #from email.header import Header from em ...

  5. EF Core 日志跟踪sql语句

    EF Core 日志跟踪sql语句 官方文档链接:https://docs.microsoft.com/en-us/ef/core/miscellaneous/logging 1.新增自定义ILogg ...

  6. 2015年多校联合训练第一场OO’s Sequence(hdu5288)

    题意:给定一个长度为n的序列,规定f(l,r)是对于l,r范围内的某个数字a[i],都不能找到一个相应的j使得a[i]%a[j]=0.那么l,r内有多少个i,f(l,r)就是几. 问全部f(l,r)的 ...

  7. Selenium 我的自动化测试历程 (Selenium+TestNG+Java+ReportNG+Jenkins)

    测试环境:Java+Selenium+TestNG,Jenkins持续集成. 测试代码 代码结构 采用页面对象模型(Page Object),减少UI修改后,对代码的影响.   Java编写,采用Te ...

  8. Learning an Optimal Policy: Model-free Methods

    http://www.mit.edu/~9.54/fall14/slides/Reinforcement%20Learning%202-Model%20Free.pdf [基于所有.单个样本]

  9. apache 301重定向到带www的二级域名

    Options +FollowSymlinks RewriteEngine on rewritecond %{http_host} ^nlike.cn [nc] rewriterule ^(.*)$ ...

  10. Java for LeetCode 091 Decode Ways

    A message containing letters from A-Z is being encoded to numbers using the following mapping: 'A' - ...