lishenfeng
/
mcfxkh-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

地图画线

lsf-dev
秦子超 2025-06-11 14:58:00 +08:00
parent 99d9008627
commit 566a54ea1a
7 changed files with 109 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/assets/站点统计.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 88 KiB

1
public/data3/line1.geojson Normal file
View File

@ -0,0 +1 @@
{"type":"FeatureCollection","features":[{"type":"Feature","id":2,"bbox":[114.88191247,31.16683581,114.88643309,31.16825998],"properties":{"gid":2,"geometry":"LineString"},"geometry":{"type":"LineString","coordinates":[[114.88610432,31.16825998],[114.88643309,31.16788196],[114.8862687,31.16732812],[114.88574472,31.16687977],[114.88494334,31.16683581],[114.88393648,31.16690614],[114.88327893,31.16732812],[114.88235426,31.16720504],[114.88191247,31.16709955]]}}]}

5
src/models/map/layout.js
View File

@ -111,9 +111,9 @@ export default function calcLayout(view, rightStack, hidePanels) {
left = [
{ key: '天气' },
{ key: '水库总览', style: { height: '30rem', flexGrow: 1 } },
{ key: '超汛水库', style: { height: '16rem'} },
// { key: '水库列表', style: { height: '16rem'} },
];
leftFullHeight = true;
} else if (view === 301) {
left = [
{ key: '天气' },
@ -323,6 +323,9 @@ export default function calcLayout(view, rightStack, hidePanels) {
} else if (view === 200) {
right = [
{ key: '警报' },
{ key: '超汛水库', style: { height: '16rem'} },
{ key: '站点统计', style: { height: '17rem'} },
{ key: '监测告警', style: { height: '20rem'} },
// { key: '关联站点',style: { height: '15rem', flexGrow: 1 } },
// { key: '水库水量统计',style: { height: '22rem' } },
// { key: '洪水防御',style: { height: '18rem', flexGrow: 1 } },

9
src/views/Home/MapCtrl/index.js
View File

@ -134,6 +134,15 @@ export default function MapCtrl({ initParams, onLoad }) {
}
dispatch.runtime.setFeaturePop({ type: record.layerPop, properties: record, coordinates: [record.lgtd, record.lttd] });
}
if(feature.layer.id==='临时线'){
debugger
const record = feature.properties
if(feature.layer.id==='临时水库tz'){
dispatch.map.setView(203)
sessionStorage.setItem('lastCenter',JSON.stringify([record.lgtd, record.lttd]))
}
dispatch.runtime.setFeaturePop({ type: record.layerPop, properties: record, coordinates: [record.lgtd, record.lttd] });
}
if (feature.layer.id === '关联站点') {
const record = feature.properties
if (record.cd_nm == 'GN1') {

3
src/views/Home/PanelIndex.js
View File

@ -113,6 +113,7 @@ import Fadb from './panels/Fadb'
import Sksltj from './panels/Sksltj'
import Hsfy from './panels/Hsfy'
import Cxsk from './panels/Cxsk'
import Zdtj from './panels/Zdtj'
@ -400,6 +401,8 @@ export default function PanelIndex({ name, style, ...params }) {
return <Gsfhqx style={style} />
} else if (name === '超汛水库') {
return <Cxsk style={style} />
} else if (name === '站点统计') {
return <Zdtj style={style} />
}

2
src/views/Home/panels/Skzl/index.js
View File

@ -133,7 +133,7 @@ function DrpReal({ style }) {
(<>
<CollapsePage type={item.type} name={item.name} num1={item.num1} num2={item.num2} skType={skType} setSkType={setSkType}/>
<Collapse in={skType===item.type} timeout="auto" unmountOnExit>
<TableContainer style={{ height: '12.8rem' }}>
<TableContainer style={{ maxHeight: 'calc( 100vh - 28.2rem )' }}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow>

91
src/views/Home/panels/Zdtj/index.js Normal file
View File

@ -0,0 +1,91 @@
import React, { useMemo, useState } from 'react';
import PanelBox from '../../components/PanelBox';
function DrpReal({ style }) {
const setSkLayer1 = ()=>{
const map = window.__mapref;
const layer = map.getLayer('临时线')
if(layer){
map.removeLayer('临时线');
map.removeSource('临时线');
}
map.addLayer({
'id': '临时线',
'type': 'line',
'source': {
'type': 'geojson',
'data': `${window.location.origin}/data3/line1.geojson`
},
'layout': {
'line-join': 'round'
},
'paint': {
'line-color': 'red',
'line-width': 10
// [
// 'case',
// ['==', ['get', 'LEVEL'], 1], 2.2,
// ['==', ['get', 'LEVEL'], 2], 2.2,
// ['==', ['get', 'LEVEL'], 3], 2.2,
// ['==', ['get', 'LEVEL'], 4], 1.6,
// ['==', ['get', 'LEVEL'], 5], 1.3,
// 10
// ]
},
'visibility': 'visible',
});
}
const setSkLayer2 = ()=>{
const map = window.__mapref;
const layer = map.getLayer('临时线')
if(layer){
map.removeLayer('临时线');
map.removeSource('临时线');
}
map.addLayer({
'id': '临时线',
'type': 'line',
'source': {
'type': 'geojson',
'data': {
'type': 'FeatureCollection',
'features': [],
},
},
'layout': {
'line-join': 'round'
},
'paint': {
'line-color': 'red',
'line-width': 10
// [
// 'case',
// ['==', ['get', 'LEVEL'], 1], 2.2,
// ['==', ['get', 'LEVEL'], 2], 2.2,
// ['==', ['get', 'LEVEL'], 3], 2.2,
// ['==', ['get', 'LEVEL'], 4], 1.6,
// ['==', ['get', 'LEVEL'], 5], 1.3,
// 10
// ]
},
'visibility': 'visible',
});
map.getSource('临时线').setData({"type":"FeatureCollection","features":[{"type":"Feature","id":2,"bbox":[114.88191247,31.16683581,114.88643309,31.16825998],"properties":{"gid":2,"geometry":"LineString"},"geometry":{"type":"LineString","coordinates":[[114.88610432,31.16825998],[114.88643309,31.16788196],[114.8862687,31.16732812],[114.88574472,31.16687977],[114.88494334,31.16683581],[114.88393648,31.16690614],[114.88327893,31.16732812],[114.88235426,31.16720504],[114.88191247,31.16709955]]}}]})
}
return (
<PanelBox
style={style}
title="站点统计"
color="green"
>
<img src='/assets/站点统计.jpg' style={{width:'27rem',marginLeft:'0rem',marginTop:'0rem'}} onClick={()=>{setSkLayer1()}}/>
</PanelBox>
)
}
export default DrpReal;