기술나눔

Vue 프로젝트 openlayers에서 jst를 사용하여 wkt와 geojson의 교차점 처리 - (geojson 소스 zpi 분석)

2024-07-11

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Vue 프로젝트 openlayers에서 jst를 사용하여 wkt와 geojson의 교차점 처리 - (geojson 소스 zpi 분석)

압축된 패키지의 모양을 읽고 이전 메모를 읽으십시오Vue 프로젝트는 zip의 ShapeFile 파일을 읽고 이를 GeoJson으로 구문 분석합니다.

Openlayers는 jsts 공식 예제를 사용합니다.https://openlayers.org/en/최신/예제/jsts.html

jsts 공식 코드 주소:https://github.com/bjornharrtell/jsts

Shape에서 읽은 geojson 형식은 다음과 같습니다.
여기에 이미지 설명을 삽입하세요.
경계의 좌표점은 일부만 있습니다. 다음 방법은 geojson과 wkt를 교차한 다음 이를 wkt 반환으로 변환하는 것입니다.


import { Component, Emit, Vue } from 'vue-property-decorator';
import { mapGetters, mapMutations } from 'vuex';

import WKT from 'ol/format/WKT';
// eslint-disable-next-line import/extensions
import * as jsts from 'jsts/dist/jsts.min.js';
import {
  Geometry,
  GeometryCollection, LinearRing, LineString, MultiLineString, MultiPoint, Point,
} from 'ol/geom';
import Polygon from 'ol/geom/Polygon';
import MultiPolygon from 'ol/geom/MultiPolygon';

@Component({
  name: 'MapMxins',
  computed: {
    ...mapGetters('map', [
      'getDrawingType',
    ]),
  },
  methods: {
    ...mapMutations('map', [
      'updateDrawingType',
    ]),
  },
})
export default class MapMxins extends Vue {
  getDrawingType;
  
  updateDrawingType;
  
  /**
   * 处理工作区范围-如果上传了shpe
   *
   * @params xzqData: 行政区数据
   * @params geojson:工作区范围数据
   * 用工作区范围和行政区范围做相交处理,保留交集就是最后的范围
   * return: {
   *  geom: 工作区范围和行政区相交的geom,如果没有相交或者工作区范围无效则返回行政区geom
   *  isValid: 工作区范围是否有效
   * }
   */
  hansleWorkspace(xzqData, geojson) {
    // console.log('处理工作区范围-如果上传了shpe:', xzqData, geojson);
    const xzqGeom = xzqData.geom; // 行政区geom
    const format = new WKT();
    const parser = new jsts.io.OL3Parser();
    parser.inject(
      Point,
      LineString,
      LinearRing,
      Polygon,
      MultiPoint,
      MultiLineString,
      MultiPolygon,
      GeometryCollection,
    );

    // eslint-disable-next-line consistent-return
    return new Promise((resolve) =