js室内地图开发_支付宝小程序室内地图导航开发-支付宝小程序JS加载esmap地图...

一、在支付宝小程序里显示室内三维地图需要满足的两个条件

调用esmap室内地图需要用到小程序web-view组件，想要通过 web-view 调用esmap室内地图需要满足以下 2 个条件：

1. 小程序是企业主体，支付宝 web-view 组件不对个人类型的小程序开放。

2. 您需要有一个自己的域名，在嵌入网页的时候需要在支付宝后台验证域名(只有自己域名下的网页才能被正确地显示哦，不能随便找一个公开链接)。

支付宝小程序管理中心 > 设置 > 开发设置 > h5域名配置里设置(如下图)

二、具体实现步骤

1、域名验证：

由于支付宝平台的规定，web-view 指向的地址，必须是在支付宝小程序后台登记的域名，否则无法使用。

首先我们找到支付宝小程序管理中心 > 设置 > 开发设置 > h5域名配置，并填上你需要绑定的域名。

需要注意的是，这里的域名强制 https，需要配置好 https 证书，购买服务器的时候也要注意购买支持 https 的服务器。

接下来，我们需要下载一个支付宝的验证文件，放在你域名的根目录下，并且支持访问。

具体来说，如果您的域名www.esmap.cn，支付宝的验证文件是watlnxupm4.txt，您需要确保https://www.esmap.cn/watlnxupm4.txt 可以公开访问。确认无误之后，点击保存即可成功保存。

注：小程序所有用到的https请求都需要配置合法域名

2、嵌入带有室内地图的web-view

这个过程其实很简单，找到你支付宝小程序的.wxml文件，添加以下代码

其中 https://www.esmap.cn /esmap.html 是带有地图的 h5 页面

室内地图制作流程，您可以使用下面两种方式构建这个页面：

1) 从https://www.esmap.cn 官网中复制测试地图源码demo，在您自己的服务器进行免费部署。

2) 参考https://www.esmap.cn 室内三维地图sdk开发说明，在您已有的 h5 页面上添加自己制作的室内地图。

3、小程序 web-view 的一些提示

支付宝小程序的 web-view 只能是全屏的，并且会覆盖页面中的所有其他组件。

1) 支付宝小程序给网页传递信息方法

this.webviewcontext = my.createwebviewcontext('web-view-1');

this.webviewcontext.postmessage({'sendtowebview': '1'});

2) 如果网页想给支付宝小程序传递信息，可以通过 my.postmessage({'sendtominiprogram': '0'}); 方法。

三、支付宝小程序里面可以进行蓝牙定位导航，由易景空间提供完整的定位导航方案，不用写一行代码就可以完成商场定位导航等方案的现场部署！

四、更多效果！

更多室内三维地图引擎例子功能体验

如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！

js室内地图开发_支付宝小程序室内地图导航开发-支付宝小程序JS加载esmap地图...相关推荐

在 ArcGIS Engine 应用程序中加载搜狗地图和谷歌地图。
在ArcGIS Engine 应用程序中加载搜狗地图和谷歌地图. Adding sogou map or google map in ArcGIS Engine application WebmapL ...
在ArcGIS Engine 应用程序中加载搜狗地图和谷歌地图
在ArcGIS Engine 应用程序中加载搜狗地图和谷歌地图. Adding sogou map or google map in ArcGIS Engine application WebmapL ...
echarts asp mysql 源码_如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)...
ECharts地图主要用于地理区域数据的可视化,展示不同区域的数据分布信息.ECharts官网提供了中国地图.世界地图等地图数据下载,通过js引入或异步加载json文件的形式调用地图. 本文将结合实例 ...
js室内地图开发_vue加载esmap室内地图
vue加载esmap室内地图使用 vue 开发室内地图与传统开发,有些许不同下载vue-cli2/vue-cli3版地图示例 SDK目前不支持用require js引用,只能使用引用 Tips:使 ...
微信小程序加载百度地图
1:申请百度地图服务的ak,(个人感觉浏览器和小程序类型没区别,甚至浏览器比小程序更好) 2:配置地图服务,微信小程序开发平台,设置开发设置 3:小程序里添加地图服务的js文件bmap-wx.min. ...
微信小程序加载 FengMap地图
实现微信小程序加载FengMap地图,主要通过小程序<web-view>组件的src属性的外链方式加载,如<web-view src="https://fengmap.co ...
（转） Arcgis for js加载百度地图
http://blog.csdn.net/gisshixisheng/article/details/44853709 概述: 在前面的文章里提到了Arcgis for js加载天地图,在本节,继续讲 ...
Arcgis加载离线地图服务二次开发
ARCGIS搭建离线地图服务器,进行离线地图二次开发 1. 离线地图金字塔瓦片数据 (下载数据教程:http://www.bigemap.com/helps/doc20190312126.h ...
web高德地图怎么加载离线地图_基于 QGIS 在内网中离线加载卫星地图的方法
1. 概述我们之前为大家分享过在三维地球开源平台离线加载卫星影像的方法,主要包括基于桌面端的OsgEarth开源三维地球和基于Web端的Cesium开源三维地球等平台的局域网离线影像加载. 另外,也 ...
《ArcGIS Runtime SDK for Android开发笔记》——（13）、图层扩展方式加载Google地图...
1.前言 http://mt2.google.cn/vt/lyrs=m@225000000&hl=zh-CN&gl=cn&x=420&y=193&z=9& ...

js室内地图开发_支付宝小程序室内地图导航开发-支付宝小程序JS加载esmap地图...

js室内地图开发_支付宝小程序室内地图导航开发-支付宝小程序JS加载esmap地图...相关推荐

最新文章

热门文章