Question

我真的很感谢你的帮助。

带有一些临时密钥的html v2文件工作正常。我从一些XML获取位置，创建不同颜色的标记，并从Info Window中的XML属性添加一些URL（不是太复杂）。现在我需要将其迁移到v3。我找到了v2中函数的等价物，但我找不到GDownloadUrl（用于加载XML）和GIcon（G_DEFAULT_ICON）;有人可以看看我的两个代码并告诉我如何更改以使其在v3中也能正常工作。我改变了大部分的事情，所以如果有人能看到一些错误，我会感激不尽。提前致谢。

第2版：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <title>Google Maps</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=AIzaSyA4UDNP6MZ" type="text/javascript"></script>
  </head>
  <body onunload="GUenter code herenload()">

    <!-- you can use tables or divs for the overall layout -->
    <table border=1>
      <tr>
        <td>
           <div id="map" style="width: 1250px; height: 1250px"></div>
        </td>
      </tr>
    </table>


    <script type="text/javascript">
    //<![CDATA[

    if (GBrowserIsCompatible()) {

      var gmarkers = [];

      // A function to create the marker and set up the event window
      function createMarker(point,name,alarm,markerOptions) {
        var marker = new GMarker(point,markerOptions);
        GEvent.addListener(marker, "click", function() {


        var alarmanchor1='<span class="url"><a href="' + alarm;
        var alarmanchor2='" title="www" target="_blank">Event List</a></span>';
        var alarmanchor=alarmanchor1+alarmanchor2;


        marker.openInfoWindowHtml(alarmanchor);
        });

        return marker;
      }


      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }


      // create the map
      var map = new GMap2(document.getElementById("map"));
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
      map.setCenter(new GLatLng( 41.932797,21.483765), 10);


      // Read the data from alarms33.xml
      GDownloadUrl("alarms33.xml", function(doc) {
        var xmlDoc = GXml.parse(doc);
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");

        for (var i = 0; i < markers.length; i++) {
          // obtain the attribues of each marker
          var lat = parseFloat(markers[i].getAttribute("lat"));
          var lng = parseFloat(markers[i].getAttribute("lng"));
          var point = new GLatLng(lat,lng);
          var alarm = markers[i].getAttribute("alarm");
          var label = markers[i].getAttribute("label");




        var severity = parseFloat(markers[i].getAttribute("severity"));
        var severityIcon = new GIcon(G_DEFAULT_ICON);
        var color;
        if (severity == 0) color = "66FF33";
        else if (severity == 1) color = "990099";
        else if (severity == 2) color = "00CCFF";
        else if (severity == 3) color = "FFFF00";
        else if (severity == 4) color = "FFCC00";
        else if (severity == 5) color = "FF3300";
        else color = "yellow";

        severityIcon.image = "http://www.googlemapsmarkers.com/v1/" + color;
        severityIcon.iconSize = new GSize(15, 30);

        markerOptions = { icon:severityIcon };




          // create the marker
          var marker = createMarker(point,label,alarm,markerOptions);
          map.addOverlay(marker);
        }

      });
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }



    //]]>
    </script>
  </body>

</html>

第3版：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <title>Google Maps</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=3&amp;sensor=false&amp;key=AIzaSyDsa1LyWOQ" type="text/javascript"></script>
  </head>
  <body onunload="initialize()">

    <!-- you can use tables or divs for the overall layout -->
    <table border=1>
      <tr>
        <td>
           <div id="map" style="width: 1250px; height: 1250px"></div>
        </td>
      </tr>
    </table>






    <script type="text/javascript">
    //<![CDATA[


      var gmarkers = [];

      // A function to create the marker and set up the event window
      function createMarker(point,name,alarm,markerOptions) {
        var marker = new google.maps.Marker(point,markerOptions);
        google.maps.event.addListener(marker, "click", function() {


        var alarmanchor1='<span class="url"><a href="' + alarm;
        var alarmanchor2='" title="www.skolaznanja.com" target="_blank">Event List</a></span>';
        var alarmanchor=alarmanchor1+alarmanchor2;



        var infoWindow=new google.maps.InfoWindow();
        infoWindow.setContent(alarmanchor);
        infowindow.open(map,marker);

        });

        return marker;
      }


      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        google.maps.event.trigger(gmarkers[i], "click");
      }


      // create the map

      function initialize() {
      var mapDiv = document.getElementById("map");
      var map;
      var myLatlng = new google.maps.LatLng(41.932797,21.483765);
      var myOptions = {
       zoom:10,
      center:myLatlng,
      mapTypeId:google.maps.MapTypeId.ROADMAP
      };
      map = new google.maps.Map(mapDiv, myOptions);

     } 

      //var map = new google.maps.Map(document.getElementById("map"));
      //map.addControl(new GLargeMapControl());
      //map.addControl(new GMapTypeControl());
      //map.setCenter(new google.maps.LatLng( 41.932797,21.483765), 10);


      // Read the data from example.xml
      GDownloadUrl("alarms44.xml", function(doc) {
        var xmlDoc = GXml.parse(doc);
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");

        for (var i = 0; i < markers.length; i++) {
          // obtain the attribues of each marker
          var lat = parseFloat(markers[i].getAttribute("lat"));
          var lng = parseFloat(markers[i].getAttribute("lng"));
          var point = new google.maps.LatLng(lat,lng);
          var alarm = markers[i].getAttribute("alarm");
          var label = markers[i].getAttribute("label");




        var severity = parseFloat(markers[i].getAttribute("severity"));
        var severityIcon = new GIcon(G_DEFAULT_ICON);
        var color;
        if (severity == 0) color = "66FF33";
        else if (severity == 1) color = "990099";
        else if (severity == 2) color = "00CCFF";
        else if (severity == 3) color = "FFFF00";
        else if (severity == 4) color = "FFCC00";
        else if (severity == 5) color = "FF3300";
        else color = "yellow";

        severityIcon.image = "http://www.googlemapsmarkers.com/v1/" + color;
        severityIcon.iconSize = new GSize(15, 30);

        markerOptions = { icon:severityIcon };




          // create the marker
          var marker = createMarker(point,label,alarm,markerOptions);
          map.setMap(marker);
        }

      });




    //]]>
    </script>
  </body>

</html>

Answer 1

正如您所说，GMaps V3中不再存在GDownloadUrl（）。我建议jQuery.get(url)

我发布了一个示例How to parse xml file for marker locations and plot on map。

更新：正如@ user1191860指出的那样，GMap V3 xmlparsing有一个实用工具。我没有意识到这一点。 AFAIK，没有理由不使用它。你需要添加

<script src="http://gmaps-samples-v3.googlecode.com/svn-history/r28/trunk/xmlparsing/util.js"></script>

到你的html页面。有趣的是，作者还包括jQuery example

将我的HTML Google MAP API版本2迁移到版本3

1 个答案: