Vue项目openlayers中使用jsts处理wkt和geojson的交集-(geojson来源zpi解析)

Vue项目openlayers中使用jsts处理wkt和geojson的交集-(geojson来源zpi解析)

读取压缩包中的shape看上一篇笔记:Vue项目读取zip中的ShapeFile文件,并解析为GeoJson

openlayers使用jsts官方示例:https://openlayers.org/en/latest/examples/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; // 行政区geomconst format = new WKT();const parser = new jsts.io.OL3Parser();parser.inject(Point,LineString,LinearRing,Polygon,MultiPoint,MultiLineString,MultiPolygon,GeometryCollection,);// eslint-disable-next-line consistent-returnreturn new Promise((resolve) => {// 工作区范围featuresconst workspaceFeatures = geojson.features;// 行政区featuresconst xzqFeatures = format.readFeatures(xzqGeom);// 行政区Geometryconst xzqGeometry = parser.read(xzqFeatures[0].getGeometry());const xzqReturn = {geom: xzqGeom,isValid: false,};console.log('xzqFeatures-workspaceFeatures:', xzqFeatures, workspaceFeatures);try {// 如果工作区范围是多个feature,合并成一个let newWfGeometry;if (workspaceFeatures.length > 0) {workspaceFeatures.forEach((wkFeature) => {// 获取类型const { type, coordinates: mapdata } = wkFeature.geometry;let geometry: Geometry;if (type === 'Polygon') {geometry = new Polygon(mapdata); // 创建一个 Polygon 对象const wfGeometry1 = parser.read(geometry);newWfGeometry = newWfGeometry ? newWfGeometry.union(wfGeometry1) : wfGeometry1;} else if (type === 'MultiPolygon') {// 为每个多边形创建 Polygonconst polygons = mapdata.map((polygonCoords) => new Polygon(polygonCoords));geometry = new MultiPolygon(polygons); // 创建一个 MultiPolygon 对象const wfGeometry1 = parser.read(geometry);newWfGeometry = newWfGeometry ? newWfGeometry.union(wfGeometry1) : wfGeometry1;} else {this.$message.error('工作区范围必须是面数据');resolve(xzqReturn);}});} else {this.$message.error('工作区范围不能为空');return resolve(xzqReturn);}// console.log('合并后的作曲范围数据newWfGeometry:', newWfGeometry, xzqGeometry);// 判断工作区范围和行政区范围是否相交if (newWfGeometry && xzqGeometry) {const intersects = newWfGeometry.intersects(xzqGeometry);if (intersects) {// 如果相交,取交集做工作区范围newWfGeometry = newWfGeometry.intersection(xzqGeometry);// 转为wktconst newWkt = format.writeGeometry(parser.write(newWfGeometry));// console.log(newWkt);return resolve({geom: newWkt,isValid: true,});}console.log('不相交相交');// 如果不相交,则返回行政区范围return resolve(xzqReturn);}} catch (err) {console.log('工作区范围数据解析出错:', err);return resolve(xzqReturn);}});}
}

使用:

// res 是我这里固定的wkt-行政区边界wkt
const geomWorkspace: any = await this.hansleWorkspace(res, this.shpeState.geojson);
console.log('处理后返回的geomWorkspace:', geomWorkspace);

调用后返回效果:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/373219.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

已解决 javax.xml.transform.TransformerFactoryConfigurationError 异常的正确解决方法,亲测有效!!!

已解决 javax.xml.transform.TransformerFactoryConfigurationError 异常的正确解决方法,亲测有效!!! 目录 一、问题分析 二、报错原因 三、解决思路 四、解决方法 五、总结 博主v:XiaoMing_Java 博主v&#x…

昇思25天学习打卡营第16天|Vision Transformer图像分类

昇思25天学习打卡营第16天|Vision Transformer图像分类 前言Vision Transformer图像分类Vision Transformer(ViT)简介模型结构模型特点 环境准备与数据读取模型解析Transformer基本原理Attention模块 Transformer EncoderViT模型的输入整体构建ViT 模型训…

【自学网络安全】:安全策略与用户认证综合实验

实验拓扑图: 实验任务: 1、DMZ区内的服务器,办公区仅能在办公时间内(9:00-18:00)可以访问,生产区的设备全天可以访问 2、生产区不允许访问互联网,办公区和游客区允许访问互联网 3、办公区设备10.0.2.10不允许访问Dmz区…

代理详解之静态代理、动态代理、SpringAOP实现

1、代理介绍 代理是指一个对象A通过持有另一个对象B,可以具有B同样的行为的模式。为了对外开放协议,B往往实现了一个接口,A也会去实现接口。但是B是“真正”实现类,A则比较“虚”,他借用了B的方法去实现接口的方法。A…

未羽研发测试管理平台

突然有一些觉悟,程序猿不能只会吭哧吭哧的低头做事,应该学会怎么去展示自己,怎么去宣传自己,怎么把自己想做的事表述清楚。 于是,这两天一直在整理自己的作品,也为接下来的找工作多做点准备。接下来…

wordpress外贸建站公司案例英文模板

Indirect Trade WP外贸网站模板 WordPress Indirect Trade外贸网站模板,建外贸独立站用wordpress模板,快速搭建十分便捷。 衣物清洁wordpress独立站模板 洗衣粉、洗衣液、衣物柔顺剂、干洗剂、衣领净、洗衣皂等衣物清洁wordpress独立站模板。 家具wordpr…

Apache部署与配置

概述 介绍 Apache HTTP Server(简称Apache)是Apache的一个开源的网页服务器,它源自NCSAhttpd服务器,并经过多次修改和发展,如今已经成为全球范围内广泛使用的Web服务器软件之一 特点 跨平台:可以运行在几乎所有广泛使用的计算机平…

哪个充电宝口碑比较好?怎么选充电宝?2024年口碑优秀充电宝推荐

在如今快节奏的生活中,充电宝已然成为我们日常生活中的必备品。然而,市场上充电宝品牌众多,质量参差不齐,如何选择一款安全、可靠且口碑优秀的充电宝成为了消费者关注的焦点。安全性能不仅关系到充电宝的使用寿命,更关…

【正点原子i.MX93开发板试用连载体验】项目计划和开箱体验

本文最早发表于电子发烧友:【   】【正点原子i.MX93开发板试用连载体验】基于深度学习的语音本地控制 - 正点原子学习小组 - 电子技术论坛 - 广受欢迎的专业电子论坛! (elecfans.com)https://bbs.elecfans.com/jishu_2438354_1_1.html 有一段时间没有参加电子发…

clickhouse-jdbc-bridge rce

clickhouse-jdbc-bridge 是什么 JDBC bridge for ClickHouse. It acts as a stateless proxy passing queries from ClickHouse to external datasources. With this extension, you can run distributed query on ClickHouse across multiple datasources in real time, whic…

支持向量机 (support vector machine,SVM)

支持向量机 (support vector machine,SVM) flyfish 支持向量机是一种用于分类和回归的机器学习模型。在分类任务中,SVM试图找到一个最佳的分隔超平面,使得不同类别的数据点在空间中被尽可能宽的间隔分开。 超平面方…

MMGPL: 多模态医学数据分析与图提示学习| 文献速递-基于深度学习的多模态数据分析与生存分析

Title 题目 MMGPL: Multimodal Medical Data Analysis with Graph Prompt Learning MMGPL: 多模态医学数据分析与图提示学习 01 文献速递介绍 神经学障碍,包括自闭症谱系障碍(ASD)(Lord等,2018年)和阿…

kafka的副本replica

指定topic的分区和副本 通过kafka命令行工具 kafka-topics.sh --create --topic myTopic --partitions 3 --replication-factor 1 --bootstrap-server localhost:9092 执行代码时指定分区个数

基于Spring Boot框架的EAM系统设计与实现

摘 要:文章设计并实现一个基于Spring Boot框架的EAM系统,以应对传统人工管理模式存在的低效与信息管理难题。系统利用Java语言、JSP技术、MySQL数据库等技术栈,构建了一个B/S架构的高效管理平台,提升了资产管理的信息化水平。该系…

大小端详解

引例 我们知道整形(int)是4个字节,例如随便举个例子:0x01020304,它一共占了四个地址位,01,02,03,04分别占了一个字节(一个字节就对应了一个地址)。 那么就会有个问题:我们的01到底是存储在高地…

STM32的 DMA(直接存储器访问) 详解

STM32的DMA(Direct Memory Access,直接存储器存取)是一种在单片机中用于高效实现数据传输的技术。它允许外设设备直接访问RAM,不需要CPU的干预,从而释放CPU资源,提高CPU工作效率,本文基于STM32F…

C++基础(1)

目录 C的输入输出: 命名空间域: 缺省(默认)参数: 函数重载: 引用: 内联函数inline: 指针空值nullptr: C的输入输出: 输入: int a; char …

社交论坛圈子系统APP开发社交圈子小程序系统源码开源,带语音派对聊天室/圈子社交论坛及时聊天

功能// 首页左右滑动切换分类 使用资讯类app常见的滑动切换分类,让用户使用更方便。 2信息卡片流展示 每条信息都是一个卡片,头像展示会员标签,单图自动宽度,多图九宫格展示,底部展示信息发布地址,阅读量、…

采用3种稀疏降噪模型对心电信号进行降噪(Matlab R2021B)

心电信号采集自病人体表,是一种无创性的检测手段。因此,心电信号采集过程中,本身也已经包含了机体内部其他生命活动带来的噪声。同时,由于采集设备和环境中存在电流的变化,产生电磁发射等物理现象,会对心电…

Java项目:基于SSM框架实现的中小型企业财务管理系统【ssm+B/S架构+源码+数据库+答辩PPT+开题报告+毕业论文】

一、项目简介 本项目是一套基于SSM框架实现的中小型企业财务管理系统 包含:项目源码、数据库脚本等,该项目附带全部源码可作为毕设使用。 项目都经过严格调试,eclipse或者idea 确保可以运行! 该系统功能完善、界面美观、操作简单…