引用百度地圖api二次載入地圖錯位
阿新 • • 發佈:2018-11-02
所做的網頁需要有百度地圖的功能。
於是引用了百度地圖,但是在初始化地圖的時候遇到了一個問題。
初始化的地圖中心點不正確。所標記的定位如果是第一次載入的話,定位是正確的。
但如果沒有清快取就進行第二次載入的話,這個定位一開始雖然是在地圖的最中間,但是由於初始定位不正確,一開始標記的定位也不正確,但是當你拖動地圖,或者將地圖放大縮小時,你才發現標記的定位又會回到所需要的正確定位。
初始化地圖的中心在我所預想的定位的左下方。上網上查了一下,大多數的問題都是標記初始化在檢視左上方(0,0)處。跟我的問題不符合。
他們所說的dom問題,也不存在。
最後師姐給了我一個建議,使用非同步操作。最後終於成功了。
在初始化地圖的時候,point直接換成城市名字,就是正常的初始化地圖,那麼便是point的錯誤。
程式碼如下:
<script type="text/javascript"> // 百度地圖API功能 var map = new BMap.Map("allmap"); var point = new BMap.Point(120.377841,30.3099); setTimeout(function () { // f1的任務程式碼 map.centerAndZoom(point, 15); console.log(point) map.enableScrollWheelZoom(true); var marker = new BMap.Marker(point); // 建立標註 map.addOverlay(marker); // 將標註新增到地圖中 var opts = { width : 200, // 資訊視窗寬度 height: 100, // 資訊視窗高度 title : "杭州軌物科技有限公司" , // 資訊視窗標題 enableMessage:true,//設定允許資訊窗傳送短息 } var infoWindow = new BMap.InfoWindow("地址:地址", opts); // 建立資訊視窗物件 marker.addEventListener("click", function(){ map.openInfoWindow(infoWindow,point); //開啟資訊視窗 }); }, 1000); </script>