PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > HBuilderX教程 > 正文

    uniapp (IOS端安卓端)调用高德、百度、腾讯地图导航

    作者:admin来源:网络浏览:时间:2020-11-15 15:09:00我要评论
    导读:uniapp (IOS端安卓端)调用高德、百度、腾讯地图导航
    uniapp (IOS端安卓端)调用高德、百度、腾讯地图导航

    1. // 点击某个地方,调起下面的方法 
    2.    // 方法要传入需要标注地点的纬度latitude,经度longitude,名字name 
    3.    toMapAPP(latitude,longitude,name){ 
    4.           let url = ""
    5.           if (plus.os.name == "Android") {//判断是安卓端 
    6.         plus.nativeUI.actionSheet({//选择菜单 
    7.             title: "选择地图应用"
    8.             cancel: "取消"
    9.             buttons: [{title: "腾讯地图"},{title: "百度地图"}, {title: "高德地图"}] 
    10.         }, function(e) { 
    11.             switch (e.index) { 
    12.           //下面是拼接url,不同系统以及不同地图都有不同的拼接字段 
    13.                 case 1: 
    14.               //注意referer=xxx的xxx替换成你在腾讯地图开发平台申请的key 
    15.                     url = `qqmap://map/geocoder?coord=${latitude},${longitude}&referer=xxx`; 
    16.                     break
    17.                 case 2: 
    18.                     url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&coord_type=gcj02&src=andr.baidu.openAPIdemo`; 
    19.                     break
    20.           case 3: 
    21.               url = `androidamap://viewMap?sourceApplication=appname&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`; 
    22.            break
    23.                 default
    24.                     break
    25.             } 
    26.             if (url != "") { 
    27.                 url = encodeURI(url); 
    28.           //plus.runtime.openURL(url,function(e){})调起手机APP应用 
    29.                 plus.runtime.openURL(url, function(e) { 
    30.                     plus.nativeUI.alert("本机未安装指定的地图应用"); 
    31.                 }); 
    32.             } 
    33.         }) 
    34.           } else { 
    35.               // iOS上获取本机是否安装了百度高德地图,需要在manifest里配置 
    36.         // 在manifest.json文件app-plus->distribute->apple->urlschemewhitelist节点下添加 
    37.         //(如urlschemewhitelist:["iosamap","baidumap"])  
    38.               plus.nativeUI.actionSheet({ 
    39.                   title: "选择地图应用"
    40.                   cancel: "取消"
    41.                   buttons: [{title: "腾讯地图"},{title: "百度地图"}, {title: "高德地图"}] 
    42.               }, function(e) { 
    43.                   switch (e.index) { 
    44.                       case 1: 
    45.                           url = `qqmap://map/geocoder?coord=${latitude},${longitude}&referer=xxx`; 
    46.                           break
    47.                       case 2: 
    48.                           url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=ios.baidu.openAPIdemo&coord_type=gcj02`; 
    49.                           break
    50.           case 3: 
    51.               url = `iosamap://viewMap?sourceApplication=applicationName&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`; 
    52.            break
    53.                       default
    54.                           break
    55.                   } 
    56.                   if (url != "") { 
    57.                       url = encodeURI(url); 
    58.                       plus.runtime.openURL(url, function(e) { 
    59.                           plus.nativeUI.alert("本机未安装指定的地图应用"); 
    60.                       }); 
    61.                   } 
    62.               }) 
    63.           } 
    64.       } 
    65. 当然,这只是拉起APP的操作,如果您想拉起APP并进入相关的模式,比如线路规划,骑行导航等,只需要将相关参数传入,并更改相关的URL值即可。在此提供一下高德地图的相关教程:https://lbs.amap.com/api/amap-mobile/guide/ios/route 

     

    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-146-6427-1.html