zoukankan      html  css  js  c++  java
  • 百度地图 Javascript API 笔记

    因为最近的一个项目用到,所以自己整理了一下遇到的一些坑

    自己写了一个类库来二次封装用于调起常用的功能:https://github.com/iRuxu/iBMap

    快速文档链接

     

    1.1 Javascript API

    首先自己调起百度地图的话,需在页面引入对应API文件,如使用2.0:

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

    {坑一} 在一些浏览器上不能异步加载,会被阻止,所以还是需要将api文件直接在页面中引入。

    {坑二}官方demo中有些示例似乎失效的,例如地址解析方法已经不可用,会报错,需通过Web API来异步调取结果。

    内部的Point等构造方法,都是先lng经度后lat纬度

    {坑三}接口方法的调用需要在页面文档就绪以后,且对其装载元素指定尺寸,否则会出现地图渲染错误。

     

    1.2 Web API

    基于此返回一些给javascript API及sdk使用的数据。

    {坑四}如进行正地理编码,值得注意的是,在使用jquery发起ajax请求时,必须指定data-type为jsonp,否则不能正常返回

    由于是跨域/jsonp并不能做同步处理,必须在回调中进行下一步操作。

     

    1.3 URI API 

    URI接口可以直接快速调起地图,返回一个html页面,所以可以直接嵌入在iframe中。

    如果不需要自选的多个标点和一些进阶功能时,这是一个最快的方法,并且不需要ak。

    值得注意的是,URI的地理传值则是先lat纬度后lng经度

    {坑五}此外,如果你的地图调起是通过弹窗打开,即如果地图装载的容器默认并未渲染(比如设置了display:none),则地图无法正常加载。

    替代的方案:

    a.设置fixed定位,并且设置一个较大的偏移值,例如margin:5000px,当触发时再修正位置

    b.设置transform:scale3d(0,0,0),默认将其放缩至0,触发候再将其恢复正常transform:sacle(1,1,1),还可以有一个放缩动画效果。(但是仅使用此条,刚打开页面时,会有一个缩小动画,所以仍旧需要先将其偏移至可视区外,可结合第一条)

    c.根据具体测试,overflow:hidden也能正常渲染地图,但是此时通常你不得不将尺寸设为0,此时加载地图时,标记的位置可能会错误。

     

    暂时就这么多。

  • 相关阅读:
    重拾安卓_01_安卓开发环境搭建(eclipse)
    重拾安卓_01_安卓开发环境搭建(android studio)
    【BZOJ】1038: [ZJOI2008]瞭望塔
    【BZOJ】2178: 圆的面积并
    【UR #4】元旦三侠的游戏(博弈论+记忆化)
    【BZOJ】1027: [JSOI2007]合金(凸包+floyd)
    【POJ】1151 Atlantis(线段树)
    【POJ】1228 Grandpa's Estate(凸包)
    【POJ】1556 The Doors(计算几何基础+spfa)
    【POJ】1113 Wall(凸包)
  • 原文地址:https://www.cnblogs.com/iruxu/p/baidumap-javascript.html
Copyright © 2011-2022 走看看