0

我正在尝试从 econym 调整一些 Google 地图 API 代码以满足某些需求:我需要将点击事件更改为 onmouseover,这可能吗?这是原始代码,我试图简单地将“点击”侦听器更改为鼠标悬停,但什么也没发生。

<?php
include("dbinfo.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1    /DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=<?php echo $key; ?>" type="text/javascript"></script>
</head>
<body onunload="GUnload()">


<div id="map" style="width: 800px; height: 600px"></div>
<a href="inside.htm">Back to the tutorial page</a>



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

if (GBrowserIsCompatible()) {

  var polys = [];
  var labels = [];


  // === A method for testing if a point is inside a polygon
  // === Returns true if poly contains point
  // === Algorithm shamelessly stolen from http://alienryderflex.com/polygon/ 
  GPolygon.prototype.Contains = function(point) {
    var j=0;
    var oddNodes = false;
    var x = point.lng();
    var y = point.lat();
    for (var i=0; i < this.getVertexCount(); i++) {
      j++;
      if (j == this.getVertexCount()) {j = 0;}
      if (((this.getVertex(i).lat() < y) && (this.getVertex(j).lat() >= y))
      || ((this.getVertex(j).lat() < y) && (this.getVertex(i).lat() >= y))) {
        if ( this.getVertex(i).lng() + (y - this.getVertex(i).lat())
        /  (this.getVertex(j).lat()-this.getVertex(i).lat())
        *  (this.getVertex(j).lng() - this.getVertex(i).lng())<x ) {
          oddNodes = !oddNodes
        }
      }
    }
    return oddNodes;
  }



  // Display the map, with some controls and set the initial location 
  var map = new GMap2(document.getElementById("map"));
  map.addControl(new GLargeMapControl());
  map.addControl(new GMapTypeControl());
  map.setCenter(new GLatLng(42.16,-100.72),4);


  GEvent.addListener(map, "click", function(overlay,point) {
    if (!overlay) {
      for (var i=0; i<polys.length; i++) {
        if (polys[i].Contains(point)) {
          map.openInfoWindowHtml(point,"You clicked on "+labels[i]);
          //i = 999; // Jump out of loop
        }
      }
    }
  });


  // Read the data from states.xml

  var request = GXmlHttp.create();
  request.open("GET", "states.xml", true);
  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      var xmlDoc = GXml.parse(request.responseText);

      // ========= Now process the polylines ===========
      var states = xmlDoc.documentElement.getElementsByTagName("state");

      // read each line
      for (var a = 0; a < states.length; a++) {
        // get any state attributes
        var label  = states[a].getAttribute("name");
        var colour = states[a].getAttribute("colour");
        // read each point on that line
        var points = states[a].getElementsByTagName("point");
        var pts = [];
        for (var i = 0; i < points.length; i++) {
           pts[i] = new GLatLng(parseFloat(points[i].getAttribute("lat")),
                               parseFloat(points[i].getAttribute("lng")));
        }
        var poly = new GPolygon(pts,"#000000",1,1,colour,0.5,{clickable:false});
        polys.push(poly);
        labels.push(label);
        map.addOverlay(poly);
      }
      // ================================================           
    }
  }
  request.send(null);

}

// display a warning if the browser was not compatible
else {
  alert("Sorry, the Google Maps API is not compatible with this browser");
}

// This Javascript is based on code provided by the
// Community Church Javascript Team
// http://www.bisphamchurch.org.uk/   
// http://econym.org.uk/gmap/

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

</html>
4

0 回答 0