Google Maps API加載問題。需要技術解釋。應該很容易回答

考慮這個fiddle。裝載問題背後的技術解釋是什麼？Google Maps API加載問題。需要技術解釋。應該很容易回答

index.php

<!DOCTYPE html> 
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'> 
    <head> 
    <meta http-equiv='content-type' content='text/html;charset=utf-8' /> 
    <meta name='description' content='test' /> 
    <title>test</title> 
    <style type='text/css'> 
     @import 'index.css'; 
    </style> 
    </head> 
<body class='njs'> 
    <div id='fb-root'></div> 
    <div id='map'></div> 
    <div id='mapR'></div> 
    <div class='fb-like' data-href='https://developers.facebook.com/docs/plugins/' data-send='true' data-width='450' data-show-faces='true'></div> 
    <script type='text/javascript' src='//connect.facebook.net/en_US/all.js'></script> 
    <script type='text/javascript' src='//maps.google.com/maps/api/js?sensor=true'></script> 
    <script type='text/javascript' src='index.js'></script> 
</body> 
</html>

index.css

body{ 
    margin:0; 
} 
#map{ 
    height:700px; width:700px; 
}

index.js

//<![CDATA[ 
var pre = onload; 
onload = function(){ 
if(pre)pre(); 
var doc = document, bod = doc.body, nav = navigator, IE = parseFloat(nav.appVersion.split('MSIE')[1]), geo = nav.geolocation, g = google.maps; 
bod.className = 'js'; 
function gteIE(version, className){ 
    if(IE >= version)bod.className = className; 
} 
function E(e){ 
    return doc.getElementById(e); 
} 
var m = E('map'), mR = E('mapR'); 
function geocoderErrors(r){ 
    var gs = g.GeocoderStatus, p; 
    switch(r){ 
    case gs.OVER_QUERY_LIMIT: 
     p = 'You have exceeded your query limit.'; 
     break; 
    case gs.REQUEST_DENIED: 
     p = 'Access denied.'; 
     break; 
    case gs.INVALID_REQUEST: 
     p = 'Your request was invalid.'; 
     break; 
    default: 
     p = 'No results were found for your request.'; 
    } 
    mR.innerHTML = p; 
} 
function geolocationErrors(r){ 
    var gl = 'Geolocation ', p; 
    switch(r.code){ 
    case r.PERMISSION_DENIED: 
     p = gl+'Permission Denied.'; 
     break; 
    case r.TIMEOUT: 
     p = gl+'Timed Out.'; 
     break; 
    case r.UNKNOWN_ERROR: 
     p = 'An unknown '+gl+'error has occurred.'; 
     break; 
    default: 
     p = gl+'Position Unavailable.'; 
    } 
    mR.innerHTML = p; 
} 
if(!geo || !nav.onLine){ 
    mR.innerHTML = 'Your Browser does not support Geolocation.'; 
} 
else if(FB && g){ 
    var map = new g.Map(m, {center: new g.LatLng(47.6065495, -122.3328983), zoom:8}), cds, lat, lng; 
    console.log(g); console.log(map); 
    geo.watchPosition(function(p){ 
    cds = p.coords; lat = cds.latitude; lng = cds.longitude; 
    map.setCenter(new g.LatLng(lat, lng)); 
    }, geolocationErrors, {enableHighAccuracy: true}); 
} 
} 
//]]>

來源

2014-04-10 PHPglue

當你說「問題」時，你的意思是沒有看到任何負載？ –

是的，我更新了小提琴。 – PHPglue

你有一堆重命名，只是讓你的代碼難以閱讀的人跳進去。我發現實例化'google.maps.Map'缺少'new'，但你修復了這個問題。我無法發現問題，但使用鼠標滾輪時，在控制檯中出現'未捕獲的RangeError：最大調用堆棧大小超過錯誤'，因爲我正在縮放。 –

你忘了設置中心時，您需要設置初始位置的縮放級別。 :)

new g.Map(m, {zoom: 8, center: new g.LatLng(47.6065495, -122.3328983)})

你是對的，當它是簡單的東西。

來源

2014-04-10 02:00:59

謝謝你。現在我知道這是必需的。我想他們會有一些默認的縮放。 – PHPglue

Google Maps API加載問題。需要技術解釋。應該很容易回答

回答

相關問題