zoukankan      html  css  js  c++  java
  • 百度地图api

    1 官网地址:

    http://lbsyun.baidu.com/index.php?title=%E9%A6%96%E9%A1%B5

    然后找到如图所示的js api

     

    http://lbsyun.baidu.com/index.php?title=jspopular

    2 使用方法 

    具体可以在这里查看:

     

    hello World中的代码复制一下,就可以知道用法了:

    代码如下:

    <!DOCTYPE html>  
    <html>
    <head>  
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>Hello, World</title>  
    <style type="text/css">  
    html{height:100%}  
    body{height:100%;margin:0px;padding:0px}  
    #container{ 800px;height: 500px;margin: 0 auto;}  
    </style>  
    <script src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥">
    </head> 
     
    <body>
    	
    <div id="container"></div> 
    
    <script> 
    var map = new BMap.Map("container");  //创建地图实例  
    var point = new BMap.Point(116.404, 39.915);  //创建点坐标  
    map.centerAndZoom(point, 15);  //初始化地图,设置中心点坐标和地图级别  
    </script> 
    
    </body>  
    </html>
    

    tips:还可以使用低版本,不用注册密钥了,但是功能没有高版本的多:

    <script src="http://api.map.baidu.com/api?v=1.2"></script>

    3 具体步骤

    1)引入api的地址

    2)加一个容器并设一个id

    3)创建地图实例  

      创建点坐标  

      初始化地图,设置中心点坐标和地图级别 

      (地图级别就是放大还是缩小的比例)

    4 其他 

    1)添加控件:

    map.addControl(new BMap.NavigationControl());

    2)标注:

    var marker = new BMap.Marker(point);        // 创建标注    

    map.addOverlay(marker);                     // 将标注添加到地图中 

    3)标注加图标,可以自定义

    4)可以加多个标注,每个标注都是一个对象,可以把这些标注放一个数组里,然后分别操作

    5)可拖拽的标注

    6)经纬度的表示:lnglat  

      查询某一个地点的经纬度:

      

      http://api.map.baidu.com/lbsapi/getpoint/index.html 

    7)添加折线 

    8)开启鼠标滚轮缩放:map.enableScrollWheelZoom(true);

    在示例demo里有大量实例,可以直接使用

  • 相关阅读:
    ASP.NET学习笔记(1)
    vs2005新建项目中没有ASP.NET WEB应用程序
    IE无法安装Activex控件
    【Android】SDK工具学习
    【英语】Bingo口语笔记(22)
    【Python】实践笔记
    【学习】纪录片笔记
    【英语】Bingo口语笔记(20)
    【英文】20141027 生词
    【英文】Bingo口语笔记(18)
  • 原文地址:https://www.cnblogs.com/hzhjxx/p/9783233.html
Copyright © 2011-2022 走看看