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. Verilog代码规范(持续更新)

    1.输入输出的定义,看起来整齐 2.always.if或其他语句后begin写在同一行,这样可以避免begin占用过多的行,代码密度更大 3.end后面要有注释,以标明是哪个关键词的结束,除了endc ...

  2. string去空格

    众所周知,string字符串去除空格的方法有trim()和replace(),区别在于trim()去首尾的空格,但是不能去中间的,而replace可以去除所有的空格. string data1=&qu ...

  3. linux下压缩成zip文件解压zip文件

    linux  zip命令的基本用法是: zip [参数] [打包后的文件名] [打包的目录路径] linux  zip命令参数列表: -a     将文件转成ASCII模式 -F     尝试修复损坏 ...

  4. pycharm 5 注册码

    BIG3CLIK6F-eyJsaWNlbnNlSWQiOiJCSUczQ0xJSzZGIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiI ...

  5. IOS简单的渐变绘制

    本文转载至 http://www.cnblogs.com/flychen/archive/2012/09/18/2690264.html 前几个星期项目中的音乐列表左边要添加阴影,做成平滑的效果.如图 ...

  6. go module

    前言 go 1.5 引进了vendor管理工程依赖包,但是vendor的存放路径是在GOPATH底下,另外每个依赖还可以有自己的vendor,通常会弄得很乱,尽管dep管理工具可以将vendor平级化 ...

  7. python 基础 5.0 python类一般形式

    一. 类的一般形式 创建类我们一般使用class 关键字来创建一个类,class 后面跟类型名字,可以自定义,最后以冒号结尾,如下所示:   #/usr/bin/python #coding=utf- ...

  8. EasyNVR RTSP摄像机转HLS直播服务器中使用Onvif协议控制预置位

    EasyNVR支持预置位控制,包括转到指定预置位,设置指定预置位,删除指定预置位 预置位在安防领域有较为普遍的应用,可以进行很多既定位置的跳转,很方便 之前我们说过如何用Onvif协议进行设备的发现, ...

  9. word操作

  10. Linux就该这么学--Shell脚本条件语句(二)

    1.for条件语句 先读取多个不同的变量值,然后逐一执行同一组命令. 从列表文件中读取主机地址,逐个测试是否在线. 从ipadds.txt中读取主机地址后赋值给HLIST变量后逐个ping列表中的主机 ...