html5中高德、腾讯、百度 地图api调起手机app

最新推荐文章于 2023-03-11 00:14:45 发布
最新推荐文章于 2023-03-11 00:14:45 发布
阅读量834 收藏
点赞数
文章标签： js html5 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_34407972/article/details/103989022
版权

/高德/
var mapUrl_gd =“http://uri.amap.com/marker?position=108.958486,34.271454&name=”+inform.orgName+"&src=yellowpage&coordinate=gaode&callnative=1";
$("#mapBg .mapTab .mapBtn_g").attr(“href”,mapUrl_gd);

/腾讯/
var mapUrl_tx = “http://apis.map.qq.com/uri/v1/marker?marker=coord:34.271454,108.958486;title:”+inform.orgName+";addr:"+inform.orgAddress+"&referer=yellowpage"
$("#mapBg .mapTab .mapBtn_t").attr(“href”,mapUrl_tx);

/百度/
var mapUrl_bd =“http://api.map.baidu.com/marker?location=34.271454,108.958486&title=”+inform.orgName+"&content="+inform.orgAddress+"&output=html&src=yellowpage";
$("#mapBg .mapTab .mapBtn_b").attr(“href”,mapUrl_bd);

coe：
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
百度地图、高德地图、腾讯地图
07-20
对于刚入门的小白 使用地图api 参考此简单的的demo，更快上手
2018全国高德百度腾讯地图poi
11-08
有全国poi数据7.5千万条，覆盖360多个城市，30大类，400个小类，数据为2018年3月份数据，可以访问poi58进行下载数据与交流
HTML5唤起高德地图APP示例
TwoBE9876的博客
03-10 8742
HTML5唤起高德地图APP示例
百度、高德、腾讯地图 跳转app与定位
小绿的博客
03-02 670
百度、高德、腾讯地图 跳转app与定位 1. 如果接口返回的是适用于 百度地图 经纬度 在调用 高德地图 时需要进行转换 this.encrypt = bd_google_encrypt(lat, lon) tengxun() { if (this.OS === 'IOS' || this.OS === 'Android') { location.href = `qqmap://map/routeplan?to=${title}&tocoord=${this.e
Vue项目中跳转至百度\高德\腾讯地图第三方APP实现导航
m0_38051293的博客
09-22 9510
Vue项目中跳转至百度\高德\腾讯地图第三方APP实现导航项目需求项目实现代码实现 项目需求 项目是vue制作的webapp，通过cordova打包生成的。需要实现点击某一个位置调用第三方APP（高德地图、腾讯地图、百度地图）实现导航功能。 项目实现 查询了高德地图API、腾讯地图API、百度地图API。 了解了大致实现过程，主要是通过获取包名，传递参数，调用接口，实现相应功能。 项目使用cor...
web页面调起地图APP(高德地图、百度地图、腾讯地图)
梦翼横空的专栏
03-11 9677
web页面调起地图APP(高德地图、百度地图、腾讯地图) 在没有安装APP的情况下可以用web端地图
从百度地图api到我的地图app
lovelry的博客
04-04 2802
了解百度api，获取ak、秘钥SHA1，手动安装百度地图SDK，配置SDK和AK，补全代码安装运行我的地图app，以及这个过程中遇到的常见问题： invoke SDKInitializer.setAgreePrivacy(Context, boolean) function SDKInitializer.setAgreePrivacy(); not agree privacyMode, please invoke SDKInitializer.setAgreePrivacy(Context, boolean
Vue中JSH5移动端调起第三方地图软件(高德、腾讯、百度)
qq_53749423的博客
11-14 4396
Vue中JSH5移动端调起第三方地图软件(高德、腾讯、百度)
APP应用内跳转到其他的地图APP导航
Kevin_love_Chrissy的博客
03-26 997
-(void)clickDH:(UIButton *)btn{ NearbyGasModel *model=self.dataArray[btn.tag]; CLLocationDegrees longitude = [NSString stringWithFormat:@"%@",model.lon].floatValue; CLLocationDegrees la...
Html5内唤醒百度、高德APP的实现示例
12-14
前几天，联合黑卡反馈了一个需求，需要在H5中打开百度APP或者是高德APP，于是我在网上查了相关文档，下面放上链接： 1.高德地图 2.百度地图 具体思路就是点击选择地图的时候，先去请求APP链接，800毫秒后无响应，再跳转至H5链接。这样的做法有一点不好就是不管跳不跳APP，都会跳到H5的链接。有好的想法可以评论一下。 下面放相关代码：   function ToggleAppAndH5( AppUrl , AppCallback = () => {}){ // 先走APP const ifr = document.cr
Android 调用第三方导航（百度、高德、腾讯）以及坐标转换
04-20
View.OnClickListener onClickListener=new View.OnClickListener() { @Override public void onClick(View view) { switch (view.getId()) { case R.id.baidu_btn: if (MDMUtil.appIsInstalled( getContext(),"com.baidu.BaiduMap")) {//传入指定应用包名 try { double[] gd_lat_lon ; if(RoutingXModel.isGpslatlon){ gd_lat_lon= gaoDeToBaidu(xModel.poc_lon,xModel.poc_lat); }else{ gd_lat_lon= new double[2]; gd_lat_lon[0]=xModel.poc_lon; gd_lat_lon[1]=xModel.poc_lat; } Intent intent = Intent.getIntent("intent://map/direction?" + "destination=latlng:" + gd_lat_lon[1] + "," + gd_lat_lon[0]+ "|name:我的目的地" + //终点 "&mode=driving&" + //导航路线方式 "&src=appname#Intent;scheme=bdapp;package=com.baidu.BaiduMap;end"); intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK); getContext().startActivity(intent); //启动调用 } catch (URISyntaxException e) { Log.e("intent", e.getMessage()); } } else {//未安装 //market为路径，id为包名 //显示手机上所有的market商店 Toast.makeText(getContext(), "您尚未安装百度地图", Toast.LENGTH_LONG).show(); Uri uri = Uri.parse("market://details?id=com.baidu.BaiduMap"); Intent intent = new Intent(Intent.ACTION_VIEW, uri); if (intent.resolveActivity(getContext().getPackageManager()) != null){ getContext().startActivity(intent); } } dismiss(); break; case R.id.gaode_btn: if (MDMUtil.appIsInstalled( getContext(),"com.autonavi.minimap")) { Intent intent = new Intent(); intent.setAction(Intent.ACTION_VIEW); intent.addCategory(Intent.CATEGORY_DEFAULT); intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK); double[] gd_lat_lon ; if(!RoutingXModel.isGpslatlon){ gd_lat_lon= bdToGaoDe(xModel.poc_lat,xModel.poc_lon); }else{ gd_lat_lon= new double[2]; gd_lat_lon[0]=xModel.poc_lon; gd_lat_lon[1]=xModel.poc_lat; } //将功能Scheme以URI的方式传入data Uri uri = Uri.parse("androidamap://navi?sourceApplication=appname&poiname=fangheng⪫=" + gd_lat_lon[1] + "&lon;=" + gd_lat_lon[0] + "&dev=0&style=4"); intent.setData(uri); //启动该页面即可 getContext().startActivity(intent); } else { Toast.makeText(getContext(), "您尚未安装高德地图", Toast.LENGTH_LONG).show(); Uri uri = Uri.parse("market://details?id=com.autonavi.minimap"); Intent intent = new Intent(Intent.ACTION_VIEW, uri); if (intent.resolveActivity(getContext().getPackageManager()) != null){ getContext().startActivity(intent); } } dismiss(); break; case R.id.tencent_btn: Intent intent = new Intent(); intent.setAction(Intent.ACTION_VIEW); intent.addCategory(Intent.CATEGORY_DEFAULT); intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK); double[] gd_lat_lon ; if(!RoutingXModel.isGpslatlon){ gd_lat_lon= bdToGaoDe(xModel.poc_lat,xModel.poc_lon); }else{ gd_lat_lon= new double[2]; gd_lat_lon[0]=xModel.poc_lon; gd_lat_lon[1]=xModel.poc_lat; } //将功能Scheme以URI的方式传入data Uri uri = Uri.parse("qqmap://map/routeplan?type=drive&to;=我的目的地&tocoord;=" + gd_lat_lon[1]+ "," + gd_lat_lon[0]); intent.setData(uri); if (intent.resolveActivity(getContext().getPackageManager()) != null) { //启动该页面即可 getContext().startActivity(intent); } else { Toast.makeText(getContext(), "您尚未安装腾讯地图", Toast.LENGTH_LONG).show(); } dismiss(); break; case R.id.cancel_btn2: dismiss(); break; } } };
腾讯地图api-demo（高德）
08-10
小程序版高德地图完美运行demo，修改index.js内的key，完美运行
app内打开第三方地图进行导航iOS
01-04
在iOS平台上，集成第三方地图应用，如百度、高德、腾讯和苹果地图，为用户提供导航功能，是一项常见的需求。这不仅能够丰富应用的功能，还能利用这些专业地图服务的精准定位和实时交通信息，提高用户体验。以下将...
Android仿微信调用第三方地图应用导航（高德、百度、腾讯）
01-20
在给定的`map_navigation_sheet.xml`布局文件中，定义了一个包含四个按钮的线性布局，分别对应高德地图、百度地图、腾讯地图和取消操作。每个按钮都有唯一的ID，便于在Java代码中进行事件监听和处理。 接下来，我们...
竞品分析报告 高德地图 vs 百度地图 vs 腾讯地图.pdf
最新发布
07-22
本文主要探讨了中国手机地图市场的竞争格局，以高德地图、百度地图和腾讯地图为主要研究对象，进行了深入的竞品分析。行业背景部分指出，手机地图已经成为日常生活的必需品，特别是在出行需求增长的背景下，市场呈现...
html5 app开发重大消息-腾讯在技术端推进Html5生态发展
weixin_34050005的博客
05-12 95
日前，腾讯正式发布腾讯浏览服务(Tencent Browser Service，以下简称TBS)，宣布为合作伙伴提供整合腾讯底层技术、内容框架、广告体系以及大数据等多方面能力的升级浏览解决方案。腾讯公司副总裁钟翔平表示，TBS带来了浏览能力的升级，为Html5开发者提供更强的技术能力，将真正在技术端推进Html5生态的发展。 尽管目前...
用uni-app写一个地图
05-20
要在uni-app中实现地图功能，可以使用第三方地图SDK，例如百度地图SDK、高德地图SDK或者腾讯地图SDK。以下以百度地图SDK为例，介绍如何在uni-app中实现地图功能。 1. 在uni-app项目中安装百度地图SDK插件： ```bash npm install --save uni-baidumap-sdk ``` 2. 在需要使用地图的页面中引入地图组件： ```html <template> <view> <uni-baidu-map :ak="ak" :markers="markers" :scale="scale" :center="center" :show-location="true" @markertap="markertap" @updated="updated"></uni-baidu-map> </view> </template> <script> export default { data() { return { ak: '这里填写你的百度地图AK', markers: [{ id: 0, latitude: 23.099994, longitude: 113.32452, title: 'T.I.T 创意园', iconPath: '/static/images/location.png', width: 50, height: 50, callout: { content: '我是marker的callout', color: '#ffffff', fontSize: 14, borderRadius: 10, bgColor: '#000000', padding: 8, display: 'ALWAYS' } }], scale: 16, center: { latitude: 23.099994, longitude: 113.32452 } } }, methods: { markertap(e) { console.log(e) }, updated(e) { console.log(e) } } } </script> ``` 3. 在需要使用地图的页面中，引入uni-baidu-map组件并设置相应的属性。其中，ak属性为百度地图的API Key，markers属性为地图上的标记点，scale属性为地图缩放级别，center属性为地图中心点，show-location属性为是否显示定位按钮。在标记点的callout属性中，可以设置标记点的气泡弹窗内容和样式。 4. 在manifest.json文件中，需要添加百度地图的AK到app-plus配置项中： ```json { "app-plus": { "baidumap": { "AK": "这里填写你的百度地图AK" } } } ``` 以上就是在uni-app中使用百度地图SDK实现地图功能的基本步骤。需要注意的是，不同的地图SDK可能有不同的使用方法，具体可以参考相应的文档。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

coe：

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值