Question

我正在尝试从此页面重新创建代码：http://gmaps-samples.googlecode.com/svn/trunk/markerhider/markerhider.htm 所以我将能够使用xampp localy运行它。现在我创建了2个文件，第一个名为markerdata.xml，其代码如下：

    <markers>
<marker name="The Melting Pot" address="14 Mercer St, Seattle, WA" lat="47.624561" lng="-122.356445" type="restaurant"/>
<marker name="Pan Africa Market" address="1521 1st Ave, Seattle, WA" lat="47.608940" lng="-122.340141" type="restaurant"/>
<marker name="Ipanema Grill" address="1225 1st Ave, Seattle, WA" lat="47.606365" lng="-122.337654" type="restaurant"/>
<marker name="Crab Pot" address="1301 Alaskan Way, Seattle, WA" lat="47.605961" lng="-122.340363" type="restaurant"/>
<marker name="Piroshky Piroshky" address="1908 Pike pl, Seattle, WA" lat="47.610126" lng="-122.342834" type="restaurant"/>
<marker name="Buddha Thai & Bar" address="2222 2nd Ave, Seattle, WA" lat="47.613590" lng="-122.344391" type="bars"/>
<marker name="Sake House" address="2230 1st Ave, Seattle, WA" lat="47.612823" lng="-122.345673" type="bars"/>
<marker name="Mama&apos;s Mexican Kitchen" address="2234 2nd Ave, Seattle, WA" lat="47.613976" lng="-122.345467" type="bars"/>
<marker name="Wingdome" address="1416 E Olive Way, Seattle, WA" lat="47.617214" lng="-122.326584" type="bars"/></markers>

，第二个名为try.php，其中包含以下代码：

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
     <title>Google Maps JavaScript API Example</title>
     <script src="http://maps.google.com/maps?file=api&amp;v=2.x&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxSPW5CJgpdgO_s4yyMovOaVh_KvvhSfpvagV18eOyDWu7VytS6Bi1CWxw"
  type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var iconBlue = new GIcon(); 
iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
iconBlue.iconSize = new GSize(12, 20);
iconBlue.shadowSize = new GSize(22, 20);
iconBlue.iconAnchor = new GPoint(6, 20);
iconBlue.infoWindowAnchor = new GPoint(5, 1);
var iconRed = new GIcon(); 
iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
iconRed.iconSize = new GSize(12, 20);
iconRed.shadowSize = new GSize(22, 20);
iconRed.iconAnchor = new GPoint(6, 20);
iconRed.infoWindowAnchor = new GPoint(5, 1);
var customIcons = [];
customIcons["restaurant"] = iconBlue;
customIcons["bars"] = iconRed;
var markerGroups = { "restaurant": [], "bars": []};
function load() {
  if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("map"));
    map.setCenter(new GLatLng(47.614495, -122.341861), 13);
    GDownloadUrl("markerdata.xml", function(data) {
      var xml = GXml.parse(data);
      var markers = xml.documentElement.getElementsByTagName("marker");
      for (var i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("name");
        var address = markers[i].getAttribute("address");
        var type = markers[i].getAttribute("type");
        var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                parseFloat(markers[i].getAttribute("lng")));
        var marker = createMarker(point, name, address, type);
        map.addOverlay(marker);
      }
    });
  }
}
function createMarker(point, name, address, type) {
  var marker = new GMarker(point, customIcons[type]);
  markerGroups[type].push(marker);
  var html = "<b>" + name + "</b> <br/>" + address;
  GEvent.addListener(marker, 'click', function() {
    marker.openInfoWindowHtml(html);
  });
  return marker;
}
function toggleGroup(type) {
  for (var i = 0; i < markerGroups[type].length; i++) {
    var marker = markerGroups[type][i];
    if (marker.isHidden()) {
      marker.show();
    } else {
      marker.hide();
    }
  } 
}
//]]>
    </script>
    </head>
    <body style="font-family:Arial, sans serif" onload="load()" onunload="GUnload()">
    <div id="map" style="float:left; width: 300px; height: 250px; border: 1px solid black"></div>
   <div id="sidebar" style="float:left; width: 120px; height: 250px; border: 1px solid black">
   <input type="checkbox" id="restaurantCheckbox" onclick="toggleGroup('restaurant')" CHECKED />  
    Restaurants
   <br>
   <input type="checkbox" id="barCheckbox" onclick="toggleGroup('bars')" CHECKED />  
    Bars
    </div>
    </body>
    </html>

使用谷歌浏览器运行此代码我只看到前4个标记和餐厅的复选框工作正常，但我看不到酒吧的标记，如果我改变一个标记的类别从酒吧到餐厅我重新加载它没有在地图上显示的页面时的xml文件。在所有其他浏览器中没有标记显示。任何人都可以看到代码中的任何错误？

如何从谷歌地图的xml文件中加载标记

0 个答案: