移动端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
http://api.map.baidu.com/direction //PC&Webapp服务地址
http://api.map.baidu.com/direction?origin=latlng:34.264642646862,108.95108518068|name:我家&destination=大雁塔&mode=driving®ion=西安&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®ion=杭州&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®ion=杭州&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> 效果:
移动端app跳转百度地图的更多相关文章
- 百度地图api公交路线,IE下跳转百度地图后中文变成乱码的解决办法
百度开放的公交路线的链接,IE跳转会出现中文变成乱码的问题.如图: //创建InfoWindow function createInfoWindow() { var desDiv = []; desD ...
- 利用HBuilder开发基于MUI的H5+ app中使用百度地图定位功能
定位功能有两种方法: 首先要初始化内置地图: var map = new plus.maps.Map("map"); 这里黄色的map是html里面的id: <div id= ...
- H5跳转到百度地图并定位
找了半天的JS api,发现没有,后来发现这个叫 url api,让我好找. 官方文档: http://lbsyun.baidu.com/index.php?title=uri/api/web : 简 ...
- 【百度地图API】如何利用PhoneGap制作地图APP
原文:[百度地图API]如何利用PhoneGap制作地图APP 摘要:百度地图API是一套由javascript编写的地图程序接口,按说它应该运行在浏览器上.现在,只要利用PhoneGap,我们就能开 ...
- 百度地图WEB端判断用户是否在网格范围内
在pc端设置商家的配送范围,用户在下单时,根据用户设置的配送地点判断是否在可配送范围内,并给用户相应的提示. 下面说下我的实现思路: 1.用百度地图在PC端设置配送范围,可拖拽选择 2.根据用户设置的 ...
- 地图调起URI API(通过连接直接调用百度地图)
网站:http://lbsyun.baidu.com/index.php?title=uri/api/web 地图调起URI API 百度地图URI API是为开发者提供直接调起百度地图产品(百度We ...
- 【Android】3.0 第3章 百度地图及其应用--预备知识
分类:C#.Android.VS2015.百度地图应用: 创建日期:2016-02-04 一.概述 这一章先来点有意思的百度地图应用示例,然后再分章详细介绍用C#开发Android App的各种基本技 ...
- 百度地图SDK
百度地图官方SDK文档 http://lbsyun.baidu.com/index.php?title=androidsdk 一.申请百度地图SDK 每一个app对应一个百度地图AK,百度地图 ...
- 百度地图结合echarts并添加行政区块
作者:LJaer链接:https://www.zhihu.com/question/49251513/answer/125728764来源:知乎<!DOCTYPE html> <ht ...
随机推荐
- 在eclipse中查看sources源码和JavaDoc帮助文档
今天学习Netty的过程中,从官网下载的netty里面的内容如下: 其中jar文件夹里面的内容如下: 可以看到每一个具体的jar包就对应有一个sources.jar包,然后所有的帮助文档在javaDo ...
- libaio.so.1: undefined reference to `__stack_chk_fail@GLIBC_2.4'
没有别的原因: 找正确的 libaio.so.1 包就成. 我这儿有,需要的可以下载奥!
- 常用Linq示例代码
class Program { static void Main(string[] args) { //1. Aggregate int[] testArr = new int[] { 1, 2, ...
- [转] 关于QT的系统总结
出处:http://www.cnblogs.com/wangqiguo/p/4625611.html 阅读目录 编译环境与开发流程 QT项目的构成及原理 QT中的布局 QT中的通用控件 QVarian ...
- springboot+elasticsearch配置实现
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...
- [原]C# 常用函数统计
1.获取MD5 string MD5Compute(string strPwd) { MD5CryptoServiceProvider m5 = new MD5CryptoServiceProvide ...
- 泛泰A870K去掉相机快门声音的方法
首先ROOT手机,挂载读写,/system/media/audio/ui里面哈,把camera-click.ogg改成camera-click.ogg.bak就可以了 转载自:http://bbs.9 ...
- MySQL实现树状所有子节点查询的方法
本文实例讲述了MySQL实现树状所有子节点查询的方法.分享给大家供大家参考,具体如下: 在Oracle 中我们知道有一个 Hierarchical Queries 通过CONNECT BY 我们可以方 ...
- 【转】使程序在Linux下后台运行 (关掉终端继续让程序运行的方法)
一.为什么要使程序在后台执行 我们计算的程序都是周期很长的,通常要几个小时甚至一个星期.我们用的环境是用putty远程连接到日本Linux服务器.所以使程序在后台跑有以下三个好处: 1:我们这边是否关 ...
- Android应用程序的结构
1.src目录 存放该项目的源代码 2.gen目录 该目录文件是ADT自动生成的,并不需要认为地去修改 3.Android2.1 该目录存放的是该项目支持的JAR包,同时还包含项目打包时需要的META ...