Compartir tecnología

Uso de jsts en las capas abiertas del proyecto Vue para manejar la intersección de wkt y geojson - (análisis zpi fuente geojson)

2024-07-11

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

Uso de jsts en las capas abiertas del proyecto Vue para manejar la intersección de wkt y geojson - (análisis zpi fuente geojson)

Lea la forma en el paquete comprimido y lea la nota anterior.El proyecto Vue lee el archivo ShapeFile en el zip y lo analiza en GeoJson

Openlayers usa el ejemplo oficial de jstshttps://openlayers.org/es/latest/examples/jsts.html

Dirección del código oficial de jsts:https://github.com/bjornharrtell/jsts

El formato geojson que leemos de la forma es el siguiente:
Insertar descripción de la imagen aquí
Solo hay algunos puntos de coordenadas del límite. El siguiente método es cruzar geojson y wkt y luego convertirlo en retorno de 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) =