| | |
| | | * @Author: shuishen 1109946754@qq.com |
| | | * @Date: 2024-10-31 10:47:29 |
| | | * @LastEditors: shuishen 1109946754@qq.com |
| | | * @LastEditTime: 2024-10-31 18:16:33 |
| | | * @LastEditTime: 2024-11-04 14:27:54 |
| | | * @FilePath: \bigScreen\src\views\layout\components\scomponents\layersControl.vue |
| | | * @Description: |
| | | * |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { getPage } from '@/api/indParkInfo' |
| | | import { getList } from "@/api/space/space" |
| | | const { VITE_APP_BASE } = import.meta.env |
| | | import { getViewer } from 'utils/getViewer' |
| | | const globalViewer = getViewer() |
| | |
| | | const data = [ |
| | | { |
| | | id: 1, |
| | | label: '三维模型', |
| | | label: '化工园区', |
| | | type: 'layer', |
| | | subType: '3Dtile', |
| | | url: VITE_APP_BASE + 'mx/tileset.json', |
| | | layerName: 'hgyq' |
| | | }, |
| | | |
| | | { |
| | | id: 2, |
| | | label: '企业分布', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getPage, |
| | | params: { |
| | | size: 1000 |
| | | }, |
| | | layerName: 'qyfb' |
| | | }, |
| | | |
| | | { |
| | | id: 3, |
| | | label: '应急空间', |
| | | children: [ |
| | | { |
| | | id: 4, |
| | | label: '倾斜摄影', |
| | | children: [ |
| | | { |
| | | id: 9, |
| | | label: '化工园区', |
| | | type: 'layer', |
| | | subType: '3Dtile', |
| | | url: VITE_APP_BASE + 'mx/tileset.json' |
| | | }, |
| | | ], |
| | | id: 3 - 1, |
| | | label: '应急池', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 1, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'yjc' |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | id: 3 - 2, |
| | | label: '阀门', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 2, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'fm' |
| | | }, |
| | | |
| | | { |
| | | id: 3 - 3, |
| | | label: '公共管网', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 3, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'gggw' |
| | | }, |
| | | |
| | | { |
| | | id: 3 - 4, |
| | | label: '污水提升泵站', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 4, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'wstsbz' |
| | | }, |
| | | |
| | | { |
| | | id: 3 - 5, |
| | | label: '水库', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 5, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'sk' |
| | | }, |
| | | |
| | | { |
| | | id: 3 - 6, |
| | | label: '应急泵', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 6, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'yjb' |
| | | }, |
| | | |
| | | { |
| | | id: 3 - 7, |
| | | label: '消防沙', |
| | | type: 'layer', |
| | | subType: 'labelPoint', |
| | | method: getList, |
| | | params: { |
| | | type: 7, |
| | | size: 1000 |
| | | }, |
| | | layerName: 'xfs' |
| | | } |
| | | ] |
| | | } |
| | | ] |
| | | |
| | | const defaultProps = { |
| | |
| | | let tileLayers = new DC.TilesetLayer('tileLayers') |
| | | globalViewer.addLayer(tileLayers) |
| | | |
| | | |
| | | |
| | | const handleCheckChange = (data, options) => { |
| | | collectedNodes.value = [] |
| | | collectNodesWithFlag(data) |
| | |
| | | ) |
| | | tileLayers.addOverlay(addTileLayers[item.layerName]) |
| | | globalViewer.flyTo(addTileLayers[item.layerName]) |
| | | } else if (item.subType == 'labelPoint') { |
| | | addTileLayers[item.layerName] = new DC.HtmlLayer('labelLayer') |
| | | globalViewer.addLayer(addTileLayers[item.layerName]) |
| | | |
| | | item.method(item.params).then(res => { |
| | | let data = res.data.data.records |
| | | |
| | | data.filter(i => i.lng && i.lng != '' && i.lat && i.lat != '').forEach(i => { |
| | | let divIcon = new DC.DivIcon( |
| | | new DC.Position(i.lng, i.lat, 0), |
| | | `<div class="public-map-popup"> |
| | | <div class="marsBlueGradientPnl"> |
| | | <div>${i.name}</div> |
| | | </div> |
| | | </div>` |
| | | ) |
| | | |
| | | addTileLayers[item.layerName].addOverlay(divIcon) |
| | | }) |
| | | }) |
| | | } |
| | | } else { |
| | | if (item.subType == '3Dtile') { |
| | | tileLayers.removeOverlay(addTileLayers[item.layerName]) |
| | | |
| | | delete addTileLayers[item.layerName] |
| | | } else if (item.subType == 'labelPoint') { |
| | | globalViewer.removeLayer(addTileLayers[item.layerName]) |
| | | } |
| | | |
| | | delete addTileLayers[item.layerName] |
| | | } |
| | | }) |
| | | } |