merge
parent
90012c5c0b
commit
ccb9a35263
|
|
@ -518,6 +518,7 @@
|
|||
}
|
||||
}
|
||||
let splitPolygon = currentGeoJson.value;
|
||||
console.log("splitPolygon",splitPolygon);
|
||||
|
||||
try{
|
||||
// let features = polygonCut(splitPolygon,splitLineString,0.1,"meters");
|
||||
|
|
@ -530,10 +531,10 @@
|
|||
splitAfterFeatures.features = features;
|
||||
|
||||
emit("handlerSplitPolygon",features);
|
||||
|
||||
handlerDetails(splitAfterFeatures);
|
||||
handlerUnDraw();
|
||||
}catch(e){
|
||||
console.error("EEEE",e);
|
||||
createMessage.warning('分割线起点、终点需要在图斑外');
|
||||
handlerUnDraw();
|
||||
}
|
||||
|
|
@ -888,23 +889,7 @@
|
|||
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* 查看图斑
|
||||
*
|
||||
* 添加图斑
|
||||
*
|
||||
* 编辑图斑
|
||||
*
|
||||
* status 操作类型
|
||||
*
|
||||
* features 空间数据
|
||||
*
|
||||
* [
|
||||
* {id:"8448048304dofhaofh0af0q4",geom:""}
|
||||
* ]
|
||||
*
|
||||
* */
|
||||
|
||||
const handlerDraw = (status:string,features = null, bool = false) => {
|
||||
let geo = {
|
||||
type: 'FeatureCollection',
|
||||
|
|
@ -924,6 +909,7 @@
|
|||
for (let i = 0; i < features.length; i++) {
|
||||
try {
|
||||
let featureTemp = WktToGeojson(features[i]?.mapgeom);
|
||||
|
||||
let feature = {
|
||||
id: generateUUID(),
|
||||
type: 'Feature',
|
||||
|
|
@ -935,6 +921,7 @@
|
|||
// 获取第一个图斑的中心点跳转定位
|
||||
if(i == 0){
|
||||
let lngLat = getGeometryCenter(feature);
|
||||
// let lngLat = getGeometryCenter(geo.features[0]);
|
||||
currentPosition.value = lngLat;
|
||||
handlerLocation(lngLat);
|
||||
}
|
||||
|
|
@ -945,6 +932,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
switch(status){
|
||||
case "Add":
|
||||
handlerInitDrawTool(geo, bool);
|
||||
|
|
@ -960,6 +948,7 @@
|
|||
}
|
||||
};
|
||||
|
||||
|
||||
const currentGeoJson = ref({});
|
||||
|
||||
const handlerDetails = (geojson,source="detailsSource",layer="detailsLayer",style={lineStyle:{'line-color': '#fcf003','line-width':3},fillStyle:{'fill-color': '#fcf003',"fill-opacity": 0.1}}) => {
|
||||
|
|
@ -967,11 +956,19 @@
|
|||
let lineLayerName = layer+"Line";
|
||||
|
||||
if(source == 'detailsSource'){
|
||||
|
||||
// 判断是单面还是多面
|
||||
let coordinates = null;
|
||||
if(geojson.features[0].geometry.type == "MultiPolygon"){
|
||||
coordinates = geojson.features[0].geometry.coordinates[0];
|
||||
}else if(geojson.features[0].geometry.type == "Polygon"){
|
||||
coordinates = geojson.features[0].geometry.coordinates;
|
||||
}
|
||||
let singleFeature = {
|
||||
"type": "Feature",
|
||||
"properties": {},
|
||||
"geometry": {
|
||||
"coordinates": geojson.features[0].geometry.coordinates[0],
|
||||
"coordinates": coordinates,
|
||||
"type": "Polygon"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
import { onMounted, onUnmounted, defineProps, reactive, ref, defineExpose } from 'vue';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import { Map, Popup } from 'mapbox-gl';
|
||||
|
||||
import heatGeoJson from './lib/data.json'
|
||||
|
||||
// 图形绘制工具类
|
||||
import MapboxDraw from '@mapbox/mapbox-gl-draw';
|
||||
|
|
@ -205,81 +205,81 @@
|
|||
}
|
||||
});
|
||||
|
||||
// map.addSource('earthquakes', {
|
||||
// 'type': 'geojson',
|
||||
// 'data': {}
|
||||
// });
|
||||
map.addSource('earthquakes', {
|
||||
'type': 'geojson',
|
||||
'data': heatGeoJson
|
||||
});
|
||||
|
||||
// map.addLayer(
|
||||
// {
|
||||
// 'id': 'earthquakes-heat',
|
||||
// 'type': 'heatmap',
|
||||
// 'source': 'earthquakes',
|
||||
// // 'maxzoom': 18,
|
||||
// 'minzoom':11,
|
||||
// 'paint': {
|
||||
// // Increase the heatmap weight based on frequency and property magnitude
|
||||
// 'heatmap-weight': [
|
||||
// 'interpolate',
|
||||
// ['linear'],
|
||||
// ['get', 'mag'],
|
||||
// 0,
|
||||
// 1,
|
||||
// 1,
|
||||
// 0
|
||||
// ],
|
||||
// // Increase the heatmap color weight weight by zoom level
|
||||
// // heatmap-intensity is a multiplier on top of heatmap-weight
|
||||
// 'heatmap-intensity': [
|
||||
// 'interpolate',
|
||||
// ['linear'],
|
||||
// ['zoom'],
|
||||
// 0,
|
||||
// 1,
|
||||
// 9,
|
||||
// 3
|
||||
// ],
|
||||
// // Color ramp for heatmap. Domain is 0 (low) to 1 (high).
|
||||
// // Begin color ramp at 0-stop with a 0-transparancy color
|
||||
// // to create a blur-like effect.
|
||||
// 'heatmap-color': [
|
||||
// 'interpolate',
|
||||
// ['linear'],
|
||||
// ['heatmap-density'],
|
||||
// 0,
|
||||
// 'rgba(33,102,172,0)',
|
||||
// 0.2,
|
||||
// 'rgb(103,169,207)',
|
||||
// 0.4,
|
||||
// 'rgb(209,229,240)',
|
||||
// 0.6,
|
||||
// 'rgb(253,219,199)',
|
||||
// 0.8,
|
||||
// 'rgb(239,138,98)',
|
||||
// 1,
|
||||
// 'rgb(178,24,43)'
|
||||
// ],
|
||||
// // Adjust the heatmap radius by zoom level
|
||||
// 'heatmap-radius': [
|
||||
// 'interpolate',['linear'],['zoom'],
|
||||
// 3,
|
||||
// 6,
|
||||
// 9,
|
||||
// 20
|
||||
// ],
|
||||
// // Transition from heatmap to circle layer by zoom level
|
||||
// 'heatmap-opacity': [
|
||||
// 'interpolate',
|
||||
// ['linear'],
|
||||
// ['zoom'],
|
||||
// 7,
|
||||
// 1,
|
||||
// 8,
|
||||
// 1
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
// );
|
||||
map.addLayer(
|
||||
{
|
||||
'id': 'earthquakes-heat',
|
||||
'type': 'heatmap',
|
||||
'source': 'earthquakes',
|
||||
// 'maxzoom': 18,
|
||||
'minzoom':11,
|
||||
'paint': {
|
||||
// Increase the heatmap weight based on frequency and property magnitude
|
||||
'heatmap-weight': [
|
||||
'interpolate',
|
||||
['linear'],
|
||||
['get', 'mag'],
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
0
|
||||
],
|
||||
// Increase the heatmap color weight weight by zoom level
|
||||
// heatmap-intensity is a multiplier on top of heatmap-weight
|
||||
'heatmap-intensity': [
|
||||
'interpolate',
|
||||
['linear'],
|
||||
['zoom'],
|
||||
0,
|
||||
1,
|
||||
9,
|
||||
3
|
||||
],
|
||||
// Color ramp for heatmap. Domain is 0 (low) to 1 (high).
|
||||
// Begin color ramp at 0-stop with a 0-transparancy color
|
||||
// to create a blur-like effect.
|
||||
'heatmap-color': [
|
||||
'interpolate',
|
||||
['linear'],
|
||||
['heatmap-density'],
|
||||
0,
|
||||
'rgba(33,102,172,0)',
|
||||
0.2,
|
||||
'rgb(103,169,207)',
|
||||
0.4,
|
||||
'rgb(209,229,240)',
|
||||
0.6,
|
||||
'rgb(253,219,199)',
|
||||
0.8,
|
||||
'rgb(239,138,98)',
|
||||
1,
|
||||
'rgb(178,24,43)'
|
||||
],
|
||||
// Adjust the heatmap radius by zoom level
|
||||
'heatmap-radius': [
|
||||
'interpolate',['linear'],['zoom'],
|
||||
3,
|
||||
6,
|
||||
9,
|
||||
20
|
||||
],
|
||||
// Transition from heatmap to circle layer by zoom level
|
||||
'heatmap-opacity': [
|
||||
'interpolate',
|
||||
['linear'],
|
||||
['zoom'],
|
||||
7,
|
||||
1,
|
||||
8,
|
||||
1
|
||||
]
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -426,11 +426,20 @@ const getCollectList = () => {
|
|||
getInfoList();
|
||||
};
|
||||
const showSplitPolygon = ref(false);
|
||||
const handlerRevertPolygon = (item)=>{
|
||||
|
||||
}
|
||||
const handlerSplitPolygon = (item) => {
|
||||
getCaseInfoById({id:item.processid}).then(res => {
|
||||
showInfoData.value = res
|
||||
showInfoData.value['processid'] = item.processid;
|
||||
showSplitPolygon.value = true
|
||||
|
||||
if(res){
|
||||
showInfoData.value = res
|
||||
showInfoData.value['processid'] = item.processid;
|
||||
showSplitPolygon.value = true
|
||||
}else{
|
||||
message.error("数据为空");
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
const dataListSort = (type) => {
|
||||
|
|
@ -484,8 +493,17 @@ function closeModal() {
|
|||
}
|
||||
function handleSuccess() {}
|
||||
const handleOperateClick = (e: Event) => {
|
||||
handlerSplitPolygon(selectItem.value);
|
||||
console.log('clickEEEEE', e,selectItem.value);
|
||||
|
||||
if(!selectItem.value){
|
||||
message.warning("选择需要操作的数据");
|
||||
}
|
||||
|
||||
if(e['key'] == 1){
|
||||
handlerSplitPolygon(selectItem.value);
|
||||
}else if(e['key'] == 2){
|
||||
handlerRevertPolygon(selectItem.value)
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -678,7 +678,7 @@
|
|||
params.parts.push(polygon);
|
||||
})
|
||||
console.log("params",params);
|
||||
|
||||
|
||||
splitCase(params).then(res=>{
|
||||
if(res.code == 200){
|
||||
createMessage.success("操作成功!");
|
||||
|
|
|
|||
Loading…
Reference in New Issue