小編給大家分享一下微信小程序如何使用JS加載esmap地圖,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
網(wǎng)站建設哪家好,找創(chuàng)新互聯(lián)建站!專注于網(wǎng)頁設計、網(wǎng)站建設、微信開發(fā)、小程序設計、集團企業(yè)網(wǎng)站建設等服務項目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了勃利免費建站歡迎大家使用!
一、在微信小程序里顯示室內(nèi)三維地圖 需要滿足的兩個條件
調(diào)用ESMap室內(nèi)地圖需要用到小程序web-view
組件,想要通過 web-view 調(diào)用ESMap室內(nèi)地圖需要滿足以下 2 個條件:
1. 小程序是企業(yè)主體,微信 web-view
組件不對個人類型的小程序開放。
2. 您需要有一個自己的域名,在嵌入網(wǎng)頁的時候需要在微信后臺驗證域名(只有自己域名下的網(wǎng)頁才能被正確地顯示哦,不能隨便找一個公開鏈接)。
二、具體實現(xiàn)步驟
1、域名驗證:
由于微信平臺的規(guī)定,web-view
指向的地址,必須是在微信小程序后臺登記的域名,否則會出現(xiàn)“不支持打開非業(yè)務域名,請重新配置”的提示。
首先我們在微信的后臺找到開發(fā) > 開發(fā)設置 > 業(yè)務域名模塊,并填上你需要綁定的域名。
需要注意的是,這里的域名強制 https,需要配置好 https 證書,購買服務器的時候也要注意購買支持 https 的服務器。
接下來,我們需要下載一個微信的驗證文件,放在你域名的根目錄下,并且支持訪問。
具體來說,如果您的域名www.esmap.cn,微信的驗證文件是WATLNxupm4.txt,您需要確保https://www.esmap.cn/WATLNxupm4.txt 可以公開訪問。確認無誤之后,點擊保存即可成功保存。
注:小程序所有用到的https請求都需要配置合法域名
2、嵌入帶有室內(nèi)地圖的web-view
這個過程其實很簡單,找到你微信小程序的.wxml文件,添加以下代碼
<web-viewsrc="https://www.esmap.cn /esmap.html"/>
其中 https://www.esmap.cn /esmap.html 是帶有地圖的 H5 頁面
室內(nèi)地圖制作流程,您可以使用下面兩種方式構建這個頁面:
1) 從https://www.esmap.cn 官網(wǎng)中復制測試地圖源碼DEMO,在您自己的服務器進行免費部署。
2) 參考https://www.esmap.cn 室內(nèi)三維地圖SDK開發(fā)說明,在您已有的 H5 頁面上添加自己制作的室內(nèi)地圖。
3、小程序 web-view 的一些提示
微信小程序的 web-view 只能是全屏的,并且會覆蓋頁面中的所有其他組件。
1) 如果想在網(wǎng)頁中判斷是否處于微信小程序中
var ua = window.navigator.userAgent.toLowerCase(); if (ua.indexOf('micromessenger') == -1) {//說明不在微信中 // 走不在小程序的邏輯 } else { wx.miniProgram.getEnv(function(res) { if (res.miniprogram) { // 走在小程序的邏輯 } else { // 走不在小程序的邏輯 } }) }
2) 如果網(wǎng)頁想給小程序傳遞信息,可以通過 wx.miniProgram.postMessage
方法。
3) 小程序中可以通過 postMessage 方法監(jiān)聽網(wǎng)頁傳遞回來的數(shù)據(jù),但是該方法僅在特定時機(小程序后退、組件銷毀、分享)觸發(fā),沒法實時傳遞消息。
4) 網(wǎng)頁跳轉到小程序頁面
wx.miniProgram.navigateTo({ url: '/pages/esmap/esmap?location=' + obj.location });
三、更多效果!
以上是“微信小程序如何使用JS加載esmap地圖”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學習更多知識,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
名稱欄目:微信小程序如何使用JS加載esmap地圖
本文網(wǎng)址:http://bm7419.com/article22/ggoocc.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供軟件開發(fā)、響應式網(wǎng)站、商城網(wǎng)站、外貿(mào)建站、服務器托管、網(wǎng)站策劃
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉載內(nèi)容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)