未顯示與信息框PHP/SQL

谷歌地圖API V3我卡上，當我試圖使用與谷歌API V3 PHP/SQL數據庫自定義信息框當前的問題。我很難弄清楚我弄亂了什麼，div顯示空白而不是有地圖。任何幫助都會令人敬畏！未顯示與信息框PHP/SQL

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/src/infobox.js"></script> 
<script type="text/javascript"> 

var customIcons = { 
    Clinic: { 
    icon: 'icon_2.png', 
    }, 
    Secondary: { 
    icon: 'icon_1.png', 
    } 
}; 

function initialize() { 
    var map = new google.maps.Map(document.getElementById("map_canvas"), { 
     center: new google.maps.LatLng(47.6145, -122.3418), 
     zoom: 13, 
     scrollwheel: false, 
     mapTypeId: 'roadmap' 
    }); 


    downloadUrl("xml.php", function(data) { 
     function createMarker(markerXML) { 
      var name = markerXML.getAttribute("name"), 
       postid = markers [i].getAttribute("post_id"), 
       address = markers[i].getAttribute("address"), 
       phone = markers[i].getAttribute("phone"),   
       listtype = markers[i].getAttribute("type"), 
       monday = markers[i].getAttribute("monday"), 
       tuesday = markers[i].getAttribute("tuesday"), 
       wednesday = markers[i].getAttribute("wednesday"), 
       thursday = markers[i].getAttribute("thursday"), 
       friday = markers[i].getAttribute("friday"), 
       saturday = markers[i].getAttribute("saturday"), 
       sunday = markers[i].getAttribute("sunday"), 
       type = markers[i].getAttribute("type"), 
       point = new google.maps.LatLng(
       lat = parseFloat(markerXML.getAttribute("lat")), 
       lng = parseFloat(markerXML.getAttribute("lng")), 


       icon = customIcons[type] || {}, 

       marker = new google.maps.Marker({ 
        map: map, 
        position: new google.maps.LatLng(lat, lng), 
        icon: icon.icon, 
       }), 

       boxText = document.createElement("div"); 

      boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px;"; 
      boxText.innerHTML = "<b>" + name + "</b> <br/> <i>" + listtype + "</i> <br/>" + address + "<br/>" + phone + "<br/>" + monday + tuesday + wednesday + thursday + friday + saturday + sunday; 

      var myOptions = { 
       content: boxText, 
       disableAutoPan: false, 
       maxWidth: 0, 
       pixelOffset: new google.maps.Size(-140, 0), 
       zIndex: null, 
       boxStyle: { 
        background: "url('tipbox.gif') no-repeat", 
        opacity: 0.75, 
        width: "280px" 
       }, 
       closeBoxMargin: "10px 2px 2px 2px", 
       closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif", 
       infoBoxClearance: new google.maps.Size(1, 1), 
       isHidden: false, 
       pane: "floatPane", 
       enableEventPropagation: false 
      }; 

      var infoBox = new InfoBox(myOptions); 

      google.maps.event.addListener(marker, 'click', function() { 
        infoBox.open(map, marker); 
       } 
      }); 
     } 

     var xml = data.responseXML, 
      markers = xml.documentElement.getElementsByTagName("marker"), 
      numMarkers = markers.length; 

     for (var i = 0; i < numMarkers; i++) { 
      createMarker(markers[i]); 
     } 
    }); 
} 

function downloadUrl(url, callback) { 
    var request = window.ActiveXObject ? 
     new ActiveXObject('Microsoft.XMLHTTP') : 
     new XMLHttpRequest; 

    request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
     request.onreadystatechange = doNothing; 
     callback(request, request.status); 
    } 
    }; 

    request.open('GET', url, true); 
    request.send(null); 
} 

function doNothing() {} 

</script>

<div id="map_canvas" style="width: 500px; height: 300px"></div>

來源

2012-08-23 espnicholas

看看JavaScript控制檯和解決您發現有錯誤。只是評論dowloadUrl電話應該讓你回到你的地圖。

你沒有提供你的xml的樣本，但第二步（修復你的javascript錯誤之後）是在你的瀏覽器中打開xml提要，看它是否有效（或者你可以通過XML驗證）

This article（它看起來像你可能已經開始），還提供了一些調試建議。

working version

來源

2012-08-23 02:39:56 geocodezip

是的，如果你還停留告訴我們您的JavaScript錯誤。 –

明白了，謝謝大家的幫助！ – espnicholas

在您的代碼geocodezip，完美的工作。我必須切換var xml = xmlParse（data）;到var xml = data.responseXML; – espnicholas

未顯示與信息框PHP/SQL

回答

相關問題