簡介

該方法支援跳轉第三方地圖並定位指定座標。

APP端跳轉至百度地圖（第三方軟體）；若無，則跳轉至高德地圖（第三方軟體）；若均無，則開啟騰訊地圖（uni自帶方法：uni.openLocation）
其它端開啟騰訊地圖（uni自帶方法：uni.openLocation）

demo

原始碼：https://github.com/yapeee/uni-components

測試資料：

wgs84: 39.9078008469,116.391290596
bd09: 39.915547,116.403909
gcj02: 39.9091591069,116.3974783161

基礎用法

import Map from '../ms-openMap.js'
Map.openMap(latitude,longitude,name,coord_type)

屬性說明

引數	說明	型別
latitude	緯度（預設GCJ-02座標系）	Float
longitude	經度（預設GCJ-02座標系）	Float
name	地圖標註名稱	String
coord_type	座標型別，可選引數。示例：gcj02、bd09、wgs84	String

實現方案

首先判斷程式的執行平臺，不同的平臺呼叫不同的開啟地圖的方法。android和ios平臺下，判斷並開啟百度地圖和高德地圖。其他平臺下，開啟騰訊地圖網頁版（uni自帶方法）。

一、判斷執行平臺

通過條件編譯及uni.getSystemInfoSync().platform來判斷android、ios及其他平臺。

// #ifdef APP-PLUS
switch(uni.getSystemInfoSync().platform){
  case 'android':
    console.log('執行Android上')
    openMapByAndroid(latitude,name)
    break;
  case 'ios':
    console.log('執行iOS上')
    openMapByIos(latitude,name)
    break;
  default:
    openMapByDefault(latitude,name)
    console.log('執行在開發者工具上')  
    break;
}  
// #endif
// #ifndef APP-PLUS
openMapByDefault(latitude,name)
// #endif
tips：

平臺判斷有2種場景，一種是在編譯期判斷，一種是在執行期判斷。

編譯期判斷：即條件編譯，不同平臺在編譯出包後已經是不同的程式碼。

執行期判斷：執行期判斷是指程式碼已經打入包中，仍然需要在執行期判斷平臺，此時可使用 uni.getSystemInfoSync().platform 判斷客戶端環境是 Android、iOS 還是小程式開發工具（在百度小程式開發工具、微信小程式開發工具、支付寶小程式開發工具中使用 uni.getSystemInfoSync().platform 返回值均為 devtools）。

二、APP開啟第三方地圖的方法

HTML5+是對接SDK與頁面的中介軟體，用於頁面通過js呼叫底層的SDK介面。

2.1、 APP判斷第三方應用是否存在

/*
 * appInf: ( ApplicationInf ) 必選 要判斷第三方程式的描述資訊
 * Android平臺需要通過設定appInf的pname屬性（包名）進行查詢。 
 * iOS平臺需要通過設定appInf的action屬性（Scheme）進行查詢，在iOS9以後需要新增白名單才可查詢，
 * 在manifest.json檔案plus->distribute->apple->urlschemewhitelist節點下新增（如urlschemewhitelist:["weixin"]）.
 */
plus.runtime.isApplicationExist(appInf);

2.1.1、判斷百度地圖應用是否存在

plus.runtime.isApplicationExist({pname: 'com.baidu.BaiduMap',action: 'baidumap://'})

2.1.2、判斷高德地圖應用是否存在

plus.runtime.isApplicationExist({pname: 'com.autonavi.minimap'},action: 'iosamap://'})

2.2、APP呼叫第三方程式開啟指定的URL

/*
 * 說明：呼叫第三方程式開啟指定的URL
 * 引數：
 * url: ( String ) 必選 要開啟的URL地址
 * errorCB: ( OpenErrorCallback ) 可選 開啟URL地址失敗的回撥
 * identity: ( String ) 可選 指定開啟URL地址的程式名稱
 */
plus.runtime.openURL( url,errorCB,identity );

2.2.1、開啟第三方程式實際應用

function openURL(url,identity ) {
  let newurl = encodeURI(url);
  plus.runtime.openURL( newurl,function(res){
    uni.showModal({
      content: res.message
    })
  },identity);
}

2.2.2、開啟android百度地圖

url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&coord_type=gcj02&src=andr.baidu.openAPIdemo`
identity = 'com.baidu.BaiduMap'
openURL(url,identity)

2.2.3、開啟android高德地圖

url = `androidamap://viewMap?sourceApplication=appname&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`
identity = 'com.autonavi.minimap'
openURL(url,identity)

2.2.4、開啟ios百度地圖

url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=ios.baidu.openAPIdemo&coord_type=gcj02`;
openURL(url,identity)

2.2.5、開啟ios高德地圖

url = `iosamap://viewMap?sourceApplication=applicationName&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`
openURL(url,identity)

三、其他平臺開啟地圖的方法

其他平臺採用uni.openLocation(OBJECT)方法使用應用內建地圖檢視位置。

uni.openLocation({
  latitude: latitude,longitude: longitude,name: name,fail: () => {
    uni.showModal({
      content: '開啟地圖失敗,請重'
    })
  },})

更新日誌

2020-01-02

支援BD-09（百度座標）、GCJ-02（高德、騰訊）、WGS-84（GPS座標）座標系。

2019.12.10

第一次釋出，支援跳轉第三方地圖並定位指定座標。

參考

百度地圖URI API
高德地圖URI API
uni-app HTML5+ API

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。