首先，在微信小程序中显示室内3 D地图需要满足的两个条件

调用ESMap室内地图需要applet的web-view组件。要通过web-view调用ESMap室内地图，必须满足以下两个条件：

1.小程序是企业的主体，微信web-view组件不对个人小程序开放。

2.需要有自己的域名，嵌入网页的时候需要在微信后台验证域名(只有自己域名下的网页才能正确显示，不能随便找一个公共链接)。

二、具体实施步骤

1.域名验证：

由于微信平台的规定，网页查看指向的地址必须是在微信小程序后台注册的域名，否则会出现“不支持开通非业务域名，请重新配置”的提示。

首先我们在微信后台找到业务域名开发设置模块，填写需要绑定的域名。

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

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

具体来说，如果你的域名是www.esmap.cn，微信的验证文件是WATLNxupm4.txt，你需要保证https://www.esmap.cn/WATLNxupm4.txt可以公开访问。确认后，点击保存，保存成功。

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

2.将网络视图嵌入室内地图

这个过程其实很简单。找到。微信小程序的wxml文件，并添加以下代码

www.esmap.cn/esmap.html'/wherehttps://www.esmap.cn/esmap.html是带地图的H5网页

室内地图制作过程中，可以使用以下两种方式来构建此页面：

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

2)参考https://www.esmap.cn室内3D地图SDK的开发说明，将自己的室内地图添加到现有的H5页面。

3.小程序网页浏览的一些技巧

微信小程序的网页视图只能全屏显示，并将覆盖页面中的所有其他组件。

1)如果你想判断自己是否在网页中的微信小程序中，

var ua=window . navigator . user agent . tolowercase()；If (ua。的索引(' micro messenger ')==-1){//表示不在微信中//不在小程序的逻辑中} Else { wx . miniprogram . getenv(function(RES){ If(RES . miniprogram){//在小程序的逻辑中} Else {//超越小程序的逻辑} }) }2)如果网页想给小程序发送信息，可以使用wx.miniProgram.postMessage方法。

3)可以在小程序中使用postMessage方法来监控从网页发回的数据，但这种方法只在特定时间触发(小程序撤退、组件销毁、共享)，不能实时传输消息。

4)网页跳转到小程序页面

wx . miniprogram . navigateto({ URL : '/page/esmap/esmap？location=' obj . location })；第三，更多的效果！

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

https://www.esmap.cn/sdk-demo/demo/index.html?tt=cnblogs5

摘要

以上是边肖介绍的微信小程序JS加载esmap地图的例子。希望对大家有帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！如果你觉得这篇文章对你有帮助，请转载，请注明出处，谢谢！