一个经验:(当项目中的方法, 很多的时候, 相互调用的时候)

可以在script中, 先定义, 注意是定义, 一个"入口"函数, function initMap(), 然后, 让这个入口函数, 去调用其他业务逻辑处理函数(如: createMap, setMapEvent, setMapControl, addMarker等). 最后, 在项目中, 实际去调用, 执行这个入口函数 一次, 项目就跑起来了.

百度地图使用的对象是 BMap, 使用的方法是(类似c++编程一样的Map, 等方法. 但是有些方法则是以小写字母开头的.

主要的是: 类BMap的方法是以大写字母开头的, 如: var map = new BMap('div-name'); map.centerAndZoom(new BMap.Point(x0, y0), 11); 顾名思义, center是设置地图的中心点, 而zoom正好是设置地图的缩放级别

最重要的是, 这里的 window.map=map, 作为全局变量使用的 思想~~


百度地图的使用其实会了, 懂了她的方法, 还是很简单的, 具体的方法参考: http://developer.baidu.com/map/jsdemo.htm#a1_2

这个有非常完整的实例.

  1. 思想方法: 首先是在一个div作为容器, 然后在这个div中实例化一个BMap的实例即可.
  2. 其实地图只是div中的一个内容. 一个普通的div元素. 他的后面/左右等任何地方都可以跟其他html元素.如下图所示:

  3. 给地图设置centerAndZoom的时候, 中心点, 就是你这个地图的中心位置, 比如你要设置"地图的中心/地图 的主要部分是重庆", 那么你就设置重庆的坐标点. zoom是设置地图的缩放程度.
  4. map.addControl(new BMap.MapTypeControl()) 是给地图添加控件. **重要的思想是, 在地图中你只是需要添加控件就好了, 只要添加了控件, 这些控件就自动拥有了控件的功能了, 至于控件的实际实现代码, 地图.js已经给你实现了. **同样的道理, 添加其他事件之后, 就自动有这些事件功能了. 你不需要去自己实现这些事件的处理/实现代码了, 你只需要调用这些api的接口就行了. 比如 使用map.enableScrollWheelZoom()
  5. 地图默认的就是可以拖放的, 你可以显式的启用或禁用 鼠标拖放功能: map.disableDragging(); 或者: map.enableDragging();
  6. 地图的事件还有 双击拖放: map.enableDoubleClickDragging(); 以及: map.enableKeyboard(); 等等.
  7. 注意使用上面的在线百度地图的js, 可能需要你输入js的密钥, 否则没有办法使用.

开发的时候, 在 developer.baidu.com, developer.baidu.com/map/ 中, 可视化的创建你的'城市, 中心点,要添加的控件/按钮, 事件, 标注(地图覆盖物overlay)', 所有的东西, 都可以为你生成! 然后会自动为你生成代码...

description中 的内容, 会被搜索引擎 显示到 条目的说明 文字中?

元素本身的居中和元素内的内容 居中, 是不一样的! 本身的居中是:margin: 0 auto; 里面的内容要居中, 是用 text-align: center


再次说明一下: 要实现鼠标悬浮的效果(悬浮变色, 悬浮改变图片), 不用复杂的js(hover事件, mouseenter, mouseout等事件), 直接使用a:hover! 设置a的宽度和高度, 同时display:block,或inline-block, float: right; 然后设置 a的背景图片就好了, 就是a里面不用文字内容, 而是用图片背景来"填充"它 .

边框如果有重合的地方,导致边框看起来更粗, 可以使用border的某一边就好了, 如只使用 border-bottom等.

lbs: 蓝宝石, lbs: location based services: 位置服务, 基于位置的服务!

网址: lbsyun.baidu.com, 这个是百度的专门的位置/地图服务/ bbs: http://bbs.lbsyun.baidu.com/

在百度地图的api js版本在v=1.4及以前的不需要ak: (api key?), 从1.5之后, 现在这个时间点, 最新的版本是v=2.0. http://api.map.baidu.com/map?v=2.0&ak=...

地图是用js写的, 所以引用的时候使用script标签, 在src中使用ak:

地图API是由JavaScript语言编写的,您在使用之前需要通过<script>标签将API引用到页面中:

使用V1.4及以前版本的引用方式:

<script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>

使用V2.0版本的引用方式:

<script src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥" type="text/javascript"></script>

申请ak后, 进入邮箱后, 就可以激活 "百度开发平台 开发者"

不可以。任何使用百度地图API调用地图服务应用必须保留百度版权信息

百度地图使用须知

在创建地图的容器div时, 必须设定div的 宽度和高度, 否则div是塌陷的, 地图显示不出来. 在设置a, span等行级元素的时候, 设置他们的高度, 宽度等,会无效, 此时应将它们设置为display: block或inline-block

百度开发平台开发者 密钥ak, 可以是webapp类型的应用程序, 也可以是 webserver类型的应用程序, 只要有javascript api访问权限都是可以的!

不需要管应用编号(那个是系统自动生成的), 也不要管应用程序的名称, 只要有jsapi权限都可以, 所以这里使用下面的两个中的任意一个都是可以的. 通常使用webapp浏览器端的那个ak. (因为服务器或浏览器端都可以使用js). 在script标签的src的传参中使用: ?v=2.0&ak=..."



最简单的js其实只要下面几行就可以了.其他更多的功能, 只需要再添加代码就好了. 具体的功能, 只需要再看看api文档就好了.

<script>
var map = new BMap.Map('map');
var point = new BMap.Point(x0, y0);
map.centerAndZoom(point, 10);
</script>

可以 "可视化 的定制 "的 生成地图, 然后拷贝自动生成的代码 到你的html文件即可. 使用 "百度地图的/ 开发 /地图工具/ 地图生成器" 即可

实际上除了 可以选择/切换城市外, 还可以 "搜索你 关注的某个具体的 地点 ", 这样 可以自动 生成 经度(longitude), 纬度(latitude)的坐标点.



百度地图bd map使用方法的更多相关文章

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

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

  2. php+js实现百度地图多点标注的方法

    本文实例讲述了php+js实现百度地图多点标注的方法.分享给大家供大家参考,具体如下: 1.php创建json数据 ? 1 2 $products = $this->product_db-> ...

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

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

  4. android中百度地图定位的实现方法(仅适用于真机+WIFI联网环境)

    注意:此代码的环境是:真机(系统版本为Android4.2.2)+WIFI联网(才能实现最后的运行结果):使用虚拟机调试会出现各种问题. 第一步:下载SDK和申请Key 到百度的网站http://de ...

  5. iOS 学习笔记五 【2016年百度地图定位详细使用方法】

    具体介和配置绍在此就不详述了,详情请看百度地图API文档, 在这里具体讲解下,新版百度地图的定位与反地理编码的使用: 1.导入头文件 #import <BaiduMapAPI_Map/BMKMa ...

  6. 百度地图Key的设置方法

    一.为什么要设置百度Key 万能地图下载器提供了百度POI的下载功能,但由于本软件用户群极大,会导致一天之内访问量超出300万次以上而无法继续下载. 因此,当POI下载不成功能,用户可以自己申请百度地 ...

  7. vue框架导入百度地图API接口的方法

    百度请求API接口:

  8. 『实践』百度地图给map添加右键菜单(判断是否为marker)

      var map; var s;//经度 var w;//纬度 $(document).ready(function(){ $(".mune").load("jsp/c ...

  9. 百度地图api2.0体验

    前言:这两天在做百度地图的功能,查看了百度官网的api完成了基本功能 api地址http://developer.baidu.com/map/jshome.htm 注意是javascript API ...

随机推荐

  1. MongoDB下,启动服务

    D:\MongoDB>mongod --dbpath D:\MongoDB\Data --logpath D:\MongoDB\Log\MongoDB.log --logappend --ser ...

  2. django 定义文章url

    url(r'^firstcontent/'+str(date)+'/(?P<first_body_id>\d+)/$', views.firstcontent, name='firstco ...

  3. keras可视化pydot graphviz问题

    Keras中提供了一个神经网络可视化的函数plot,并可以将可视化结果保存在本地.plot使用方法如下: from keras.utils.visualize_util import plot plo ...

  4. 多线程:Operation(一)

    1. 进程和线程 1.1 进程 进程:正在运行的应用程序叫进程 进程之间都是独立的,运行在专用且受保护的内存空间中 两个进程之间无法通讯 通俗的理解,手机上同时开启了两个App.这两个App肯定是在不 ...

  5. numpy元素级数组函数

    一元函数 abs, fabs 计算整数.浮点数或复数的绝对值.对于非复数值,可以使用更快的fabs. sqrt 计算各元素的平方根.相当于arr ** 0.5 sqare 计算各元素的平方.相当于ar ...

  6. js里用append()和appendChild有什么区别?

    parentNode.append()是还在试用期的方法,有兼容问题.是在parendNode节点中最后一个子节点后插入新Node或者DOMString(字符串,插入后为Text节点). 与paren ...

  7. WebSocket和long poll、ajax轮询的区别,ws协议测试

    WebSocket和long poll.ajax轮询的区别,ws协议测试 WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连 ...

  8. jenkins3

    Jenkins是基于java开发的. GitHub Git (熟练使用) Doocker (了解) Jenkins (熟练使用) Django (熟练使用) Angularjs (了解) Sentry ...

  9. 高性能NIO框架Netty入门篇

    http://cxytiandi.com/blog/detail/17345 Netty介绍 Netty是由JBOSS提供的一个java开源框架.Netty提供异步的.事件驱动的网络应用程序框架和工具 ...

  10. springboot打包部署到tomcat

    一. springboot打成war包: 1. 首先查看是否为war 2. File----->ProjectStruture,选择Artifacts,中部点击“+”号 3. 按图中标记进行选择 ...