怎样实现App和h5跳转百度、高德和腾讯地图定位导航?

开发app时候,地图跳转是很常见的一个功能,告诉你经纬度就可以实现唤醒百度、高德、腾讯地图进行地图导航,在加上关键字就可以实现周边功能的实现,前台需要动态判断手机上安装了哪些地图软件,若有则显示出来,没有则不显示,若用户手机上没有安装任何导航软件app,则需要引导用户去下载一款地图app软件。

由于我这是h5开发环境,所以界面由h5处理,只提供后台的两个接口,一个接口是判断用户手机上安装了哪些导航软件,一个接口是进行地图导航和周边功能的实现。然后js调android即可实现。

一、api地址

先放上百度、高德、腾讯地图调起API文档地址,有些参数不懂可以参考。

1、百度地图 http://lbsyun.baidu.com/index.php?title=uri/api/android

2、高德地图 http://lbs.amap.com/api/amap-mobile/guide/android/route

3、腾讯地图 http://lbs.qq.com/uri_v1/index.html

二、android后台接口提供给前台h5调用如下:

    /**
     * 选择地图
     * @param lat 纬度
     * @param lon 经度
     * @param poiname 地址
     * @param type 1表示高德  2表示百度  3表示腾讯
     * @param selectType 1表示导航类型, 2表示周边类型
     * @param keyWords 关键字
     * @param poiname
     */
    @JavascriptInterface
    public void makeUpMap (String lat,String lon,String poiname,int type,int selectType,String keyWords) {
        Intent intent = new Intent();
        if (mapBean.getGaoDei() == null && mapBean.getTenXun() == null && mapBean.getBaiDu() == null) {
            goToMarket(mContext, "com.autonavi.minimap");
            mContext.startActivity(intent);
        }
        //高德地图
        if (mapBean.getGaoDei() == "1" && type == 1) {
            if (selectType == 1) {
                intent.setData(Uri.parse("androidamap://viewMap?sourceApplication=appname&poiname=" + poiname + "&lat=" + lat +"&lon="+ lon +"&dev=0"));
            } else if (selectType == 2) {
                intent.setData(Uri.parse("androidamap://arroundpoi?sourceApplication=softname&keywords="+ keyWords +"&lat=" + lat + "&lon="+ lon + "&dev=0"));
            }
        }
        //百度地图
        if (mapBean.getBaiDu() == "2" && type == 2) {
            if (selectType == 1) {
                intent.setData(Uri.parse("baidumap://map/marker?location=" + lat + ","+  lon + "&title=" + poiname + "&content="+ "" +"&traffic=on"));
            } else if (selectType == 2) {
                intent.setData(Uri.parse("baidumap://map/place/nearby?query="+ keyWords +"¢er=" + lat + "," + lon + ""));
            }
        }
        //腾讯地图
        if (mapBean.getTenXun() == "3" && type == 3) {
            if (selectType == 1) {
                intent.setData(Uri.parse("http://apis.map.qq.com/uri/v1/marker?marker=coord:"+ lat + "," + lon + ";" + "title:" + poiname + ";addr:" + " " + "&referer=myapp"));
            } else if (selectType == 2) {
                intent.setData(Uri.parse("http://apis.map.qq.com/uri/v1/search?keyword="+ keyWords +"¢er="+ lat + "," + lon +"&radius=5000&referer=myapp"));
            }
        }
        mContext.startActivity(intent);
    }
    /**
     * 判断手机地图是否安装  高德地图:com.autonavi.minimap 百度地图:com.baidu.BaiduMap 腾讯地图
     *
     * @return
     */
    @JavascriptInterface
    public String isInstallByread() {
        mapBean = new MapBean();
        //高德地图
        if(new File("/data/data/" + "com.autonavi.minimap").exists()) {
            mapBean.setGaoDei("1");
        }
        //百度地图
        if (new File("/data/data/" + "com.baidu.BaiduMap").exists()) {
            mapBean.setBaiDu("2");
        }
        //腾讯地图
        if (new File("/data/data/" + "com.tencent.map").exists()) {
            mapBean.setTenXun("3");
        }
        //google地图
//        if (new File("/data/data/" + "com.google.android.apps.maps").exists()) {
//            mapBean.setGoogleMap("4");
//        }
        return new Gson().toJson(mapBean);
    }
 
 
    /**
     * 去市场下载页面
     */
    public void goToMarket(Context context, String packageName) {
        Uri uri = Uri.parse("market://details?id=" + packageName);
        Intent goToMarket = new Intent(Intent.ACTION_VIEW, uri);
        try {
            context.startActivity(goToMarket);
        } catch (ActivityNotFoundException e) {
    }

所使用到的实体类是:


/**
 * Created by zhaoyihuan on 2018/3/8.
 */
 
public class MapBean {
    String baiDu;
    String gaoDei;
    String tenXun;
 
    public String getTenXun() {
        return tenXun;
    }
 
    public void setTenXun(String tenXun) {
        this.tenXun = tenXun;
    }
 
    public String getBaiDu() {
        return baiDu;
    }
 
    public void setBaiDu(String baiDu) {
        this.baiDu = baiDu;
    }
 
    public String getGaoDei() {
        return gaoDei;
    }
 
    public void setGaoDei(String gaoDei) {
        this.gaoDei = gaoDei;
    }

调用肯定是用webview来调用,那后台接口就到此结束了。

回到稻壳网首页
稻壳客服

扫一扫,微信咨询

请留下需求和联系方式,我们即刻为您准备方案
需求提交成功

提交成功

免费服务热线021-61676039(工作日9:00 ~ 18:00)
×
稻壳客服

扫一扫,微信咨询