XML/KML 之外的 JavaScript 解析 - Geoxml3答案

【问题标题】：JavaScript Parsing Outside XML/KML - Geoxml3XML/KML 之外的 JavaScript 解析 - Geoxml3
【发布时间】：2013-09-16 17:08:48
【问题描述】：

我已经实现了一个将KML解析成谷歌地图的脚本，如described here.还有一个working sample here.

这在 Safari 和 IE 中运行良好，但在我的安装（仍然是本地）和演示站点上的 Firefox 或 Chrome 中没有任何反应。日志中唯一的内容是：

--[13:07:38.076] "Unable to retrieve station.kml"

有人可以看看这个并提供一些启示吗？我的 JavaScript 不够熟练，无法弄清楚发生了什么。

谢谢！

更新：这是我的实际代码。

<!DOCTYPE html>
<html class="no-js" lang="en"> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Where Are Our Alumni?</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">

    <style type="text/css">
    body, html {
      height: 100%;
      width: 100%;
      margin: 0;
      padding: 0; 
    }

    div#map-canvas {
      width: 100%; height: 100%;
    }
    </style>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="geoxml3.js"></script>
    <script src="markerclusterer.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>


    <script type="text/javascript" charset="utf-8">
      $(document).ready(function(){
    var myOptions = {
          center: new google.maps.LatLng(41.8813571,-87.6294174),
          zoom: 3,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var mcOptions = {gridSize: 50, maxZoom: 15};
        var weather_url = "http://api.wunderground.com/api/6d9cb153ba3be6c0/conditions/forecast/q/";
        var count = 0;
        markers = [];
        var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);
        markerclusterer  = new MarkerClusterer(map, [], mcOptions);
        var infoWindow = new google.maps.InfoWindow({maxWidth:800});
        var myParser = new geoXML3.parser({
        map: map, singleInfoWindow:true,
        createMarker:function(placemark){
                if (placemark.point.lat != '0') {
                var point = new google.maps.LatLng(placemark.point.lat, placemark.point.lng);
                var marker = new google.maps.Marker({position:point});
                markers.push(marker);

                google.maps.event.addListener(marker, "click", function(){
                    var marker_lat = marker.getPosition().lat();
                    var marker_lng = marker.getPosition().lng();
                    var request_url = weather_url + (marker_lat + "," + marker_lng);
                    infoWindow.close(); 
                    infoWindow.setOptions({maxWidth:800});
                    content = ("<div><strong>" + placemark.name + "</strong><br>");
                    content += (placemark.description + "</div>");
                    infoWindow.setContent(content);
                    infoWindow.open(map, marker);


                });
                markerclusterer.addMarker(marker);
        }
    }
    });
        myParser.parse('alumni.kml');
      });

      function clickMarker(i){
             google.maps.event.trigger(markers[i], "click");
      }
    </script>
</head>
<body>

    <div id="map-canvas"></div>


</body>
</html>

geoxml3.js 脚本是导致错误的原因，available from here.

【问题讨论】：

指向外部网站的链接最终会消失。请发布实际代码。
你应该调试你的脚本来看看为什么会这样 - 查看 AJAX 请求的状态以查看它失败的原因，或者尝试从中获取一些被忽略的错误消息？
你的 kml 叫什么名字？您发布的代码加载“alumni.kml”，您发布的链接试图加载“station.kml”，“station.kml”是否真的存在于那个位置？

标签： javascript xml parsing geoxml3

【解决方案1】：

您使用的似乎是旧版本的geoxml3。您应该使用polys branch 的最新版本，除非您需要KMZ 支持，在这种情况下，请使用kmz branch 的最新版本。

Working example of clustered markers from KML with geoxml3

【讨论】：