点 "inside" 个多边形

Question

我正在尝试使用 turf-inside() function of turf.js and leafletjs。我已经用一个 geojson 点和一个多边形准备了基本示例，但我不能对两个以上的多边形 (geojson) 做同样的事情。有什么想法吗？

<!DOCTYPE html>
<html>
<head>

    <title>Mobile tutorial - Leaflet</title>

    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />

    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.1/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet@1.0.1/dist/leaflet.js"></script>
    <script src='https://api.mapbox.com/mapbox.js/plugins/turf/v2.0.2/turf.min.js'></script>

    <style>
        #map {
            width: 600px;
            height: 400px;
        }
    </style>

    <style>body { padding: 0; margin: 0; } html, body, #map { height: 100vh; width: 100vw; }</style>
</head>
<body>

<div id='map'></div>

<script>

var pt1 = {
    "type" : "Feature",
    "properties" : {
        "marker-color" : "#f00"
    },
    "geometry" : {
        "type" : "Point",
        "coordinates" : [15.853271484375, 52.649729197309426]  //   19.16015625,52.119998657638156

    }
};

        var poly = {
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "properties": {},
      "geometry": {
        "type": "Polygon",
        "coordinates": [
          [
            [
              13.842773437499998,
              50.42951794712287
            ],
            [
              13.842773437499998,
              54.213861000644926
            ],
            [
              16.89697265625,
              54.213861000644926
            ],
            [
              16.89697265625,
              50.42951794712287
            ],
            [
              13.842773437499998,
              50.42951794712287
            ]
          ]
        ]
      }
    },
    {
      "type": "Feature",
      "properties": {},
      "geometry": {
        "type": "Polygon",
        "coordinates": [
          [
            [
              19.094238281249996,
              52.669720383688166
            ],
            [
              18.544921875,
              52.16045455774706
            ],
            [
              18.43505859375,
              51.08282186160978
            ],
            [
              20.06103515625,
              50.65294336725709
            ],
            [
              20.80810546875,
              51.467696956223364
            ],
            [
              20.830078125,
              52.29504228453735
            ],
            [
              19.094238281249996,
              52.669720383688166
            ]
          ]
        ]
      }
    }
  ]
};

        var features = {"type" : "FeatureCollection", "features" : [pt1, poly]};

        //=features

        var isInside1 = turf.inside(pt1, poly);
        //=isInside1


        console.log(isInside1)



    var map = L.map('map').fitWorld().setView([52.119998657638156, 19.16015625], 6); 
    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw', {
        maxZoom: 18,
        attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
            '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
            'Imagery © <a href="http://mapbox.com">Mapbox</a>',
        id: 'mapbox.streets'
    }).addTo(map);

    L.geoJSON(poly).addTo(map);
    L.geoJSON(pt1).addTo(map);

</script>



</body>
</html>

Answer 1

关于文档，无法直接将 featureCollection 作为参数添加到 turf-inside() 中。 turf-inside() 需要多边形或多边形。但是您可以编写自己的小函数来检查一个点是否在您的 featureCollection 中，如下所示：

function checkIsInside(poly) {
  for(poly of poly.features) {
    var isInside = turf.inside(pt1, poly);
    if(isInside) {
      return true
    } else {
      return false
    }
  } 
};

我在这里创建了一个 JS FIDDLE 如果该点位于您的特征集合中的某些多边形中，它将发出 true 或 false 警报。

点 "inside" 个多边形

Point "inside" many polygons

javascript

leaflet

turfjs