高德地图H5内嵌小程序遇到的跳转地图问题-Toy模板网

这篇具有很好参考价值的文章主要介绍了高德地图H5内嵌小程序遇到的跳转地图问题。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

vue里使用高德地图h5内嵌小程序跳转，在小程序是打不开的，需要判断在小程序内，调起小程序地图组件

h5中的地图是这样展示的，在微信小程序是无法跳转的
高德地图H5内嵌小程序遇到的跳转地图问题

引入jweixin.js

  <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

vue里判断

<a class="more" @click="onmore">到这去</a>

  const onmore = () => {
      let h5Url = window.location.href
      if (window.__wxjs_environment == 'miniprogram') {
        // alert("在小程序")
        wx.miniProgram.navigateTo({ url: '/pages/webview/webview?longitude=' + longitude.value + '&latitude=' + latitude.value + '&latituname=' + mapname.value + '&address='+address.value+'&url='+h5Url+'  ' })

      } else {
        // alert("不在小程序")
        window.location.href = `https://uri.amap.com/marker?position=${jwd1.value}&name=${mapnamedata.value}`;
      }
    }

在小程序这边接收传过来的参数（需要注意的是：高德地图坐标和腾讯坐标是一样的，只需要经纬度反过来即可）

 if(options.latitude != '' && options.latitude != undefined ){
      let longitude = options.latitude;
      let latitude = options.longitude;
      let address = options.address;
      let name = options.latituname
      console.log(options.url)
      longitude = parseFloat(longitude);
      latitude = parseFloat(latitude);
      wx.openLocation({
        longitude: latitude,
        latitude: longitude,
        name:name,
        address: address,
        scale: 15,
      })
    }

最后在小程序中呈现是这样，就完美实现了
高德地图H5内嵌小程序遇到的跳转地图问题文章来源地址https://www.toymoban.com/news/detail-515024.html