Vue中JSH5移动端调起第三方地图软件(高德、腾讯、百度)

提示：以下是本篇文章正文内容，下面案例可供参考

一、首先区分当前环境是ios端还是android端的方法

onSelect(){

      const u = navigator.userAgent

      console.log(u)

      const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)

      const isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1

}

二、根据当前环境来调地图的方法import numpy as np

onSelect(){

      let url

      const u = navigator.userAgent

      console.log(u)

      const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)

      const isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1

if (isAndroid) {

        switch (item.id) {

          case 2: // 百度地图

            url = `http://api.map.baidu.com/marker?location=${itemva.latitude},${itemva.longitude}&title=${itemva.name}&content=${itemva.name}&output=html`

            break

          case 3: // 高德地图

            url = `androidamap://viewMap?sourceApplication=appname&poiname=${itemva.name}&lat=${itemva.latitude}&lon=${itemva.longitude}&dev=0`

            break

          default:

            break

        }

        if (url != '') {

           window.location.href = url

        }

      } else if (isiOS) {

        switch (item.id) {

          case 2: // 百度地图

            url = `http://api.map.baidu.com/marker?location=${itemva.latitude},${itemva.longitude}&title=${itemva.name}&content=${itemva.name}&output=html`

            break

          case 3: // 高德地图

            url = `iosamap://viewMap?sourceApplication=applicationName&poiname=${itemva.name}&lat=${itemva.latitude}&lon=${itemva.longitude}&dev=0`

            break

          default:

            break

        }

        if (url != '') {

          window.location.href = url

          // excuteBridge()

          // ZWJSBridge.openLink({

          //   url: url

          // })

          //   .then(result => {

          //     console.log(result)

          //   })

          //   .catch(error => {

          //     console.log(error)

          //   })

        }

      }

}