Javascript Google Maps多边形包含位置True False_Javascript_Html_Google Maps_Google Maps Api 3_Polygon

Javascript Google Maps多边形包含位置True False

javascript html google-maps google-maps-api-3

Javascript Google Maps多边形包含位置True False,javascript,html,google-maps,google-maps-api-3,polygon,Javascript,Html,Google Maps,Google Maps Api 3,Polygon,我使用Javascript+HTLM显示用户位置，并在谷歌地图API上创建了多边形。我的问题是创建显示“用户在多边形中”和“用户不在多边形中”的标签/文本框。如果单击的点位于多边形中，此示例代码将创建一个红点，如果单击的点位于多边形外，则创建一个绿点。我希望在文本框中显示“多边形内”和“多边形外”，而不是红点和绿点，然后将其记录到数据库中 <!DOCTYPE html> <html> <head> <meta name="viewpo

我使用Javascript+HTLM显示用户位置，并在谷歌地图API上创建了多边形。我的问题是创建显示“用户在多边形中”和“用户不在多边形中”的标签/文本框。如果单击的点位于多边形中，此示例代码将创建一个红点，如果单击的点位于多边形外，则创建一个绿点。我希望在文本框中显示“多边形内”和“多边形外”，而不是红点和绿点，然后将其记录到数据库中

    <!DOCTYPE html>
    <html>
  <head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Polygon arrays</title>
<style>
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  #map {
    height: 100%;
  }
  </style>
</head>
<body>
<div id="map"></div>
<script>

 function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 24.886, lng: -70.269},
zoom: 5,
 });

var triangleCoords = [
 {lat: 25.774, lng: -80.19},
 {lat: 18.466, lng: -66.118},
 {lat: 32.321, lng: -64.757}
 ];

 var bermudaTriangle = new google.maps.Polygon({paths: triangleCoords});

 google.maps.event.addListener(map, 'click', function(e) {
  var resultColor =
    google.maps.geometry.poly.containsLocation(e.latLng, bermudaTriangle) ?
    'red' :
    'green';

new google.maps.Marker({
  position: e.latLng,
  map: map,
  icon: {
    path: google.maps.SymbolPath.CIRCLE,
    fillColor: resultColor,
    fillOpacity: .2,
    strokeColor: 'white',
    strokeWeight: .5,
    scale: 10
  }
});
 });
 }

</script>
<script src="https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY&signed_in=true&libraries=geometry&callback=initMap"
     async defer></script>
</body>
</html>

非常感谢您在这里提供的所有帮助。

我有一个名为Label1的标签，并使用此代码，如果点位于多边形中，则在标签中写入true；如果点位于多边形外，则在标签中写入false

     var bermudaTriangle = new google.maps.Polygon({paths: triangleCoords});

      google.maps.event.addListener(map, 'click', function (event) {
    document.getElementById("Label1").innerHTML =google.maps.geometry.poly.containsLocation(event.latLng, bermudaTriangle);
        });

HTML中没有文本框。你是如何尝试将文本放入文本框的？你打算把它放在哪个文本框里？我刚在地图下面放了一个标签，我想让它显示结果。

     var bermudaTriangle = new google.maps.Polygon({paths: triangleCoords});

      google.maps.event.addListener(map, 'click', function (event) {
    document.getElementById("Label1").innerHTML =google.maps.geometry.poly.containsLocation(event.latLng, bermudaTriangle);
        });