Compare commits
2 Commits
d1f206b3d0
...
0777feee4b
| Author | SHA1 | Date |
|---|---|---|
 徐景良
|
0777feee4b | |
|
徐景良
|
4c996eb616 |
|
|
@ -110,26 +110,19 @@
|
|||
<!-- <p class="split-panel-item" >地类图斑分割</p> -->
|
||||
|
||||
|
||||
<a-dropdown>
|
||||
|
||||
<!-- <a-dropdown>
|
||||
<p @click.prevent>地类图斑分割 <DownOutlined /></p>
|
||||
|
||||
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
|
||||
<a-menu-item @click="handlerSelectLandType('gengdi')">
|
||||
<p>耕地地类分割</p>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item @click="handlerSelectLandType('jianshe')">
|
||||
<p>建设用地地类分割</p>
|
||||
</a-menu-item>
|
||||
|
||||
|
||||
</a-menu>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
</a-dropdown> -->
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -339,7 +332,7 @@
|
|||
|
||||
import { customDrawStyles } from './Styles/Styles';
|
||||
import Drawtool from '@/views/datamaintenance/components/drawtool.vue';
|
||||
import { WktToGeojson, GeojsonToWkt } from './src/WktGeojsonTransform';
|
||||
import { WktToGeojson, GeojsonToWkt,wktCollectionToGeoJson } from './src/WktGeojsonTransform';
|
||||
import { features } from 'process';
|
||||
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
|
|
@ -431,19 +424,20 @@
|
|||
// 地类分割图斑
|
||||
const handlerSelectLandType = (type)=>{
|
||||
|
||||
|
||||
emit('handlerStartSpliting',true);
|
||||
|
||||
try{
|
||||
|
||||
let geom = GeojsonToWkt(JSON.parse(JSON.stringify(currentGeoJson.value.geometry)));
|
||||
// let geom = "POLYGON ((118.309424037556 34.547670781228 , 118.309595164318 34.5475487203142 , 118.30958905415 34.5475220510643 , 118.309594872126 34.5475037441097 , 118.309650493845 34.5474667417388 , 118.309649079958 34.5474500627085 , 118.309623826 34.54738605 , 118.309575552961 34.5472698959146 , 118.309522643 34.5471425680001 , 118.309730137 34.5466727850001 , 118.309679115776 34.5465914577158 , 118.309360468678 34.5467523126098 , 118.309316608846 34.5466467673944 , 118.309288715084 34.5466132635055 , 118.309269848483 34.5467056718441 , 118.309247005657 34.5468275002474 , 118.309298402015 34.5468998358621 , 118.309285967432 34.5469646580605 , 118.309324410141 34.5469494810228 , 118.309340280529 34.5469759786143 , 118.309344087666 34.547027374972 , 118.309400751348 34.5471162294817 , 118.309323166839 34.5471455373382 , 118.309357412648 34.5473528852375 , 118.309424037556 34.547670781228 ))"
|
||||
// let geom = "POLYGON((118.30942404 34.54767078,118.30959516 34.54754872,118.30958905 34.54752205,118.30959487 34.54750374,118.30965049 34.54746674,118.30964908 34.54745006,118.30962383 34.54738605,118.30957555 34.5472699,118.30952264 34.54714257,118.30973014 34.54667279,118.30967912 34.54659146,118.30936047 34.54675231,118.30931661 34.54664677,118.30928872 34.54661326,118.30928872 34.54661326,118.30926985 34.54670567,118.30924701 34.5468275,118.3092984 34.54689984,118.30928597 34.54696466,118.30932441 34.54694948,118.30934028 34.54697598,118.30934409 34.54702737,118.30940075 34.54711623,118.30932317 34.54714554,118.30935741 34.54735289,118.30942404 34.54767078,118.30942404 34.54767078))";
|
||||
|
||||
let calAreaParams = {
|
||||
"wktgeom":geom,
|
||||
"type":type
|
||||
}
|
||||
|
||||
splitAndCalTubanArea(calAreaParams).then(res=>{
|
||||
if(res){
|
||||
|
||||
let splitAfterFeatures = {
|
||||
type: 'FeatureCollection',
|
||||
features: [],
|
||||
|
|
@ -451,8 +445,19 @@
|
|||
|
||||
// 耕地
|
||||
if(res.gengdituban && !res.gengdituban.match("EMPTY")){
|
||||
|
||||
// let geojsonData = wktCollectionToGeoJson(res.gengdituban);
|
||||
|
||||
let geometry = WktToGeojson(res.gengdituban)
|
||||
// let geometry = WktToGeojson("POLYGON((118.20453045 34.61493194,118.2043834 34.61496477,118.20439868 34.61503472,118.20453843 34.61501303,118.20453045 34.61493194))");
|
||||
|
||||
|
||||
// let geomtry_01 = WktToGeojson("POLYGON((118.3093166 34.5466468,118.3095756 34.5472699,118.3095226 34.5471426,118.3097301 34.5466728,118.3096917 34.5466115,118.3096791 34.5465915,118.3096252 34.5466187,118.3093605 34.5467523,118.3093166 34.5466468))");
|
||||
|
||||
// let geomtry_02 = WktToGeojson("POLYGON((118.3096238 34.5473861,118.3095893 34.5473029,118.309624 34.5473866,118.3096238 34.5473861))");
|
||||
|
||||
// let geomtry_03 = WktToGeojson("POLYGON((118.3096266 34.547393,118.3096408 34.5474354,118.3096491 34.5474501,118.3096266 34.547393))");
|
||||
|
||||
console.log("geomtry_01");
|
||||
|
||||
let feature = {
|
||||
"type": "Feature",
|
||||
|
|
@ -462,11 +467,37 @@
|
|||
"geometry": geometry
|
||||
}
|
||||
splitAfterFeatures.features.push(feature)
|
||||
|
||||
// splitAfterFeatures.features?.push({
|
||||
// "type": "Feature",
|
||||
// "properties": {
|
||||
// "id": generateUUID()
|
||||
// },
|
||||
// "geometry": geomtry_01
|
||||
// })
|
||||
|
||||
// splitAfterFeatures.features?.push({
|
||||
// "type": "Feature",
|
||||
// "properties": {
|
||||
// "id": generateUUID()
|
||||
// },
|
||||
// "geometry": geomtry_02
|
||||
// })
|
||||
|
||||
// splitAfterFeatures.features?.push({
|
||||
// "type": "Feature",
|
||||
// "properties": {
|
||||
// "id": generateUUID()
|
||||
// },
|
||||
// "geometry": geomtry_03
|
||||
// })
|
||||
|
||||
|
||||
|
||||
}
|
||||
// 农用地
|
||||
if(res.nongyongdituban && !res.nongyongdituban.match("EMPTY")){
|
||||
let geometry = WktToGeojson(res.nongyongdituban)
|
||||
// let geometry = WktToGeojson("POLYGON((118.20453902 34.61501903,118.20453045 34.61493194,118.20453843 34.61501303,118.20439868 34.61503472,118.2043834 34.61496477,118.20441053 34.61508898,118.20387087 34.61518892,118.20387087 34.61526887,118.20442195 34.61517464,118.20442195 34.61515465,118.2048474 34.61509184,118.20482741 34.61498048,118.20453902 34.61501903))")
|
||||
let feature = {
|
||||
"type": "Feature",
|
||||
"properties": {
|
||||
|
|
@ -512,8 +543,7 @@
|
|||
}
|
||||
splitAfterFeatures.features.push(feature)
|
||||
}
|
||||
|
||||
console.log("splitAfterFeatures",splitAfterFeatures);
|
||||
|
||||
// 分割数据返回父组件中
|
||||
emit('handlerSplitPolygon', splitAfterFeatures.features);
|
||||
handlerUnDraw();
|
||||
|
|
@ -521,11 +551,8 @@
|
|||
}).catch((e)=>{
|
||||
emit('handlerStartSpliting',false);
|
||||
})
|
||||
|
||||
}catch(e){
|
||||
|
||||
emit('handlerStartSpliting',false);
|
||||
|
||||
emit('handlerStartSpliting',false);
|
||||
}
|
||||
|
||||
// let res = {
|
||||
|
|
|
|||
|
|
@ -2,9 +2,17 @@ import WKT from "terraformer-wkt-parser"
|
|||
import { wktToGeoJSON,geojsonToWKT } from "@terraformer/wkt"
|
||||
|
||||
|
||||
const wktCollectionToGeoJson = (wktStr) => {
|
||||
alert(999);
|
||||
console.log("wktStr",wktStr);
|
||||
let geojson = WKT.parse(wktStr);
|
||||
console.log("geojson",geojson);
|
||||
alert(123);
|
||||
}
|
||||
|
||||
const WktToGeojson = (wktData)=> {
|
||||
// return WKT.parse(wktData)
|
||||
console.log("wktData",wktToGeoJSON(wktData));
|
||||
return wktToGeoJSON(wktData);
|
||||
}
|
||||
|
||||
|
|
@ -20,16 +28,18 @@ const removeZM = (geoJSON) => {
|
|||
function removeZMFromCoords(coords) {
|
||||
return coords.map((coord) => [coord[0], coord[1]]); // 只保留 X 和 Y
|
||||
}
|
||||
|
||||
|
||||
switch (geoJSON.type) {
|
||||
case 'Point':
|
||||
geoJSON.coordinates = removeZMFromCoords([geoJSON.coordinates]).flat();
|
||||
break;
|
||||
case 'LineString':
|
||||
|
||||
case 'MultiPoint':
|
||||
geoJSON.coordinates = removeZMFromCoords(geoJSON.coordinates);
|
||||
break;
|
||||
case 'Polygon':
|
||||
|
||||
case 'MultiLineString':
|
||||
geoJSON.coordinates = geoJSON.coordinates.map((ring) => removeZMFromCoords(ring));
|
||||
break;
|
||||
|
|
@ -44,4 +54,4 @@ const removeZM = (geoJSON) => {
|
|||
return geoJSON;
|
||||
}
|
||||
|
||||
export {WktToGeojson,GeojsonToWkt,removeZM}
|
||||
export {WktToGeojson,GeojsonToWkt,removeZM,wktCollectionToGeoJson}
|
||||
|
|
@ -178,7 +178,7 @@
|
|||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
v-if="item"
|
||||
|
|
@ -444,17 +444,17 @@
|
|||
|
||||
<!-- File Preview && Download Start -->
|
||||
<a-modal
|
||||
v-model:open="previewFileModalVisible"
|
||||
style="width: 100vw"
|
||||
title="文件预览"
|
||||
wrap-class-name="full-modal"
|
||||
>
|
||||
<FilePreview v-if="previewFileModalVisible" :fileUrl="previewFileUrl"></FilePreview>
|
||||
<template #footer>
|
||||
<a-button key="cancel" @click="handleCancelPreviewFile">取消</a-button>
|
||||
<a-button key="confirm" type="primary" @click="handlerDownloadFle">下载</a-button>
|
||||
</template>
|
||||
</a-modal>
|
||||
v-model:open="previewFileModalVisible"
|
||||
style="width: 100vw"
|
||||
title="文件预览"
|
||||
wrap-class-name="full-modal"
|
||||
>
|
||||
<FilePreview v-if="previewFileModalVisible" :fileUrl="previewFileUrl"></FilePreview>
|
||||
<template #footer>
|
||||
<a-button key="cancel" @click="handleCancelPreviewFile">取消</a-button>
|
||||
<a-button key="confirm" type="primary" @click="handlerDownloadFle">下载</a-button>
|
||||
</template>
|
||||
</a-modal>
|
||||
<!--File Preview && Download End -->
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -916,6 +916,7 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
|
||||
const splitPolygonForm = ref([]);
|
||||
const splitAfterPolygon = ref([]);
|
||||
|
||||
const handlerSplitPolygon = (e) => {
|
||||
|
||||
// 删除被分割的图斑
|
||||
|
|
@ -929,6 +930,7 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
// 面积计算
|
||||
let sumArea = 0.0;
|
||||
|
||||
|
||||
e?.forEach((item, index) => {
|
||||
|
||||
// 去除GeoJSON Z坐标
|
||||
|
|
@ -940,7 +942,6 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
|
||||
calTubanArea(calAreaParams).then(resultItem=>{
|
||||
if(resultItem){
|
||||
|
||||
let form = {
|
||||
fid: null,
|
||||
unitname: '',
|
||||
|
|
@ -977,19 +978,10 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
}
|
||||
})
|
||||
|
||||
// var polygon = null;
|
||||
// if(item.geometry.type == 'Polygon'){
|
||||
// polygon = turf.polygon(item.geometry.coordinates)
|
||||
// }else if(item.geometry.type == 'MultiPolygon'){
|
||||
// polygon = turf.multiPolygon(item.geometry.coordinates)
|
||||
// }
|
||||
// let are = (turf.area(polygon) / 666.666666666667).toFixed(2);
|
||||
|
||||
// if(index == e.length-1){
|
||||
// are = (parseFloat(area) - sumArea).toFixed(2);
|
||||
// }
|
||||
// sumArea = sumArea + are;
|
||||
|
||||
// setTimeout(function(){
|
||||
// handlerFeatureArea();
|
||||
// },10000)
|
||||
|
||||
});
|
||||
|
||||
|
|
@ -1000,6 +992,7 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
type: 'FeatureCollection',
|
||||
features: [],
|
||||
};
|
||||
|
||||
MapboxComponent.value.handlerDetails(geoms, 'splitPolygonSource', 'splitPolygonLayer', {
|
||||
lineStyle: { 'line-color': '#408eff', 'line-width': 3 },
|
||||
fillStyle: { 'fill-color': '#408eff', 'fill-opacity': 0.1 },
|
||||
|
|
@ -1009,6 +1002,58 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
|
||||
};
|
||||
|
||||
// 处理面积
|
||||
const handlerFeatureArea = ()=>{
|
||||
let addArea = {
|
||||
area: 0,
|
||||
nongyongdi_area: 0,
|
||||
gengdi_area: 0,
|
||||
yongjiujibennongtian_area: 0,
|
||||
shengtaibaohuhongxian_area:0,
|
||||
}
|
||||
|
||||
splitPolygonForm.value?.forEach((item,index)=>{
|
||||
|
||||
// 处理最后一块图斑面积
|
||||
if(index == splitPolygonForm.value.length-1){
|
||||
|
||||
// 总面积
|
||||
// if(area - addArea.area > 0){
|
||||
// splitPolygonForm.value[index].area = area - addArea.area;
|
||||
// }else if(area -addArea.area == 0){
|
||||
// splitPolygonForm.value[index].area = area - addArea.area;
|
||||
// }else if(area -addArea.area < 0){
|
||||
// splitPolygonForm.value[index].area = 0;
|
||||
// }
|
||||
|
||||
// 耕地面积
|
||||
// if(gengdi_area - addArea.gengdi_area > 0){
|
||||
|
||||
|
||||
// }else if(gengdi_area -addArea.gengdi_area == 0){
|
||||
// splitPolygonForm.value[index].gengdi_area = gengdi_area - addArea.gengdi_area;
|
||||
// }else if(gengdi_area -addArea.gengdi_area < 0){
|
||||
// splitPolygonForm.value[index].gengdi_area = 0;
|
||||
// }
|
||||
|
||||
splitPolygonForm.value[index].area = area - addArea.area;
|
||||
splitPolygonForm.value[index].gengdi_area = gengdi_area - addArea.gengdi_area;
|
||||
splitPolygonForm.value[index].nongyongdi_area = nongyongdi_area - addArea.nongyongdi_area;
|
||||
splitPolygonForm.value[index].yongjiujibennongtian_area = yongjiujibennongtian_area - addArea.yongjiujibennongtian_area;
|
||||
splitPolygonForm.value[index].shengtaibaohuhongxian_area = shengtaibaohuhongxian_area - addArea.shengtaibaohuhongxian_area;
|
||||
|
||||
}
|
||||
|
||||
addArea.area = addArea.area + item.area;
|
||||
addArea.gengdi_area = addArea.gengdi_area + item.gengdi_area;
|
||||
addArea.nongyongdi_area = addArea.nongyongdi_area + item.nongyongdi_area;
|
||||
addArea.yongjiujibennongtian_area = addArea.yongjiujibennongtian_area + item.yongjiujibennongtian_area;
|
||||
addArea.shengtaibaohuhongxian_area = addArea.shengtaibaohuhongxian_area + item.shengtaibaohuhongxian_area;
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
const handlerEditPolygonInfo = (e) => {
|
||||
console.log(e);
|
||||
};
|
||||
|
|
@ -1179,50 +1224,86 @@ import { itemProps } from '@/components/Menu/src/props';
|
|||
|
||||
// turf旧版本
|
||||
// let union = turf.union(mergeArr[0],mergeArr[1]);
|
||||
console.log("mregeArr",mergeArr);
|
||||
|
||||
// turf 7.0新版本
|
||||
let union = turf.union(turf.featureCollection([mergeArr[0], mergeArr[1]]))
|
||||
|
||||
let polygon = {
|
||||
fid: null,
|
||||
unitname: '',
|
||||
createdate: createtime,
|
||||
caseno: case_no + ' 分割图斑',
|
||||
countyname: countyname,
|
||||
streetname: streetname,
|
||||
isbuildname: '',
|
||||
nongyongdi_area: null,
|
||||
gengdi_area: null,
|
||||
yongjiujibennongtian_area: null,
|
||||
shengtaibaohuhongxian_area: null,
|
||||
guotukongjianguihua_area: null,
|
||||
area: null,
|
||||
geom: union,
|
||||
checked:false,
|
||||
// 计算合并后的图斑面积
|
||||
|
||||
|
||||
|
||||
|
||||
let calAreaParams:CalTubanAreaModel = {
|
||||
"wktgeom": GeojsonToWkt(union['geometry']),
|
||||
}
|
||||
|
||||
splitAfterPolygon.value?.push(union);
|
||||
splitPolygonForm.value?.push(polygon);
|
||||
calTubanArea(calAreaParams).then(resultItem=>{
|
||||
if(resultItem){
|
||||
let polygon = {
|
||||
fid: null,
|
||||
unitname: '',
|
||||
createdate: createtime,
|
||||
caseno: case_no + ' 分割图斑',
|
||||
countyname: countyname,
|
||||
streetname: streetname,
|
||||
isbuildname: '',
|
||||
nongyongdi_area: resultItem.nongyongdi > 0 ? resultItem.nongyongdi : 0.00,
|
||||
gengdi_area: resultItem.gengdi > 0 ? resultItem.gengdi : 0.00,
|
||||
yongjiujibennongtian_area: resultItem.jibennongtian > 0 ? resultItem.jibennongtian : 0.00,
|
||||
shengtaibaohuhongxian_area: resultItem.shengtaihongxian > 0 ? resultItem.shengtaihongxian : 0.00,
|
||||
guotukongjianguihua_area: null,
|
||||
area: resultItem.totalmianji > 0 ? resultItem.totalmianji : 0.00,
|
||||
geom: union,
|
||||
checked:false,
|
||||
}
|
||||
|
||||
// 渲染图斑数据
|
||||
let geoms = {
|
||||
type: 'FeatureCollection',
|
||||
features:splitAfterPolygon.value?splitAfterPolygon.value : [],
|
||||
};
|
||||
MapboxComponent.value.handlerDetails(geoms, 'detailsSource', 'detailsLayer', {
|
||||
lineStyle: { 'line-color': '#fcf003', 'line-width': 3 },
|
||||
fillStyle: { 'fill-color': '#fcf003', 'fill-opacity': 0.1 },
|
||||
});
|
||||
splitAfterPolygon.value?.push(union);
|
||||
splitPolygonForm.value?.push(polygon);
|
||||
|
||||
// 渲染图斑数据
|
||||
let geoms = {
|
||||
type: 'FeatureCollection',
|
||||
features:splitAfterPolygon.value?splitAfterPolygon.value : [],
|
||||
};
|
||||
MapboxComponent.value.handlerDetails(geoms, 'detailsSource', 'detailsLayer', {
|
||||
lineStyle: { 'line-color': '#fcf003', 'line-width': 3 },
|
||||
fillStyle: { 'fill-color': '#fcf003', 'fill-opacity': 0.1 },
|
||||
});
|
||||
|
||||
// 合并后选中图斑
|
||||
let checkedGeoms = {
|
||||
type: 'FeatureCollection',
|
||||
features: [],
|
||||
};
|
||||
MapboxComponent.value.handlerDetails(checkedGeoms, 'splitPolygonSource', 'splitPolygonLayer', {
|
||||
lineStyle: { 'line-color': '#408eff', 'line-width': 3 },
|
||||
fillStyle: { 'fill-color': '#408eff', 'fill-opacity': 0.1 },
|
||||
});
|
||||
|
||||
handlerFeatureArea();
|
||||
}
|
||||
})
|
||||
|
||||
// let polygon = {
|
||||
// fid: null,
|
||||
// unitname: '',
|
||||
// createdate: createtime,
|
||||
// caseno: case_no + ' 分割图斑',
|
||||
// countyname: countyname,
|
||||
// streetname: streetname,
|
||||
// isbuildname: '',
|
||||
// nongyongdi_area: null,
|
||||
// gengdi_area: null,
|
||||
// yongjiujibennongtian_area: null,
|
||||
// shengtaibaohuhongxian_area: null,
|
||||
// guotukongjianguihua_area: null,
|
||||
// area: null,
|
||||
// geom: union,
|
||||
// checked:false,
|
||||
// }
|
||||
|
||||
|
||||
|
||||
let checkedGeoms = {
|
||||
type: 'FeatureCollection',
|
||||
features: [],
|
||||
};
|
||||
MapboxComponent.value.handlerDetails(checkedGeoms, 'splitPolygonSource', 'splitPolygonLayer', {
|
||||
lineStyle: { 'line-color': '#408eff', 'line-width': 3 },
|
||||
fillStyle: { 'fill-color': '#408eff', 'fill-opacity': 0.1 },
|
||||
});
|
||||
}catch(e){
|
||||
createMessage.error("合并失败！");
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue