最全面的百度地图javascript离线版开发.doc

最全面的百度地图JAVASCRIPT离线版开发项目要求WEB版百度地图要离线开发。这里总结下自己的开发过程和经验。大概需求是每辆车上安装有公司接收机，会实时反馈车辆的坐标、速度、转向等信息，接收到各车辆信息后在百度地图上实时画出车辆位置。作业点不一定都有网络，所以要求离线开发。此过程主要有三个技术点1如何获取离线的API2如何获取离线瓦片图3如何在离线状态下将WGS坐标转换成百度地图坐标解决问题过程1既然百度地图官方不支持离线地图，那么我们需要想办法把在线的代码改成离线的代码。这里可以参考HTTP//MYOSCHINANET/SMZD/BLOG/548538这里整理好了一份，其中也按照示例DEMO写了一份离线的DEMO。当然离线的不可能做到和在线一样完美，毕竟还是有些功能用不了的。（此版本是基于百度地图APIV20）使用方法复制代码1确定你用的瓦片的图片后缀，如PNG,JPG。修改BAIDUMAP_OFFLINE_V2_LOADJS中的IMGEXTVARBDMAPCFG{IMGEXTJPG,//瓦片图的后缀根据需要修改，一般是PNGJPGTILES_DIR//瓦片图的目录，为空默认在BAIDUMAP_V2/TILES/目录}2确定你用的瓦片的目录，默认在BAIDUMAP_V2/TILES/目录下，你也可以改成其他地址。修改BAIDUMAP_OFFLINE_V2_LOADJS中的TILES_DIR3参考DEMO编写代码,要点如下1）只需要加载LOAD文件2）加载CSS文件（貌似可不需要）3）定义个放置地图的容器，并用CSS控制高度和宽度4）书写JS代码//百度地图API功能VARMAPNEWBMAPMAP“MAP_DEMO“//创建MAP实例MAPCENTERANDZOOMNEWBMAPPOINT116404,39915,8//初始化地图,设置中心点坐标和地图级别//MAPADDCONTROLNEWBMAPMAPTYPECONTROL//添加地图类型控件离线只支持电子地图，卫星/三维不支持//MAPSETCURRENTCITY“北京“//设置地图显示的城市离线地图不支持MAPWWWWANG027COMENABLESCROLLWHEELZOOMTRUE//开启鼠标滚轮缩放MAPADDCONTROLNEWBMAPNAVIGATIONCONTROL//缩放按钮复制代码2获取瓦片图这里可以参考HTTP//MYOSCHINANET/SMZD/BLOG/619397当然网上也有下载工具，比如全能电子地图下载器3直接将接收机接收到的坐标（WGS）放入百度地图中是有偏差的，这是因为百度地图为了安全做了特殊处理。其WEB服务API中提供了坐标转换API，但是它是以HTTP形式提供的坐标转换接口，所以说还是无法脱离网络。这里通过一些专业的知识将WGS坐标转GCJ，再将GCJ坐标转BD百度坐标，经验证精确度几乎算很准确的了。复制代码PUBLICCLASSCOORCONVERTUTIL{//圆周率STATICDOUBLEPI314159265358979324//卫星椭球坐标投影到平面坐标系的投影因子STATICDOUBLEA63782450//椭球的偏心率STATICDOUBLEEE000669342162296594323//圆周率转换量PUBLICFINALSTATICDOUBLEX_PI31415926535897932430000/1800PUBLICSTATICDOUBLEWGS2BDDOUBLELAT,DOUBLELON{DOUBLEWGS2GCJWGS2GCJLAT,LONDOUBLEGCJ2BDGCJ2BDWGS2GCJ0,WGS2GCJ1RETURNGCJ2BD}/GCJ坐标转百度坐标PARAMLATPARAMLONRETURN/PUBLICSTATICDOUBLEGCJ2BDDOUBLELAT,DOUBLELON{DOUBLEXLON,YLATDOUBLEZMATHSQRTXXYY000002MATHSINYX_PIDOUBLETHETAMATHATAN2Y,X0000003MATHCOSXX_PIDOUBLEBD_LONZMATHCOSTHETA00065DOUBLEBD_LATZMATHSINTHETA0006RETURNNEWDOUBLE{BD_LAT,BD_LON}}PUBLICSTATICDOUBLEBD2GCJDOUBLELAT,DOUBLELON{DOUBLEXLON00065,YLAT0006DOUBLEZMATHSQRTXXYY000002MATHSINYX_PIDOUBLETHETAMATHATAN2Y,X0000003MATHCOSXX_PIDOUBLEGG_LONZMATHCOSTHETADOUBLEGG_LATZMATHSINTHETARETURNNEWDOUBLE{GG_LAT,GG_LON}}/WGS坐标转GCJ坐标PARAMLATPARAMLONRETURN/PUBLICSTATICDOUBLEWGS2GCJDOUBLELAT,DOUBLELON{DOUBLEDLATTRANSLATLON1050,LAT350DOUBLEDLONTRANSLONLON1050,LAT350DOUBLERADLATLAT/1800PIDOUBLEMAGICMATHSINRADLATMAGIC1EEMAGICMAGICDOUBLESQRTMAGICMATHSQRTMAGICDLATDLAT1800/A1EE/MAGICSQRTMAGICPIDLONDLON1800/A/SQRTMAGICMATHCOSRADLATPIDOUBLEMGLATLATDLATDOUBLEMGLONLONDLONDOUBLELOC{MGLAT,MGLON}RETURNLOC}PRIVATESTATICDOUBLETRANSLATDOUBLELAT,DOUBLELON{DOUBLERET100020LAT30LON02LONLON01LATLON02MATHSQRTMATHABSLATRET200MATHSIN60LATPI200MATHSIN20LATPI20/30RET200MATHSINLONPI400MATHSINLON/30PI20/30RET1600MATHSINLON/120PI320MATHSINLONPI/30020/30RETURNRET}PRIVATESTATICDOUBLETRANSLONDOUBLELAT,DOUBLELON{DOUBLERET3000LAT20LON01LATLAT01LATLON01MATHSQRTMATHABSLATRET200MATHSIN60LATPI200MATHSIN20LATPI20/30RET200MATHSINLATPI400MATHSINLAT/30PI20/30RET1500MATHSINLAT/120PI3000MATHSINLAT/300PI20/30RETURNRET}/度分转度PARAMLAT纬度DDMMMMMMPARAMLON经度DDDMMMMMMRETURN/PUBLICSTATIC