移动端app跳转百度地图


http://lbsyun.baidu.com/index.php?title=uri/guide/helloworld
（百度地图调起URI API）
开发者只需按照接口规范构造一条标准的URI，便可在PC和移动端浏览器或移动开发应用中调起百度地图产品，进行地图展示和检索、线路查询、导航等功能，无需进行复杂的地图功能开发。

http://lbsyun.baidu.com/index.php?title=uri/api/web

2.2.3公交、驾车、步行路线规划

服务地址

http://api.map.baidu.com/direction   //PC&Webapp服务地址

示例

http://api.map.baidu.com/direction?origin=latlng:34.264642646862,108.95108518068|name:我家&destination=大雁塔&mode=driving&region=西安&output=html&src=webapp.baidu.openAPIdemo
//调起百度PC或Web地图，展示"西安市"从（lat:34.264642646862,lng:108.95108518068 ）"我家"到"大雁塔"的驾车路线。

在iOS浏览器打开以上链接会调起百度web地图,详情页面见下图。

参数说明

参数名称	参数说明	是否必选	备注
origin	起点名称或经纬度，或者可同时提供名称和经纬度，此时经纬度优先级高，将作为导航依据，名称只负责展示。	必选	1、名称：天安门 2、经纬度：39.98871<纬度>,116.43234<经度>。 3、名称和经纬度：name:天安门\|latlng:39.98871,116.43234
destination	终点名称或经纬度，或者可同时提供名称和经纬度，此时经纬度优先级高，将作为导航依据，名称只负责展示。	必选	同上
mode	导航模式，固定为transit、driving、walking，分别表示公交、驾车和步行	必选
region	城市名或县名	当给定region时，认为起点和终点都在同一城市，除非单独给定起点或终点的城市。
origin_region	起点所在城市或县	同上
destination_region	终点所在城市或县	同上
output	表示输出类型，web上必须指定为html才能展现地图产品结果。	必选	手机客户端忽略此参数
coord_type	坐标类型，可选参数	可选	默认为bd09经纬度坐标。允许的值为bd09ll、bd09mc、gcj02、wgs84。bd09ll表示百度经纬度坐标，bd09mc表示百度墨卡托坐标，gcj02表示经过国测局加密的坐标，wgs84表示gps获取的坐标
zoom	展现地图的级别，默认为视觉最优级别。	可选
src	调用来源，规则：webapp.companyName.appName。	必选	此参数不传值，不保证服务。


、、、、、、、、、、、、、、、、、、、、、、、、、、、

移动端app跳转百度地图:
1、

window.location.href="

http://api.map.baidu.com/geocoder?
location=30.22,120.15&coord_type=bd09ll&output=html&src=w
ebapp.baidu.openAPIdemo”

2、

window.location.href="http://api.map.baidu.com/direction?origin=当前位置&destination=西湖&mode=driving&region=杭州&output=html&src=yourCompanyName|yourAppName";

3、

window.location.href = "http://api.map.baidu.com/direction?origin=latlng:" + v.latitude + "," + v.longitude + "|name:当前位置&destination=latlng:" + gp[1] + "," + gp[0]+ "|name:目的地&mode=driving&region=杭州&output=html&src=yourCompanyName|yourAppName";


5、源码展示：

<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>JSAPI与URLAPI结合示例</title>  
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=2b866a6daac9014292432d81fe9b47e3"></script>  
<script src="http://d1.lashouimg.com/static/js/release/jquery-1.4.2.min.js" type="text/javascript"></script>  
<style type="text/css">  
html,body{  
    width:400px;  
    height:300px;
    margin:0;
    overflow:hidden;  
    }
</style>  
</head>  
<body></body>  
</html>  
<script type="text/javascript">  
    var map = new BMap.Map("container");  
    map.centerAndZoom(new BMap.Point(116.403884,39.914887), 13);  
    map.enableScrollWheelZoom();  
    var marker=new BMap.Marker(new BMap.Point(116.403884,39.914887));  
    map.addOverlay(marker);  
    var licontent="<b>天安门</b><br>";  
        licontent+="<span><strong>地址：</strong>北京市东城区天安门广场北侧</span><br>";  
        licontent+="<span><strong>电话：</strong>(010)63095718,(010)63095630</span><br>";  
        licontent+="<span class="\"input\"><strong></strong><input" class="\"outset\"" type=\"text\" name=\"origin\" value=\"北京站\"/><input class="\"outset-but\"" type=\"button\" value=\"公交\" onclick=\"gotobaidu(1)\" /><input class="\"outset-but\"" type=\"button\" value=\"驾车\"  onclick=\"gotobaidu(2)\"/><a class="\"gotob\"" href=\"url=\"http://api.map.baidu.com/direction?destination=latlng:"+marker.getPosition().lat+","+marker.getPosition().lng+"|name:天安门"+"®ion=北京"+"&output=html\" target=\"_blank\"></a></span>";
  
    var hiddeninput="<input type=\"hidden\" value=\""+'北京'+"\" name=\"region\" /><input type=\"hidden\" value=\"html\" name=\"output\" /><input type=\"hidden\" value=\"driving\" name=\"mode\" /><input type=\"hidden\" value=\"latlng:"+marker.getPosition().lat+","+marker.getPosition().lng+"|name:天安门"+"\" name=\"destination\" />";
  
    var content1 ="<form id=\"gotobaiduform\" action=\"http://api.map.baidu.com/direction\" target=\"_blank\" method=\"get\">" + licontent +hiddeninput+"</form>";
   
    var opts1 = { width: 300 };  
        
    var  infoWindow = new BMap.InfoWindow(content1, opts1);  
    marker.openInfoWindow(infoWindow);  
    marker.addEventListener('click',function(){
        marker.openInfoWindow(infoWindow);
    });  
      
    function gotobaidu(type)  
    {  
        if($.trim($("input[name=origin]").val())=="")  
        {  
            alert("请输入起点！");  
            return;  
        }else{  
            if(type==1)  
            {  
                $("input[name=mode]").val("transit");  
                $("#gotobaiduform")[0].submit();  
            }else if(type==2)  
            {      
                $("input[name=mode]").val("driving");          
                $("#gotobaiduform")[0].submit();  
            }  
        }  
    }     
</script>

效果：

posted on 2018-10-19 11:18 小甜瓜安东泥阅读(2288) 评论(0) 编辑收藏举报

刷新页面返回顶部

小甜瓜安东泥

移动端app跳转百度地图

导航

公告