H5端根据指定地址显示地图并且可调起三大主流地图软件（腾讯、百度、高德）

一.准备工作：申请接入地图的appKey

二.参考文档：

# 高德地图--获取静态地图
https://lbs.amap.com/api/webservice/guide/api/staticmaps
# 高德地图--移动端拉起app应用
https://lbs.amap.com/api/uri-api/guide/mobile-web/point
# 百度地图--移动端拉起app应用
http://lbsyun.baidu.com/index.php?title=uri/api/web
# 腾讯地图--移动端拉起app应用
https://lbs.qq.com/webApi/uriV1/uriGuide/uriWebMarker

三.代码实现（基于Laravel框架）

控制器

<?php
class DemoController 
{
    public function map()
    {
        $address = '广东省广州市黄埔区庙头村庙头旭日街22号';
        $addressInfo = $this->get_address_detail($address);
        $gaodeStaticMap = $lat = $lng = $gaodeUriUrl = $baiduUriUrl = $tencentUriUrl = ''; // 高德地图静态地图、经度、纬度
        if ($addressInfo) {
            $gaodeStaticMap = $this->get_gaode_static_view($addressInfo);
            $location = explode(',',$addressInfo['location']);
            $lat = $location[0];
            $lng = $location[1];
            // 获取高德、百度、腾讯的调起app链接
            $params = ['address' => $address,'lat' => $lat,'lng' => $lng];
            $gaodeUriUrl = $this->getGaodeUriUrl($params); 
            $baiduUriUrl = '';
            $tencentUriUrl = $this->getTencentUriUrl($params);
        }
        $projectInfo['gaodeStaticMap'] = $gaodeStaticMap; 
        $projectInfo['gaodeUriUrl '] = $gaodeStaticMap;  
        $projectInfo['baiduUriUrl '] = $baiduUriUrl ;  
        $projectInfo['tencentUriUrl '] = $tencentUriUrl ;   
        return view('detail',compact('projectInfo');
    }
    // todo 获取地址对应的经纬度信息
    public function get_address_detail($address)
    {
        $appkey = ''; // 高德地图appKey
        $address = urlencode($address);
        $url = 'https://restapi.amap.com/v3/geocode/geo?address='.$address.'&key='.$appKey;
        $result = $this->curl_request($url,0,0,1);
        $urlInfo = json_decode($result,true);
        if (!$urlInfo ||$urlInfo['status'] != 1 || !$urlInfo['geocodes']) {
            return false;
        }
        return $urlInfo['geocodes'][0];
    }
    // todo 获取高德地图静态地图
    public function get_gaode_static_view(...$params)
    {    
        $params = $params[0];
        $appKey = ''; // 高德地图appKey
        $location = $params['location'];
        $zoom = isset($params['zoom']) ? $params['zoom'] : 12;
        $size = isset($params['size']) ? $params['size'] : '600*600';
        $url = "https://restapi.amap.com/v3/staticmap?location={$location}&zoom={$zoom}&size={$size}&markers=mid,,L:{$location}&key={$appKey}";
        
        return $url;
    }
    // todo 获取高德地图拉起app链接 
    public function getGaodeUriUrl(...$params)
    {
        $params = $params[0];
        $address = urlencode($params['address']);
        $location = "{$params['lat']},{$params['lng']}";
        return "http://uri.amap.com/marker?position={$location}&name={$address}&coordinate=gaode&callnative=1";
    }

    // todo 获取腾讯地图拉起app链接 
    public function getTencentUriUrl(...$params)
    {
        $params = $params[0];
        $appKey = ''; // 腾讯地图appKey
        $address = urlencode($params['address']);
        $lat = $params['lat'];
        $lng = $params['lng'];
        $url = "https://apis.map.qq.com/uri/v1/marker?marker=coord:{$lng},{$lat};title:{$address};addr:{$address}&referer={$appKey}";
        return $url;
    }

    // todo 获取百度地图拉起app链接 
    public function getBaiduUriUrl(...$params)
    {
        ...
    }
    
    // todo curl请求
    public function curl_request($url, $params = false, $ispost = 0, $https = 0)
    {
        $httpInfo = array();
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_HTTP_VERSION, CURL_HTTP_VERSION_1_1);
        curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.118 Safari/537.36');
        curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, 30);
        curl_setopt($ch, CURLOPT_TIMEOUT, 30);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        if ($https) {
            curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE); // 对认证证书来源的检查
            curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, FALSE); // 从证书中检查SSL加密算法是否存在
        }
        if ($ispost) {
            curl_setopt($ch, CURLOPT_POST, true);
            curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
            curl_setopt($ch, CURLOPT_URL, $url);
        } else {
            if ($params) {
                if (is_array($params)) {
                    $params = http_build_query($params);
                }
                curl_setopt($ch, CURLOPT_URL, $url . '?' . $params);
            } else {
                curl_setopt($ch, CURLOPT_URL, $url);
            }
        }

        $response = curl_exec($ch);

        if ($response === FALSE) {
            // echo "cURL Error: " . curl_error($ch);
            return false;
        }
        $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE); // 响应code
        $httpInfo = array_merge($httpInfo, curl_getinfo($ch)); // 发起请求方的详细信息

        curl_close($ch);
        return $response;
    }
}

前端页面

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<div style="width:500px;">
    <img style="width:100%;" src="{
   
   {$projectInfo['gaodeStaticMap']}}" alt="">
    <div class="show_map_btn">
        <button onclick="go_to_map_url('{
   
   {$projectInfo['gaodeUriUrl']}}')">高德地图</button>
        <button onclick="go_to_map_url('{
   
   {$projectInfo['baiduUriUrl']}}')">百度地图</button>
        <button onclick="go_to_map_url('{
   
   {$projectInfo['tencentUriUrl']}}')">腾讯地图</button>
    </div>
</div>
</body>
</html>
<script>
    function go_to_map_url(url)
    {
        window.location.href = url;
    }
</script>

四.可能遇到的问题

1.在调用不同地图的接口时，需要看清楚每个demo接口的经纬度的放置位置；

。。。待续