|
@@ -146,12 +146,13 @@
|
|
|
import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue'
|
|
import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue'
|
|
|
import { FullScreen, Location, MapLocation, Minus, Plus, RefreshRight, Search } from '@element-plus/icons-vue'
|
|
import { FullScreen, Location, MapLocation, Minus, Plus, RefreshRight, Search } from '@element-plus/icons-vue'
|
|
|
import { ElMessage } from 'element-plus'
|
|
import { ElMessage } from 'element-plus'
|
|
|
|
|
+import { convertCoord } from '@/utils/coordTransform'
|
|
|
|
|
|
|
|
-const centerPoint = { lng: 110.3937, lat: 28.4640 }
|
|
|
|
|
|
|
+const centerPoint = { lng: 110.386, lat: 28.445 }
|
|
|
|
|
|
|
|
const MAP_BOUNDS = {
|
|
const MAP_BOUNDS = {
|
|
|
- southWest: { lng: 110.365, lat: 28.452 },
|
|
|
|
|
- northEast: { lng: 110.420, lat: 28.482 }
|
|
|
|
|
|
|
+ southWest: { lng: 110.355, lat: 28.428 },
|
|
|
|
|
+ northEast: { lng: 110.410, lat: 28.460 }
|
|
|
}
|
|
}
|
|
|
const MAP_MIN_ZOOM = 13
|
|
const MAP_MIN_ZOOM = 13
|
|
|
const MAP_MAX_ZOOM = 19
|
|
const MAP_MAX_ZOOM = 19
|
|
@@ -164,313 +165,101 @@ const defaultLayerState = () => ({
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
const boundaryPoints = [
|
|
const boundaryPoints = [
|
|
|
- { lng: 110.368, lat: 28.478 },
|
|
|
|
|
- { lng: 110.385, lat: 28.480 },
|
|
|
|
|
- { lng: 110.402, lat: 28.480 },
|
|
|
|
|
- { lng: 110.416, lat: 28.476 },
|
|
|
|
|
- { lng: 110.418, lat: 28.466 },
|
|
|
|
|
- { lng: 110.415, lat: 28.459 },
|
|
|
|
|
|
|
+ { lng: 110.358, lat: 28.456 },
|
|
|
|
|
+ { lng: 110.375, lat: 28.458 },
|
|
|
|
|
+ { lng: 110.392, lat: 28.458 },
|
|
|
{ lng: 110.408, lat: 28.455 },
|
|
{ lng: 110.408, lat: 28.455 },
|
|
|
- { lng: 110.395, lat: 28.456 },
|
|
|
|
|
- { lng: 110.382, lat: 28.458 },
|
|
|
|
|
- { lng: 110.372, lat: 28.462 },
|
|
|
|
|
- { lng: 110.367, lat: 28.470 }
|
|
|
|
|
|
|
+ { lng: 110.410, lat: 28.448 },
|
|
|
|
|
+ { lng: 110.407, lat: 28.440 },
|
|
|
|
|
+ { lng: 110.400, lat: 28.436 },
|
|
|
|
|
+ { lng: 110.390, lat: 28.434 },
|
|
|
|
|
+ { lng: 110.378, lat: 28.433 },
|
|
|
|
|
+ { lng: 110.368, lat: 28.436 },
|
|
|
|
|
+ { lng: 110.360, lat: 28.445 }
|
|
|
]
|
|
]
|
|
|
|
|
|
|
|
const pipelineData = [
|
|
const pipelineData = [
|
|
|
{
|
|
{
|
|
|
id: 'pipe-high-01',
|
|
id: 'pipe-high-01',
|
|
|
level: 'high',
|
|
level: 'high',
|
|
|
- name: '辰州路高压燃气管线',
|
|
|
|
|
|
|
+ name: '燃气1',
|
|
|
code: 'GX-HP-001',
|
|
code: 'GX-HP-001',
|
|
|
length: 4.1,
|
|
length: 4.1,
|
|
|
material: 'L290N 无缝钢管',
|
|
material: 'L290N 无缝钢管',
|
|
|
diameter: 'DN300',
|
|
diameter: 'DN300',
|
|
|
pressure: '高压A (4.0MPa)',
|
|
pressure: '高压A (4.0MPa)',
|
|
|
- road: '辰州北路 — 辰州中路',
|
|
|
|
|
|
|
+ road: '燃气1主干线',
|
|
|
status: '运行正常',
|
|
status: '运行正常',
|
|
|
layingMethod: '直埋敷设',
|
|
layingMethod: '直埋敷设',
|
|
|
depth: '1.8m',
|
|
depth: '1.8m',
|
|
|
commissioningDate: '2026-06',
|
|
commissioningDate: '2026-06',
|
|
|
points: [
|
|
points: [
|
|
|
- { lng: 110.3918, lat: 28.4788 },
|
|
|
|
|
- { lng: 110.3920, lat: 28.4765 },
|
|
|
|
|
- { lng: 110.3924, lat: 28.4743 },
|
|
|
|
|
- { lng: 110.3927, lat: 28.4721 },
|
|
|
|
|
- { lng: 110.3931, lat: 28.4698 },
|
|
|
|
|
- { lng: 110.3934, lat: 28.4675 },
|
|
|
|
|
- { lng: 110.3936, lat: 28.4652 },
|
|
|
|
|
- { lng: 110.3937, lat: 28.4630 },
|
|
|
|
|
- { lng: 110.3935, lat: 28.4607 },
|
|
|
|
|
- { lng: 110.3934, lat: 28.4585 },
|
|
|
|
|
- { lng: 110.3935, lat: 28.4576 }
|
|
|
|
|
|
|
+ { lng: 110.404947, lat: 28.433419 },
|
|
|
|
|
+ { lng: 110.404836, lat: 28.433429 },
|
|
|
|
|
+ { lng: 110.403275, lat: 28.433571 },
|
|
|
|
|
+ { lng: 110.401084, lat: 28.433876 },
|
|
|
|
|
+ { lng: 110.399601, lat: 28.433876 },
|
|
|
|
|
+ { lng: 110.398112, lat: 28.433979 },
|
|
|
|
|
+ { lng: 110.396717, lat: 28.434314 },
|
|
|
|
|
+ { lng: 110.394299, lat: 28.434538 },
|
|
|
|
|
+ { lng: 110.394352, lat: 28.434887 },
|
|
|
|
|
+ { lng: 110.391969, lat: 28.434985 },
|
|
|
|
|
+ { lng: 110.384374, lat: 28.435695 },
|
|
|
|
|
+ { lng: 110.381418, lat: 28.43559 },
|
|
|
|
|
+ { lng: 110.377993, lat: 28.436193 },
|
|
|
|
|
+ { lng: 110.376062, lat: 28.436385 },
|
|
|
|
|
+ { lng: 110.374231, lat: 28.43655 },
|
|
|
|
|
+ { lng: 110.372584, lat: 28.437107 },
|
|
|
|
|
+ { lng: 110.371292, lat: 28.4377 },
|
|
|
|
|
+ { lng: 110.370581, lat: 28.438198 },
|
|
|
|
|
+ { lng: 110.369831, lat: 28.438821 }
|
|
|
]
|
|
]
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
id: 'pipe-subhigh-01',
|
|
id: 'pipe-subhigh-01',
|
|
|
level: 'subHigh',
|
|
level: 'subHigh',
|
|
|
- name: '古城路次高压管线',
|
|
|
|
|
|
|
+ name: '燃气2',
|
|
|
code: 'GX-SHP-002',
|
|
code: 'GX-SHP-002',
|
|
|
length: 3.8,
|
|
length: 3.8,
|
|
|
material: 'L245N 无缝钢管',
|
|
material: 'L245N 无缝钢管',
|
|
|
diameter: 'DN250',
|
|
diameter: 'DN250',
|
|
|
pressure: '次高压A (1.6MPa)',
|
|
pressure: '次高压A (1.6MPa)',
|
|
|
- road: '古城北路 — 古城中路',
|
|
|
|
|
|
|
+ road: '燃气2支线',
|
|
|
status: '运行正常',
|
|
status: '运行正常',
|
|
|
layingMethod: '直埋敷设',
|
|
layingMethod: '直埋敷设',
|
|
|
depth: '1.6m',
|
|
depth: '1.6m',
|
|
|
commissioningDate: '2026-03',
|
|
commissioningDate: '2026-03',
|
|
|
points: [
|
|
points: [
|
|
|
- { lng: 110.3980, lat: 28.4790 },
|
|
|
|
|
- { lng: 110.3979, lat: 28.4765 },
|
|
|
|
|
- { lng: 110.3977, lat: 28.4741 },
|
|
|
|
|
- { lng: 110.3975, lat: 28.4717 },
|
|
|
|
|
- { lng: 110.3973, lat: 28.4693 },
|
|
|
|
|
- { lng: 110.3970, lat: 28.4669 },
|
|
|
|
|
- { lng: 110.3968, lat: 28.4645 },
|
|
|
|
|
- { lng: 110.3965, lat: 28.4622 },
|
|
|
|
|
- { lng: 110.3963, lat: 28.4598 },
|
|
|
|
|
- { lng: 110.3962, lat: 28.4575 }
|
|
|
|
|
- ]
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'pipe-medium-01',
|
|
|
|
|
- level: 'medium',
|
|
|
|
|
- name: '迎宾路中压管线',
|
|
|
|
|
- code: 'GX-MP-003',
|
|
|
|
|
- length: 5.5,
|
|
|
|
|
- material: 'PE100 SDR11',
|
|
|
|
|
- diameter: 'DN200',
|
|
|
|
|
- pressure: '中压A (0.4MPa)',
|
|
|
|
|
- road: '迎宾西路 — 迎宾东路',
|
|
|
|
|
- status: '运行正常',
|
|
|
|
|
- layingMethod: '直埋敷设',
|
|
|
|
|
- depth: '1.4m',
|
|
|
|
|
- commissioningDate: '2025-09',
|
|
|
|
|
- points: [
|
|
|
|
|
- { lng: 110.3732, lat: 28.4650 },
|
|
|
|
|
- { lng: 110.3778, lat: 28.4648 },
|
|
|
|
|
- { lng: 110.3824, lat: 28.4645 },
|
|
|
|
|
- { lng: 110.3870, lat: 28.4642 },
|
|
|
|
|
- { lng: 110.3916, lat: 28.4640 },
|
|
|
|
|
- { lng: 110.3962, lat: 28.4637 },
|
|
|
|
|
- { lng: 110.4008, lat: 28.4634 },
|
|
|
|
|
- { lng: 110.4054, lat: 28.4630 },
|
|
|
|
|
- { lng: 110.4098, lat: 28.4627 },
|
|
|
|
|
- { lng: 110.4120, lat: 28.4625 }
|
|
|
|
|
- ]
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'pipe-medium-02',
|
|
|
|
|
- level: 'medium',
|
|
|
|
|
- name: '建设路中压管线',
|
|
|
|
|
- code: 'GX-MP-004',
|
|
|
|
|
- length: 4.8,
|
|
|
|
|
- material: 'PE100 SDR11',
|
|
|
|
|
- diameter: 'DN160',
|
|
|
|
|
- pressure: '中压B (0.2MPa)',
|
|
|
|
|
- road: '建设西路 — 建设东路',
|
|
|
|
|
- status: '运行正常',
|
|
|
|
|
- layingMethod: '定向钻穿越',
|
|
|
|
|
- depth: '1.5m',
|
|
|
|
|
- commissioningDate: '2025-04',
|
|
|
|
|
- points: [
|
|
|
|
|
- { lng: 110.3748, lat: 28.4583 },
|
|
|
|
|
- { lng: 110.3794, lat: 28.4586 },
|
|
|
|
|
- { lng: 110.3840, lat: 28.4588 },
|
|
|
|
|
- { lng: 110.3886, lat: 28.4589 },
|
|
|
|
|
- { lng: 110.3912, lat: 28.4586 },
|
|
|
|
|
- { lng: 110.3937, lat: 28.4582 },
|
|
|
|
|
- { lng: 110.3966, lat: 28.4579 },
|
|
|
|
|
- { lng: 110.4002, lat: 28.4581 },
|
|
|
|
|
- { lng: 110.4038, lat: 28.4578 },
|
|
|
|
|
- { lng: 110.4076, lat: 28.4575 }
|
|
|
|
|
- ]
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'pipe-low-01',
|
|
|
|
|
- level: 'low',
|
|
|
|
|
- name: '滨江路低压管线',
|
|
|
|
|
- code: 'GX-LP-005',
|
|
|
|
|
- length: 4.0,
|
|
|
|
|
- material: 'PE80 SDR17.6',
|
|
|
|
|
- diameter: 'DN110',
|
|
|
|
|
- pressure: '低压 (5kPa)',
|
|
|
|
|
- road: '滨江路 — 沿江北岸',
|
|
|
|
|
- status: '运行正常',
|
|
|
|
|
- layingMethod: '直埋敷设',
|
|
|
|
|
- depth: '1.2m',
|
|
|
|
|
- commissioningDate: '2025-11',
|
|
|
|
|
- points: [
|
|
|
|
|
- { lng: 110.3762, lat: 28.4569 },
|
|
|
|
|
- { lng: 110.3804, lat: 28.4570 },
|
|
|
|
|
- { lng: 110.3846, lat: 28.4571 },
|
|
|
|
|
- { lng: 110.3882, lat: 28.4568 },
|
|
|
|
|
- { lng: 110.3918, lat: 28.4565 },
|
|
|
|
|
- { lng: 110.3954, lat: 28.4562 },
|
|
|
|
|
- { lng: 110.3990, lat: 28.4560 },
|
|
|
|
|
- { lng: 110.4028, lat: 28.4559 },
|
|
|
|
|
- { lng: 110.4066, lat: 28.4557 },
|
|
|
|
|
- { lng: 110.4092, lat: 28.4556 }
|
|
|
|
|
- ]
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'pipe-low-02',
|
|
|
|
|
- level: 'low',
|
|
|
|
|
- name: '天宁路低压管线',
|
|
|
|
|
- code: 'GX-LP-006',
|
|
|
|
|
- length: 3.5,
|
|
|
|
|
- material: 'PE80 SDR17.6',
|
|
|
|
|
- diameter: 'DN90',
|
|
|
|
|
- pressure: '低压 (3kPa)',
|
|
|
|
|
- road: '天宁西路 — 天宁东路',
|
|
|
|
|
- status: '运行正常',
|
|
|
|
|
- layingMethod: '直埋敷设',
|
|
|
|
|
- depth: '1.0m',
|
|
|
|
|
- commissioningDate: '2026-05',
|
|
|
|
|
- points: [
|
|
|
|
|
- { lng: 110.3828, lat: 28.4704 },
|
|
|
|
|
- { lng: 110.3870, lat: 28.4702 },
|
|
|
|
|
- { lng: 110.3912, lat: 28.4700 },
|
|
|
|
|
- { lng: 110.3954, lat: 28.4697 },
|
|
|
|
|
- { lng: 110.3996, lat: 28.4695 },
|
|
|
|
|
- { lng: 110.4038, lat: 28.4693 },
|
|
|
|
|
- { lng: 110.4078, lat: 28.4691 },
|
|
|
|
|
- { lng: 110.4092, lat: 28.4690 }
|
|
|
|
|
|
|
+ { lng: 110.361433, lat: 28.454979 },
|
|
|
|
|
+ { lng: 110.362363, lat: 28.453169 },
|
|
|
|
|
+ { lng: 110.362851, lat: 28.452213 },
|
|
|
|
|
+ { lng: 110.364377, lat: 28.452443 },
|
|
|
|
|
+ { lng: 110.365138, lat: 28.45246 },
|
|
|
|
|
+ { lng: 110.366462, lat: 28.452157 },
|
|
|
|
|
+ { lng: 110.369549, lat: 28.451441 },
|
|
|
|
|
+ { lng: 110.37219, lat: 28.450897 },
|
|
|
|
|
+ { lng: 110.372753, lat: 28.450901 },
|
|
|
|
|
+ { lng: 110.373875, lat: 28.451194 },
|
|
|
|
|
+ { lng: 110.373913, lat: 28.451107 },
|
|
|
|
|
+ { lng: 110.374597, lat: 28.451476 }
|
|
|
]
|
|
]
|
|
|
}
|
|
}
|
|
|
]
|
|
]
|
|
|
|
|
|
|
|
const pipePointData = [
|
|
const pipePointData = [
|
|
|
- {
|
|
|
|
|
- id: 'point-valve-01', type: 'valve', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州北路阀门', code: 'GD-FM-001', road: '辰州北路',
|
|
|
|
|
- status: '在线', deviceModel: 'Z45X-16Q', caliber: 'DN300',
|
|
|
|
|
- lng: 110.3924, lat: 28.4743
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-valve-02', type: 'valve', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州中路阀门', code: 'GD-FM-002', road: '辰州中路',
|
|
|
|
|
- status: '在线', deviceModel: 'Z41H-25C', caliber: 'DN300',
|
|
|
|
|
- lng: 110.3936, lat: 28.4652
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-valve-03', type: 'valve', pipelineId: 'pipe-subhigh-01',
|
|
|
|
|
- name: '古城北路阀门', code: 'GD-FM-003', road: '古城北路',
|
|
|
|
|
- status: '在线', deviceModel: 'Z45X-16Q', caliber: 'DN250',
|
|
|
|
|
- lng: 110.3977, lat: 28.4741
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-valve-04', type: 'valve', pipelineId: 'pipe-medium-01',
|
|
|
|
|
- name: '迎宾东路阀门', code: 'GD-FM-004', road: '迎宾东路',
|
|
|
|
|
- status: '在线', deviceModel: 'Z41H-16C', caliber: 'DN200',
|
|
|
|
|
- lng: 110.4054, lat: 28.4630
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-regulator-01', type: 'regulator', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州路点', code: 'GD-TY-001', road: '辰州中路',
|
|
|
|
|
- status: '在线', deviceModel: 'RTZ-80/0.4F', caliber: 'DN300→DN200',
|
|
|
|
|
- lng: 110.3934, lat: 28.4585
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-regulator-02', type: 'regulator', pipelineId: 'pipe-subhigh-01',
|
|
|
|
|
- name: '古城路调压站', code: 'GD-TY-002', road: '古城中路',
|
|
|
|
|
- status: '在线', deviceModel: 'RTZ-50/0.4F', caliber: 'DN250→DN160',
|
|
|
|
|
- lng: 110.3963, lat: 28.4598
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-regulator-03', type: 'regulator', pipelineId: 'pipe-medium-02',
|
|
|
|
|
- name: '建设路调压站', code: 'GD-TY-003', road: '建设西路',
|
|
|
|
|
- status: '在线', deviceModel: 'RTZ-31/0.4Q', caliber: 'DN160→DN110',
|
|
|
|
|
- lng: 110.3840, lat: 28.4588
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-flowmeter-01', type: 'flowmeter', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州北路站', code: 'GD-LL-001', road: '辰州北路',
|
|
|
|
|
- status: '在线', deviceModel: 'LWQZ-150', caliber: 'DN300',
|
|
|
|
|
- lng: 110.3927, lat: 28.4721
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-flowmeter-02', type: 'flowmeter', pipelineId: 'pipe-medium-01',
|
|
|
|
|
- name: '迎宾西路站', code: 'GD-LL-002', road: '迎宾西路',
|
|
|
|
|
- status: '在线', deviceModel: 'LWQZ-100', caliber: 'DN200',
|
|
|
|
|
- lng: 110.3824, lat: 28.4645
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-flowmeter-03', type: 'flowmeter', pipelineId: 'pipe-medium-02',
|
|
|
|
|
- name: '建设东路站', code: 'GD-LL-003', road: '建设东路',
|
|
|
|
|
- status: '在线', deviceModel: 'LWQZ-80', caliber: 'DN110',
|
|
|
|
|
- lng: 110.4038, lat: 28.4578
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-terminal-01', type: 'terminal', pipelineId: 'pipe-medium-02',
|
|
|
|
|
- name: '沅陵县政府终端', code: 'GD-ZD-001', road: '辰州中街',
|
|
|
|
|
- status: '在线', deviceModel: 'RTU-GPRS-4G', caliber: '—',
|
|
|
|
|
- lng: 110.3937, lat: 28.4582
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'point-terminal-02', type: 'terminal', pipelineId: 'pipe-low-02',
|
|
|
|
|
- name: '天宁东路终端', code: 'GD-ZD-002', road: '天宁东路',
|
|
|
|
|
- status: '在线', deviceModel: 'RTU-GPRS-4G', caliber: '—',
|
|
|
|
|
- lng: 110.4092, lat: 28.4690
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ { id: 'point-valve-01', type: 'valve', pipelineId: 'pipe-high-01', name: 'A点', code: 'GD-FM-001', road: '燃气1', status: '在线', deviceModel: 'Z45X-16Q', caliber: 'DN300', lng: 110.362851, lat: 28.452213 },
|
|
|
|
|
+ { id: 'point-valve-02', type: 'valve', pipelineId: 'pipe-high-01', name: 'B点', code: 'GD-FM-002', road: '燃气1', status: '在线', deviceModel: 'Z41H-25C', caliber: 'DN300', lng: 110.369549, lat: 28.451441 },
|
|
|
|
|
+ { id: 'point-valve-03', type: 'valve', pipelineId: 'pipe-subhigh-01', name: 'C点', code: 'GD-FM-003', road: '燃气2', status: '在线', deviceModel: 'Z45X-16Q', caliber: 'DN250', lng: 110.373913, lat: 28.451107 },
|
|
|
|
|
+ { id: 'point-regulator-01', type: 'regulator', pipelineId: 'pipe-high-01', name: 'D点', code: 'GD-TY-001', road: '燃气1', status: '在线', deviceModel: 'RTZ-80/0.4F', caliber: 'DN300', lng: 110.401084, lat: 28.433876 },
|
|
|
|
|
+ { id: 'point-regulator-02', type: 'regulator', pipelineId: 'pipe-high-01', name: 'E点', code: 'GD-TY-002', road: '燃气1', status: '在线', deviceModel: 'RTZ-50/0.4F', caliber: 'DN250', lng: 110.391969, lat: 28.434985 },
|
|
|
|
|
+ { id: 'point-flowmeter-01', type: 'flowmeter', pipelineId: 'pipe-high-01', name: 'F点', code: 'GD-LL-001', road: '燃气1', status: '在线', deviceModel: 'LWQZ-150', caliber: 'DN300', lng: 110.376062, lat: 28.436385 },
|
|
|
|
|
+ { id: 'point-flowmeter-02', type: 'flowmeter', pipelineId: 'pipe-subhigh-01', name: 'G点', code: 'GD-LL-002', road: '燃气2', status: '在线', deviceModel: 'LWQZ-100', caliber: 'DN200', lng: 110.370581, lat: 28.438198 }
|
|
|
]
|
|
]
|
|
|
|
|
|
|
|
const manholeData = [
|
|
const manholeData = [
|
|
|
- {
|
|
|
|
|
- id: 'manhole-cover-01', type: 'cover', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州北路窨井盖', code: 'YJ-JG-001', road: '辰州北路',
|
|
|
|
|
- status: '完好', material: '球墨铸铁', size: 'Φ700',
|
|
|
|
|
- lng: 110.3920, lat: 28.4765
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-cover-02', type: 'cover', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州中路窨井盖', code: 'YJ-JG-002', road: '辰州中路',
|
|
|
|
|
- status: '完好', material: '球墨铸铁', size: 'Φ700',
|
|
|
|
|
- lng: 110.3935, lat: 28.4607
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-cover-03', type: 'cover', pipelineId: 'pipe-subhigh-01',
|
|
|
|
|
- name: '古城北路窨井盖', code: 'YJ-JG-003', road: '古城北路',
|
|
|
|
|
- status: '完好', material: '复合树脂', size: 'Φ700',
|
|
|
|
|
- lng: 110.3979, lat: 28.4765
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-cover-04', type: 'cover', pipelineId: 'pipe-medium-01',
|
|
|
|
|
- name: '迎宾路窨井盖', code: 'YJ-JG-004', road: '迎宾中路',
|
|
|
|
|
- status: '轻微破损', material: '球墨铸铁', size: 'Φ700',
|
|
|
|
|
- lng: 110.3962, lat: 28.4637
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-cover-05', type: 'cover', pipelineId: 'pipe-medium-02',
|
|
|
|
|
- name: '建设路窨井盖', code: 'YJ-JG-005', road: '建设东路',
|
|
|
|
|
- status: '完好', material: '球墨铸铁', size: 'Φ600',
|
|
|
|
|
- lng: 110.4002, lat: 28.4581
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-cover-06', type: 'cover', pipelineId: 'pipe-low-01',
|
|
|
|
|
- name: '滨江路窨井盖', code: 'YJ-JG-006', road: '滨江路',
|
|
|
|
|
- status: '完好', material: '复合树脂', size: 'Φ700',
|
|
|
|
|
- lng: 110.3954, lat: 28.4562
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-inspection-01', type: 'inspection', pipelineId: 'pipe-high-01',
|
|
|
|
|
- name: '辰州路检查井', code: 'YJ-JC-001', road: '辰州中路',
|
|
|
|
|
- status: '巡检正常', material: '钢筋混凝土', size: '1000×1000',
|
|
|
|
|
- lng: 110.3934, lat: 28.4675
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-inspection-02', type: 'inspection', pipelineId: 'pipe-subhigh-01',
|
|
|
|
|
- name: '古城路检查井', code: 'YJ-JC-002', road: '古城中路',
|
|
|
|
|
- status: '巡检正常', material: '钢筋混凝土', size: '1200×1000',
|
|
|
|
|
- lng: 110.3970, lat: 28.4669
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- id: 'manhole-inspection-03', type: 'inspection', pipelineId: 'pipe-low-02',
|
|
|
|
|
- name: '天宁路检查井', code: 'YJ-JC-003', road: '天宁西路',
|
|
|
|
|
- status: '需维护', material: '钢筋混凝土', size: '1000×1000',
|
|
|
|
|
- lng: 110.3954, lat: 28.4697
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ { id: 'manhole-cover-01', type: 'cover', pipelineId: 'pipe-high-01', name: 'A点窨井盖', code: 'YJ-JG-001', road: '燃气1', status: '完好', material: '球墨铸铁', size: 'Φ700', lng: 110.362851, lat: 28.452213 },
|
|
|
|
|
+ { id: 'manhole-cover-02', type: 'cover', pipelineId: 'pipe-high-01', name: 'B点窨井盖', code: 'YJ-JG-002', road: '燃气1', status: '完好', material: '球墨铸铁', size: 'Φ700', lng: 110.369549, lat: 28.451441 },
|
|
|
|
|
+ { id: 'manhole-inspection-01', type: 'inspection', pipelineId: 'pipe-subhigh-01', name: 'C点检查井', code: 'YJ-JC-001', road: '燃气2', status: '巡检正常', material: '钢筋混凝土', size: '1000×1000', lng: 110.373913, lat: 28.451107 },
|
|
|
]
|
|
]
|
|
|
|
|
|
|
|
const colorMap = {
|
|
const colorMap = {
|
|
@@ -613,7 +402,8 @@ function initMap() {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
try {
|
|
try {
|
|
|
- const centerBMapPoint = new BMapGL.Point(centerPoint.lng, centerPoint.lat)
|
|
|
|
|
|
|
+ const [clng, clat] = convertCoord(centerPoint.lng, centerPoint.lat)
|
|
|
|
|
+ const centerBMapPoint = new BMapGL.Point(clng, clat)
|
|
|
mapInstance.centerAndZoom(centerBMapPoint, MAP_DEFAULT_ZOOM)
|
|
mapInstance.centerAndZoom(centerBMapPoint, MAP_DEFAULT_ZOOM)
|
|
|
mapInstance.enableScrollWheelZoom(true)
|
|
mapInstance.enableScrollWheelZoom(true)
|
|
|
} catch (e) {
|
|
} catch (e) {
|
|
@@ -678,7 +468,7 @@ function renderMapScene() {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function drawBoundary() {
|
|
function drawBoundary() {
|
|
|
- const pts = boundaryPoints.map(item => new BMapGL.Point(item.lng, item.lat))
|
|
|
|
|
|
|
+ const pts = boundaryPoints.map(item => { const [lng, lat] = convertCoord(item.lng, item.lat); return new BMapGL.Point(lng, lat) })
|
|
|
const polygon = new BMapGL.Polygon(pts, {
|
|
const polygon = new BMapGL.Polygon(pts, {
|
|
|
strokeColor: '#52b788',
|
|
strokeColor: '#52b788',
|
|
|
strokeWeight: 2.5,
|
|
strokeWeight: 2.5,
|
|
@@ -694,23 +484,25 @@ function drawPipelines() {
|
|
|
pipelineData.forEach(item => {
|
|
pipelineData.forEach(item => {
|
|
|
try {
|
|
try {
|
|
|
if (!layerState.pipelines[item.level]) return
|
|
if (!layerState.pipelines[item.level]) return
|
|
|
- const pts = item.points.map(p => new BMapGL.Point(p.lng, p.lat))
|
|
|
|
|
|
|
+ const pts = item.points.map(p => { const [lng, lat] = convertCoord(p.lng, p.lat); return new BMapGL.Point(lng, lat) })
|
|
|
const polyline = new BMapGL.Polyline(pts, {
|
|
const polyline = new BMapGL.Polyline(pts, {
|
|
|
strokeColor: colorMap[item.level],
|
|
strokeColor: colorMap[item.level],
|
|
|
strokeWeight: 6,
|
|
strokeWeight: 6,
|
|
|
strokeOpacity: 0.92
|
|
strokeOpacity: 0.92
|
|
|
})
|
|
})
|
|
|
|
|
+ const firstPt = { lng: convertCoord(item.points[0].lng, item.points[0].lat)[0], lat: convertCoord(item.points[0].lng, item.points[0].lat)[1] }
|
|
|
try {
|
|
try {
|
|
|
polyline.addEventListener('click', (e) => {
|
|
polyline.addEventListener('click', (e) => {
|
|
|
overlayClicked = true
|
|
overlayClicked = true
|
|
|
e.domEvent && e.domEvent.stopPropagation && e.domEvent.stopPropagation()
|
|
e.domEvent && e.domEvent.stopPropagation && e.domEvent.stopPropagation()
|
|
|
- showPopup(item.points[0].lng, item.points[0].lat, buildPopupHTML(buildPipelineDetail(item)))
|
|
|
|
|
|
|
+ showPopup(firstPt.lng, firstPt.lat, buildPopupHTML(buildPipelineDetail(item)))
|
|
|
selectedFeature.value = buildPipelineDetail(item)
|
|
selectedFeature.value = buildPipelineDetail(item)
|
|
|
})
|
|
})
|
|
|
} catch (_) { /* polyline click listener failed */ }
|
|
} catch (_) { /* polyline click listener failed */ }
|
|
|
mapInstance.addOverlay(polyline)
|
|
mapInstance.addOverlay(polyline)
|
|
|
|
|
|
|
|
- const mid = getMidPoint(item.points)
|
|
|
|
|
|
|
+ const rawMid = getMidPoint(item.points)
|
|
|
|
|
+ const mid = { lng: convertCoord(rawMid.lng, rawMid.lat)[0], lat: convertCoord(rawMid.lng, rawMid.lat)[1] }
|
|
|
addPipeLabel(mid.lng, mid.lat, item.name, colorMap[item.level], item)
|
|
addPipeLabel(mid.lng, mid.lat, item.name, colorMap[item.level], item)
|
|
|
} catch (e) {
|
|
} catch (e) {
|
|
|
console.warn(`绘制管线 ${item.name} 失败:`, e)
|
|
console.warn(`绘制管线 ${item.name} 失败:`, e)
|
|
@@ -722,8 +514,9 @@ function drawPipePoints() {
|
|
|
pipePointData.forEach(item => {
|
|
pipePointData.forEach(item => {
|
|
|
try {
|
|
try {
|
|
|
if (!layerState.pipePoints[item.type]) return
|
|
if (!layerState.pipePoints[item.type]) return
|
|
|
- addPointMarker(item.lng, item.lat, colorMap[item.type], item.name, 'dot', () => {
|
|
|
|
|
- showPopup(item.lng, item.lat, buildPopupHTML(buildPipePointDetail(item)))
|
|
|
|
|
|
|
+ const [plng, plat] = convertCoord(item.lng, item.lat)
|
|
|
|
|
+ addPointMarker(plng, plat, colorMap[item.type], item.name, 'dot', () => {
|
|
|
|
|
+ showPopup(plng, plat, buildPopupHTML(buildPipePointDetail(item)))
|
|
|
selectedFeature.value = buildPipePointDetail(item)
|
|
selectedFeature.value = buildPipePointDetail(item)
|
|
|
})
|
|
})
|
|
|
} catch (e) {
|
|
} catch (e) {
|
|
@@ -736,8 +529,9 @@ function drawManholes() {
|
|
|
manholeData.forEach(item => {
|
|
manholeData.forEach(item => {
|
|
|
try {
|
|
try {
|
|
|
if (!layerState.manholes[item.type]) return
|
|
if (!layerState.manholes[item.type]) return
|
|
|
- addPointMarker(item.lng, item.lat, colorMap[item.type], item.name, 'square', () => {
|
|
|
|
|
- showPopup(item.lng, item.lat, buildPopupHTML(buildManholeDetail(item)))
|
|
|
|
|
|
|
+ const [mlng, mlat] = convertCoord(item.lng, item.lat)
|
|
|
|
|
+ addPointMarker(mlng, mlat, colorMap[item.type], item.name, 'square', () => {
|
|
|
|
|
+ showPopup(mlng, mlat, buildPopupHTML(buildManholeDetail(item)))
|
|
|
selectedFeature.value = buildManholeDetail(item)
|
|
selectedFeature.value = buildManholeDetail(item)
|
|
|
})
|
|
})
|
|
|
} catch (e) {
|
|
} catch (e) {
|
|
@@ -901,17 +695,18 @@ function handleSearch() {
|
|
|
return
|
|
return
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- mapInstance.centerAndZoom(new BMapGL.Point(matched.lng, matched.lat), 18)
|
|
|
|
|
|
|
+ const [mlng, mlat] = convertCoord(matched.lng, matched.lat)
|
|
|
|
|
+ mapInstance.centerAndZoom(new BMapGL.Point(mlng, mlat), 18)
|
|
|
|
|
|
|
|
if (matched.kind === 'pipeline') {
|
|
if (matched.kind === 'pipeline') {
|
|
|
selectedFeature.value = buildPipelineDetail(matched.raw)
|
|
selectedFeature.value = buildPipelineDetail(matched.raw)
|
|
|
- showPopup(matched.lng, matched.lat, buildPopupHTML(selectedFeature.value))
|
|
|
|
|
|
|
+ showPopup(mlng, mlat, buildPopupHTML(selectedFeature.value))
|
|
|
} else if (matched.kind === 'pipePoint') {
|
|
} else if (matched.kind === 'pipePoint') {
|
|
|
selectedFeature.value = buildPipePointDetail(matched.raw)
|
|
selectedFeature.value = buildPipePointDetail(matched.raw)
|
|
|
- showPopup(matched.lng, matched.lat, buildPopupHTML(selectedFeature.value))
|
|
|
|
|
|
|
+ showPopup(mlng, mlat, buildPopupHTML(selectedFeature.value))
|
|
|
} else {
|
|
} else {
|
|
|
selectedFeature.value = buildManholeDetail(matched.raw)
|
|
selectedFeature.value = buildManholeDetail(matched.raw)
|
|
|
- showPopup(matched.lng, matched.lat, buildPopupHTML(selectedFeature.value))
|
|
|
|
|
|
|
+ showPopup(mlng, mlat, buildPopupHTML(selectedFeature.value))
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
ElMessage.success(`已定位到 ${matched.name}`)
|
|
ElMessage.success(`已定位到 ${matched.name}`)
|
|
@@ -929,7 +724,8 @@ function refreshScene() {
|
|
|
|
|
|
|
|
function locateCenter() {
|
|
function locateCenter() {
|
|
|
if (!mapInstance) return
|
|
if (!mapInstance) return
|
|
|
- mapInstance.centerAndZoom(new BMapGL.Point(centerPoint.lng, centerPoint.lat), MAP_DEFAULT_ZOOM)
|
|
|
|
|
|
|
+ const [clng, clat] = convertCoord(centerPoint.lng, centerPoint.lat)
|
|
|
|
|
+ mapInstance.centerAndZoom(new BMapGL.Point(clng, clat), MAP_DEFAULT_ZOOM)
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function zoomIn() {
|
|
function zoomIn() {
|
|
@@ -958,8 +754,9 @@ function toggleFullscreen() {
|
|
|
|
|
|
|
|
function handleFullscreenChange() {
|
|
function handleFullscreenChange() {
|
|
|
if (!mapInstance) return
|
|
if (!mapInstance) return
|
|
|
|
|
+ const [clng, clat] = convertCoord(centerPoint.lng, centerPoint.lat)
|
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
|
- mapInstance.centerAndZoom(new BMapGL.Point(centerPoint.lng, centerPoint.lat), mapInstance.getZoom())
|
|
|
|
|
|
|
+ mapInstance.centerAndZoom(new BMapGL.Point(clng, clat), mapInstance.getZoom())
|
|
|
}, 200)
|
|
}, 200)
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|