纬度和经度作为坐标适合于多边形算法中的点

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
    <title></title> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBfaExFhABnh7I3-vTHJjA4TWqtYnMccKE&sensor=false"></script> 
    <script type="text/javascript" src="http://www.the-di-lab.com/polygon/jquery-1.4.2.min.js"></script> 


<script type="text/javascript"> 
    var map; 
    var boundaryPolygon; 
    function initialize() { 

     google.maps.Polygon.prototype.Contains = function (point) { 
      // ray casting alogrithm http://rosettacode.org/wiki/Ray-casting_algorithm 
      var crossings = 0, 
      path = this.getPath(); 

      // for each edge 
      for (var i = 0; i < path.getLength(); i++) { 
       var a = path.getAt(i), 
       j = i + 1; 
       if (j >= path.getLength()) { 
        j = 0; 
       } 
       var b = path.getAt(j); 
       if (rayCrossesSegment(point, a, b)) { 
        crossings++; 
       } 
      } 

      // odd number of crossings? 
      return (crossings % 2 == 1); 

      function rayCrossesSegment(point, a, b) { 
       var px = point.lng(), 
       py = point.lat(), 
       ax = a.lng(), 
       ay = a.lat(), 
       bx = b.lng(), 
       by = b.lat(); 
       if (ay > by) { 
        ax = b.lng(); 
        ay = b.lat(); 
        bx = a.lng(); 
        by = a.lat(); 
       } 
       if (py == ay || py == by) py += 0.00000001; 
       if ((py > by || py < ay) || (px > Math.max(ax, bx))) return false; 
       if (px < Math.min(ax, bx)) return true; 

       var red = (ax != bx) ? ((by - ay)/(bx - ax)) : Infinity; 
       var blue = (ax != px) ? ((py - ay)/(px - ax)) : Infinity; 
       return (blue >= red); 
      } 
     }; 


     var mapProp = { 
      center: new google.maps.LatLng(37.684, -122.591), 
      zoom: 10, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     map = new google.maps.Map(document.getElementById("googleMap"), mapProp); 



     google.maps.event.addListener(map, 'click', function (event) { 
      if (boundaryPolygon!=null && boundaryPolygon.Contains(event.latLng)) { 
       alert(event.latLng + " is inside the polygon"); 
      } else { 
       alert(event.latLng + " is outside the polygon"); 
      } 

     }); 
    } 


    function btnCheckPointExistence_onclick() { 
     var latitude = document.getElementById('txtLattitude').value; 
     var longitude = document.getElementById('txtLongitude').value; 
     //alert(latitude);  alert(longitude) 
     var myPoint = new google.maps.LatLng(latitude, longitude); 

     if (boundaryPolygon == null) { 
      alert("No Polygon"); 
     } 
     else { 

      if (boundaryPolygon.Contains(myPoint)) { 
       alert(myPoint + "is inside the polygon."); 
      } else { 
       alert(myPoint + "is outside the polygon."); 
      } 
     } 
    } 


    function drawPolygon() { 

     initialize(); 
     var boundary = '77.702866 28.987153, 77.699776 28.978594 ,77.735996 28.974164 ,77.719946 28.99346 ,77.713423 28.994361 ,77.711706 28.990382 '; 
     var boundarydata = new Array(); 
     var latlongs = boundary.split(","); 

     for (var i = 0; i < latlongs.length; i++) { 
      latlong = latlongs[i].trim().split(" "); 
      boundarydata[i] = new google.maps.LatLng(latlong[1], latlong[0]); 
     } 

     boundaryPolygon = new google.maps.Polygon({ 
      path: boundarydata, 
      strokeColor: "#0000FF", 
      strokeOpacity: 0.8, 
      strokeWeight: 2, 
      fillColor: 'Red', 
      fillOpacity: 0.4 

     }); 

     google.maps.event.addListener(boundaryPolygon, 'click', function (event) { 

      if (boundaryPolygon.Contains(event.latLng)) { 
       alert(event.latLng + "is inside the polygon."); 
      } else { 
       alert(event.latLng + "is outside the polygon."); 
      } 

     }); 

     map.setZoom(14); 
     map.setCenter(boundarydata[0]); 
     boundaryPolygon.setMap(map); 

    } 



    </script> 
</head> 
<body onload="initialize();drawPolygon();"> 
    <form id="form1" runat="server"> 

     <input type="text" value="28.982005022927137" name="txtLattitude" id="txtLattitude" placeholder="Enter Latitude"> 
     <input type="text" value="77.72157669067383" name="txtLongitude" id="txtLongitude" placeholder="Enter Langitude"> 
     <input type="button" value="Submit" name="submit" id="submit-text" value="submit" onclick="btnCheckPointExistence_onclick();"> 


     <h3>Check If Point Exist in a Polygon</h3> 
     <span id="spnMsg" style="font-family: Arial; text-align: center; font-size: 14px; color: red;">this is message</span> 
     <br /> 
     <br /> 

     <div id="googleMap" style="width: auto; height: 500px;"> 
     </div> 

    </form> 
</body> 
</html>

您可以查看Demo here

来源

2014-04-22 04:58:57 sandipshirsale

纬度和经度作为坐标适合于多边形算法中的点

回答

相关问题