IOT/web-Iot
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

算法loading 装配图 首先定位都中国

Browse Source
This commit is contained in:
mmc
2026-05-22 14:14:30 +08:00
parent e642ecbd16
commit 53cd28807b
3 changed files with 51 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/Map.jsx
View File

@@ -692,6 +692,18 @@ export default function CesiumMap({ realtimePosition, pathPoints = [], devices =
viewer.scene.requestRenderMode = true; // 👈 加这个（只在需要时渲染）
viewer.scene.globe.enableLighting = false;
viewer.camera.flyTo({
// 中国中心大致坐标 + 合适高度（200万米）
destination: window.Cesium.Cartesian3.fromDegrees(103.84, 31.15, 2000000),
orientation: {
heading: window.Cesium.Math.toRadians(0),
pitch: window.Cesium.Math.toRadians(-90),
roll: 0
},
duration: 0 // 初始化直接到位，无需动画
});
try { fetchPublishedLayers() } catch (e) { }
return () => {

19
src/components/devices/DeviceOverviewPage.tsx
View File

@@ -22,6 +22,7 @@ import DroneLivePlayer from '../VolcRtcPlayer.jsx';
import AgoraTextTest from '../AgoraRtc.tsx';
import { useWebRTCPlayer } from '../useWebRTCStream.tsx';
import VideoPlayer from '../VideoPlayer.tsx.tsx';
import CesiumMap from '../Map.jsx';
const { Content } = Layout;
const { Text, Title } = Typography;
@@ -234,8 +235,8 @@ export default function DeviceOverviewPage({ devices, planedevices, devicesAll,
<Row gutter={[8, 8]}>
<Col xs={24} lg={14}>
<Card title={<><EnvironmentOutlined /> 装备协同态势图</>} extra={<Button type="text" icon={<SettingOutlined />} />} bordered={false} style={{ borderRadius: 8, marginBottom: 8 }} bodyStyle={{ padding: 0 }}>
<div style={{ width: '100%', height: 350, background: '#e6f7ff url(https://picsum.photos/seed/solarfarm/1600/800) center/cover', borderRadius: 8, position: 'relative', overflow: 'hidden' }}>
<div style={{ position: 'absolute', top: 12, left: 12, background: 'rgba(255,255,255,0.95)', borderRadius: 6, padding: 8 }}>
<div style={{ width: '100%', height: 350, borderRadius: 8, position: 'relative', overflow: 'hidden' }}>
<div style={{ position: 'absolute', zIndex: 9999, top: 12, left: 12, background: 'rgba(255,255,255,0.95)', borderRadius: 6, padding: 8 }}>
<div style={{ fontSize: 11, fontWeight: 60, marginBottom: 4 }}>图例说明</div>
<div style={{ display: 'flex', flexDirection: 'column', gap: 4, fontSize: 10 }}>
<div><span style={{ color: '#1890ff' }}>———</span> 巡检航线</div>
@@ -246,6 +247,7 @@ export default function DeviceOverviewPage({ devices, planedevices, devicesAll,
<div><span style={{ color: '#ff4d4f' }}>■</span> 障碍/禁入区</div>
</div>
</div>
<CesiumMap />
</div>
</Card>
@@ -369,10 +371,15 @@ export default function DeviceOverviewPage({ devices, planedevices, devicesAll,
</div>
<div style={{ display: 'flex', flexDirection: 'column', gap: 6, marginBottom: 12, maxHeight: "160px", overflow: "auto", scrollbarWidth: 'thin', scrollbarColor: '#ccc transparent' }}>
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<span style={{ color: '#666', fontSize: 12 }}>产品类型</span>
<span style={{ fontSize: 12 }}>{getVal(selectedDevice.productName)}</span>
</div>
{selectedDevice.productName && (
<>
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<span style={{ color: '#666', fontSize: 12 }}>产品类型</span>
<span style={{ fontSize: 12 }}>{getVal(selectedDevice.productName)}</span>
</div>
</>
)}
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', gap: 8 }}>
<span style={{ color: '#666', fontSize: 12, whiteSpace: 'nowrap' }}>设备SN</span>
<span

33
src/pages/Agri.jsx
View File

@@ -69,6 +69,8 @@ export default function Agri() {
});
const [detectFiles, setDetectFiles] = useState([]);
const [selectedHotspot, setSelectedHotspot] = useState(null);
const [targetLoading, setTargetLoading] = useState(false);
const [hotLoading, setHotLoading] = useState(false);
const [detectJobId, setDetectJobId] = useState(null);
const [detectStatus, setDetectStatus] = useState(null);
@@ -113,6 +115,7 @@ export default function Agri() {
}
};
const handleGetTargetDemo = () => {
setTargetLoading(true);
getTargetDemo().then((res) => {
if (res && res?.jobId) {
setDetectJobId(res?.jobId);
@@ -121,6 +124,9 @@ export default function Agri() {
//startPolling(res?.data?.jobId);
// 添加到历史
addToHistory('detect', res?.jobId);
setTargetLoading(false);
}
})
//const res = {
@@ -212,6 +218,7 @@ export default function Agri() {
}
};
const handleGetDemo = () => {
setHotLoading(true);
//const res = {
// "msg": "操作成功",
// "code": 200,
@@ -4360,6 +4367,8 @@ export default function Agri() {
// }
//}
getHotDemo().then(res => {
setHotLoading(false);
setSegResult(res);
utils.message.success('热成像分析完成');
addToHistory('segmentation', res.analysisId || 'seg-' + Date.now());
@@ -4684,8 +4693,13 @@ export default function Agri() {
>
{polling ? '任务处理中...' : '提交检测任务'}
</Button>
<Button icon={<PlayCircleOutlined />} onClick={handleGetTargetDemo}>调用服务器样例</Button>
<Button icon={<SyncOutlined />} onClick={fetchModels}>刷新模型</Button>
<Button
icon={<PlayCircleOutlined />}
onClick={handleGetTargetDemo}
loading={targetLoading}
>
调用服务器样例
</Button> <Button icon={<SyncOutlined />} onClick={fetchModels}>刷新模型</Button>
</Space>
</div>
);
@@ -4775,8 +4789,13 @@ export default function Agri() {
>
提交热成像分析
</Button>
<Button icon={<PlayCircleOutlined />} onClick={handleGetDemo}>调用服务器样例</Button>
<Button icon={<HistoryOutlined />}>读取服务器历史</Button>
<Button
icon={<PlayCircleOutlined />}
onClick={handleGetDemo}
loading={hotLoading}
>
调用服务器样例
</Button> <Button icon={<HistoryOutlined />}>读取服务器历史</Button>
</Space>
</div>
);
@@ -4979,7 +4998,7 @@ export default function Agri() {
<Col span={12}>
<div
style={{
//background: '#001529',
background: '#001529',
borderRadius: 8,
height: 400,
display: 'flex',
@@ -4989,10 +5008,10 @@ export default function Agri() {
position: 'relative'
}}
>
{segResult.image?.overlay_image_url && (
{segResult?.image?.overlay_image_url && (
<img
src={hasResult
? "http://47.100.102.7:10101" + segResult.image?.overlay_image_url
? "http://47.100.102.7:10101" + segResult?.image?.overlay_image_url
: URL.createObjectURL(inputFile.originFileObj)
}
style={{ maxWidth: '100%', maxHeight: '100%' }}