turf 计算经纬度是否在图层

下载 turf

npm install @turf/turf

pnpm install  @turf/turf

yarn add  @turf/turf

 页面引入

import * as turf from '@turf/turf'

一区十园: 一项数据格式(有多项)

  {
    name: '一汽-大众华北基地',
    geojson: {
      type: 'FeatureCollection',
      name: '0',
      crs: { type: 'name', properties: { name: 'urn:ogc:def:crs:EPSG::4490' } },
      features: [
        {
          type: 'Feature',
          properties: {
            OBJECTID: 7,
            QYMC: '一汽-大众华北基地',
            MJ: 8.77,
            Shape_Leng: 0.15103254348,
            Shape_Area: 0.00091490631,
          },
          geometry: {
            type: 'Polygon',
            coordinates: [
              [
                [117.572054703961498, 39.238669666272131],
                [117.577684934811941, 39.229866814302113],
                [117.577851235646108, 39.229599559172357],
                [117.578010070308551, 39.22932957100295],
                [117.578161363256413, 39.229056976598258],
                [117.578305043443038, 39.228781900964009],
                [117.578441046117405, 39.22850447450196],
                [117.57856930472974, 39.228224827613758],
                [117.578689762622503, 39.227943088902464],
                [117.578802361339967, 39.227659390568476],
                [117.578907049620739, 39.227373866610719],
                [117.579003778002061, 39.227086648330214],
                [117.579092500618458, 39.226797871524582],
                [117.579173177000598, 39.226507671092179],
                [117.515807774808991, 39.225219483992021],
                [117.515883511215179, 39.24194550528091],
                [117.536880961487213, 39.242266514687969],
                [117.537632614853351, 39.242274394547735],
                [117.538384336567901, 39.242275188649103],
                [117.539136013316465, 39.242268897891392],
                [117.539887538079483, 39.242255522274604],
                [117.540638798441819, 39.242235064496697],
                [117.541389683786974, 39.24220752725563],
                [117.542140085296751, 39.242172913249419],
                [117.542889891455388, 39.242131229672566],
                [117.543638991646162, 39.242082481921045],
                [117.543962464296328, 39.242056417769504],
                [117.544284897330158, 39.242023473804352],
                [117.544606048830133, 39.241983674307164],
                [117.544925676878506, 39.24193704895572],
                [117.545243544054415, 39.241883632823431],
                [117.545559409339376, 39.241823466379913],
                [117.545873036211674, 39.241756595490529],
                [117.546184189948463, 39.241683069618034],
                [117.546492636725816, 39.24160294182235],
                [117.546798143619526, 39.241516275955405],
                [117.547100484000225, 39.24142313407043],
                [117.54739943033951, 39.241323588113175],
                [117.547694756008241, 39.241217711827971],
                [117.547983993266712, 39.241114127015408],
                [117.548276870980885, 39.241016923792074],
                [117.548573155326949, 39.240926180398958],
                [117.548872611581828, 39.240841966983226],
                [117.549175000525906, 39.240764352792723],
                [117.54948008383883, 39.240693397182611],
                [117.549787616005688, 39.24062915770952],
                [117.550097356008223, 39.240571685634848],
                [117.550409055633509, 39.240521025924636],
                [117.55072246756788, 39.24047721994782],
                [117.551037343598637, 39.240440300979174],
                [117.551353431915459, 39.240410298696361],
                [117.551670482506779, 39.240387239179825],
                [117.551988242663356, 39.240371137717887],
                [117.552306458776116, 39.240362009599096],
                [117.552624880833605, 39.240359860219428],
                [117.552943255227092, 39.240364692276785],
                [117.553261325649714, 39.240376500375248],
                [117.553578842989282, 39.24039527821958],
                [117.553895553636949, 39.240421007823329],
                [117.554211205782622, 39.240453670300724],
                [117.554537347620567, 39.240487479413673],
                [117.554864567745653, 39.240514247734382],
                [117.555192617945067, 39.240533951880423],
                [117.555521244609849, 39.240546580160583],
                [117.55585019503053, 39.240552120883706],
                [117.556179216497753, 39.240550569553193],
                [117.556508055402446, 39.240541929766323],
                [117.556836460834006, 39.240526205120318],
                [117.557164178284211, 39.240503408205768],
                [117.557490958640869, 39.240473557908444],
                [117.557816549194399, 39.24043667671134],
                [117.561895458508616, 39.239929579586487],
                [117.562419570806583, 39.239868024589725],
                [117.562944974530978, 39.239813534666951],
                [117.563471512300566, 39.239766125106655],
                [117.563999025834391, 39.239725812096594],
                [117.564527356852068, 39.239692604630079],
                [117.565056348871508, 39.239666515297472],
                [117.565585841813231, 39.239647551293501],
                [117.566115677396624, 39.239635718014028],
                [117.56664569644181, 39.239631018157013],
                [117.56664569644181, 39.239631018157013],
                [117.567137477212896, 39.239633039832995],
                [117.567629150964649, 39.239641202979215],
                [117.568120595389246, 39.239655507595671],
                [117.568611679185665, 39.239675947387127],
                [117.569102278247556, 39.239702517856983],
                [117.569592264871176, 39.239735213609265],
                [117.569741707014259, 39.239742609633765],
                [117.569891452228831, 39.239743007134109],
                [117.570040955525769, 39.239736406110296],
                [117.570189678211136, 39.239722828146057],
                [117.570337082490482, 39.23970232270409],
                [117.570482635964936, 39.239674965327424],
                [117.570625811631999, 39.23964085494157],
                [117.570766091482028, 39.239600113854237],
                [117.570902970096085, 39.239552888654941],
                [117.571035949249676, 39.239499352912844],
                [117.571164552302321, 39.23943969728424],
                [117.571288309807755, 39.239374139405072],
                [117.571406777500897, 39.239302914897678],
                [117.571519524606401, 39.239226282766765],
                [117.571626145530217, 39.239144519104343],
                [117.571726253563838, 39.239057919787228],
                [117.571819488078972, 39.23896679777954],
                [117.571905510031343, 39.238871482233151],
                [117.571984010953429, 39.238772319387067],
                [117.572054703961498, 39.238669666272131],
              ],
            ],
          },
        },
      ],
    },
  },

 计算坐标是否在图层内 

基本使用

 

 循环判断一个坐标点是否在多个图层内 的一个图层

/* eslint-disable no-undef */
/**
 *
 * @param {*} lonlatArray 经纬度 [lng, lat]
 * @returns 查询的经纬度是否在一区十园内如果是返回name 不是 undefined
 */
export const filterCoordinatePointHandler = (lonlatArray) => {
  const yqsy = window.QUERYSTATS_QUICKSCOPE
  const point = turf.point(lonlatArray)
  for (let i = 0; i < yqsy.length; i++) {
    if (yqsy[i].geojson.hasOwnProperty('features') && Array.isArray(yqsy[i].geojson.features)) {
      const polygon = turf.polygon(yqsy[i].geojson.features[0].geometry.coordinates)
      const isInside = turf.booleanPointInPolygon(point, polygon)
      if (isInside) return yqsy[i].name
    }
  }
}

 页面中使用

import { filterCoordinatePointHandler } from '@/utils/util/filterCoordinatePoint'

获取到坐标点传给封装好的函数内 数据格式 => [ lng, lat ] 

如果循环中找到了为 true 的那一个图层 则返回相应图层的 名字

如果坐标点不在图层内则提示 “您选择的区域不在范围内请重新选择”

 实现效果

不在图层内

在图层内