谷歌地圖打不開的解決辦法
谷歌地圖被中國防火墻封殺,所以不用直接引用http://maps.googleapis.com/maps/api/js?sensor=false&language=en這域名下的谷歌地圖api,而是改為http://maps.google.cn/maps/api/js?sensor=false這個地址,google.cn在國內(nèi)的域名沒有被封殺,可以使用。
注意:google.cn雖然可以使用,但是會輸出部分js引用到google.com的資源,導(dǎo)致地圖呈現(xiàn)會延時,所以不要將谷歌地圖api放到你的內(nèi)容前面,如head標(biāo)簽里面,而是放到內(nèi)容或者h(yuǎn)tml結(jié)束標(biāo)簽最后,防止你的頁面內(nèi)容一直是空白,瀏覽器無法顯示內(nèi)容。
也不要用window.onload事件來繪制,要不谷歌地圖顯示不及時,因?yàn)橐虞dgoogle.com的資源,而google.com資源被攔截,會導(dǎo)致知道請求超時(大概2分鐘)才會繪制出谷歌地圖。
使用谷歌的回調(diào)參數(shù)來傳遞一個回調(diào)函數(shù)名稱,經(jīng)測試這樣比使用window.onload事件快呈現(xiàn)出谷歌地圖。
示例代碼:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>網(wǎng)站引用谷歌地圖打不開解決辦法:使用google.cn</title> </head> <body> <div id="map_canvas" class="map" style="height: 350px;width: 500px;"></div></body> <script type="text/javascript" src="http://maps.google.cn/maps/api/js?sensor=false&callback=renderGoogleMap"></script> <script type="text/javascript"> function renderGoogleMap() { var geocoder = new google.maps.Geocoder(); geocoder.geocode({ 'address': '廣西桂林市中心廣場' }, function (results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); } else { alert("Geocode was not successful for the following reason: " + status); } }); var mapOptions = { zoom: 17, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); } </script> </body> </html>
- jQuery 生成svg矢量二維碼
- Android矢量圖之VectorDrawable類自由填充色彩
- 如何玩轉(zhuǎn)Android矢量圖VectorDrawable
- iOS應(yīng)用開發(fā)中矢量圖的使用及修改矢量圖顏色的方法
- Python計(jì)算三維矢量幅度的方法
- 百度地圖api應(yīng)用標(biāo)注地理位置信息(js版)
- android實(shí)現(xiàn)百度地圖自定義彈出窗口功能
- 通過JS獲取用戶本地圖片路徑并顯示的代碼
- js 調(diào)用百度地圖api并在地圖上進(jìn)行打點(diǎn)添加標(biāo)注
- 百度地圖API應(yīng)用之獲取用戶的具體位置
- Android下如何使用百度地圖sdk
- Android百度地圖定位后獲取周邊位置的實(shí)現(xiàn)代碼
- Android 矢量室內(nèi)地圖開發(fā)實(shí)例
相關(guān)文章
PHP自動加載autoload和命名空間的應(yīng)用小結(jié)
PHP的自動加載就是我們加載實(shí)例化類的時候,不需要手動去寫require來導(dǎo)入這個class.php文件,程序自動幫我們加載導(dǎo)入進(jìn)來這.篇文章主要介紹了PHP自動加載autoload和命名空的應(yīng)用,需要的朋友可以參考下2017-12-12BootStrap框架個人總結(jié)(bootstrap框架、導(dǎo)航條、下拉菜單、輪播廣告carousel、柵格系統(tǒng)布局、標(biāo)簽頁
這篇文章主要介紹了BootStrap框架個人總結(jié)(bootstrap框架、導(dǎo)航條、下拉菜單、輪播廣告carousel、柵格系統(tǒng)布局、標(biāo)簽頁tabs、模態(tài)框、菜單定位)的相關(guān)資料,需要的朋友可以參考下2016-12-12基于javascript實(shí)現(xiàn)按圓形排列DIV元素(三)
本篇文章主要介紹基于javascript實(shí)現(xiàn)按圓形排列DIV元素的方法,此文著重于介紹怎樣實(shí)現(xiàn)圖片按橢圓形轉(zhuǎn)動,需要的朋友來看下吧2016-12-12使用bootstrap-paginator.js 分頁來進(jìn)行ajax 異步分頁請求示例
本篇文章主要介紹了使用bootstrap-paginator.js 分頁來進(jìn)行ajax 異步分頁請求示例,具有一定的參考價值,感興趣的小伙伴們可以參考一下。2017-03-03JavaScript實(shí)現(xiàn)QQ列表展開收縮擴(kuò)展功能
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)QQ列表展開收縮擴(kuò)展功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-10-10