成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

地圖問題:中心點(diǎn)左上角等

LoftySoul / 2906人閱讀

摘要:在最近的項(xiàng)目遇到一問題,不管是在中引用地圖還是引用百度地圖總會(huì)遇到相同的一個(gè)問題,經(jīng)過不斷嘗試與找資料最后終于解決了。

在最近的項(xiàng)目遇到一問題,不管是在leaflet.js中引用google地圖還是引用百度地圖總會(huì)遇到相同的一個(gè)問題,經(jīng)過不斷嘗試與找資料最后終于解決了。
當(dāng)?shù)貓D區(qū)域剛開始為display:none,時(shí),地圖的中心點(diǎn)會(huì)往其他地方偏移,造成地圖不能完全在目標(biāo)區(qū)域顯示,經(jīng)過不斷地發(fā)掘最后得出如下結(jié)論:

**Root Cause:當(dāng)?shù)貓D區(qū)域剛開始為display:none;時(shí),地圖默認(rèn)的中心點(diǎn)為可視區(qū)域的中心點(diǎn),頁面左上角開始,從而造成了地圖偏移**
**Solution:在地圖初始化之前,將隱藏區(qū)域顯示出來:display:block;
**Ex:`document.getElementById("mapBox").css("display","block");`

2、在地圖再次加載顯示的時(shí)候報(bào)錯(cuò)地圖已經(jīng)初始化**

**Root Cause: map對象保存在global Object中**
**Solution:在初始化之前移除map對象**
**Ex:`var map = window.map;
      if(map) {
          map.remove();
      }
      var map = new L.map("mapId");//采用leaflet.js
      window.map = map;`**

另外一個(gè)在Bootstrap中的定位,利用z-index:比如要把一個(gè)div框的內(nèi)容在class=col-xs-12的div之上,采用position:absolute;已經(jīng)會(huì)被覆蓋,那么采用什么好呢?筆者采用的是position:relative;并同時(shí)設(shè)置一個(gè)較大的z-index;這樣就不會(huì)被覆蓋了。

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/80496.html

相關(guān)文章

  • 移動(dòng)地圖時(shí)自動(dòng)獲取當(dāng)前地圖中心地區(qū)

    摘要:原文鏈接的博客問題來源使用百度地圖時(shí),移動(dòng)地圖我們發(fā)現(xiàn)百度地圖右上角的地區(qū)名稱是隨當(dāng)前地圖顯示區(qū)域自動(dòng)變化的。分析當(dāng)前屏幕每個(gè)區(qū)域的面積占比即可獲取當(dāng)前地圖區(qū)域。 原文鏈接:Bougie的博客 問題來源 使用百度地圖時(shí),移動(dòng)地圖,我們發(fā)現(xiàn)百度地圖右上角的地區(qū)名稱是隨當(dāng)前地圖顯示區(qū)域自動(dòng)變化的。對此,我仿寫了一個(gè)計(jì)算地圖當(dāng)前區(qū)域的方法。showImg(https://segmentfau...

    YancyYe 評(píng)論0 收藏0
  • 移動(dòng)地圖時(shí)自動(dòng)獲取當(dāng)前地圖中心地區(qū)

    摘要:原文鏈接的博客問題來源使用百度地圖時(shí),移動(dòng)地圖我們發(fā)現(xiàn)百度地圖右上角的地區(qū)名稱是隨當(dāng)前地圖顯示區(qū)域自動(dòng)變化的。分析當(dāng)前屏幕每個(gè)區(qū)域的面積占比即可獲取當(dāng)前地圖區(qū)域。 原文鏈接:Bougie的博客 問題來源 使用百度地圖時(shí),移動(dòng)地圖,我們發(fā)現(xiàn)百度地圖右上角的地區(qū)名稱是隨當(dāng)前地圖顯示區(qū)域自動(dòng)變化的。對此,我仿寫了一個(gè)計(jì)算地圖當(dāng)前區(qū)域的方法。showImg(https://segmentfau...

    xingpingz 評(píng)論0 收藏0
  • leaflet常用功能

    摘要:簡介純在地圖上進(jìn)行操作坐標(biāo)點(diǎn)路徑曲線等的一個(gè)庫只提供操作地圖實(shí)際加載某個(gè)地圖由開發(fā)者決定創(chuàng)建地圖對象頁面創(chuàng)建設(shè)置屬性撐滿整個(gè)屏幕設(shè)置中屬性使用初始化地圖對象為名字參數(shù)地圖中心坐標(biāo)位置參數(shù)地圖加載級(jí)別數(shù)字越大地圖加載越近為地圖加載瓦片圖層常用 簡介 純JavaScript,在地圖上進(jìn)行操作(坐標(biāo)點(diǎn),路徑,曲線等)的一個(gè)庫,只提供操作地圖API,實(shí)際加載某個(gè)地圖,由開發(fā)者決定 創(chuàng)建地圖對象...

    derek_334892 評(píng)論0 收藏0
  • 基于RestOn智能睡眠監(jiān)測器的睡眠監(jiān)測系統(tǒng)

    摘要:一項(xiàng)目地址為二項(xiàng)目功能概述該項(xiàng)目實(shí)現(xiàn)的是一個(gè)基于智能睡眠監(jiān)測器的睡眠監(jiān)測系統(tǒng)。我們可以在個(gè)人中心的設(shè)置中心進(jìn)行報(bào)警閾值的設(shè)定。睡眠自測試頁面如下圖所示用戶可以在該頁面進(jìn)行睡眠自測試,點(diǎn)擊提交按鈕后,便可以在彈出框當(dāng)中查看自己的睡眠質(zhì)量等級(jí)。 一、項(xiàng)目地址為: https://github.com/linqian123... 二、項(xiàng)目功能概述: 該項(xiàng)目實(shí)現(xiàn)的是一個(gè)基于RestOn智能睡眠...

    Java_oldboy 評(píng)論0 收藏0
  • 基于RestOn智能睡眠監(jiān)測器的睡眠監(jiān)測系統(tǒng)

    摘要:一項(xiàng)目地址為二項(xiàng)目功能概述該項(xiàng)目實(shí)現(xiàn)的是一個(gè)基于智能睡眠監(jiān)測器的睡眠監(jiān)測系統(tǒng)。我們可以在個(gè)人中心的設(shè)置中心進(jìn)行報(bào)警閾值的設(shè)定。睡眠自測試頁面如下圖所示用戶可以在該頁面進(jìn)行睡眠自測試,點(diǎn)擊提交按鈕后,便可以在彈出框當(dāng)中查看自己的睡眠質(zhì)量等級(jí)。 一、項(xiàng)目地址為: https://github.com/linqian123... 二、項(xiàng)目功能概述: 該項(xiàng)目實(shí)現(xiàn)的是一個(gè)基于RestOn智能睡眠...

    JayChen 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

LoftySoul

|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<