copy from src/views/Home/useAggregation.js
copy to src/views/Home/useEventOperate/useEventOperate.js
| File was copied from src/views/Home/useAggregation.js |
| | |
| | | import * as Cesium from 'cesium'; |
| | | import data2 from '@/assets/images/home/homeRight/data2.png'; |
| | | import data1 from '@/assets/images/home/homeRight/data1.png'; |
| | | import eventImg from '@/assets/images/home/useEventOperate/event.png'; |
| | | import jiangxishi from '@/assets/geojson/jiangxishi.json'; |
| | | import jiangxi from '@/assets/geojson/jiangxi.json'; |
| | | import zg from '@/assets/geojson/zg.json'; |
| | | import MapPopUpBox from '@/views/Home/MapPopUpBox.vue'; |
| | | import EventPopUpBox from './EventPopUpBox.vue'; |
| | | import { render } from 'vue'; |
| | | import store from '@/store'; |
| | | |
| | | /** |
| | | * 机巢聚合功能 |
| | | * 事件聚合功能 |
| | | */ |
| | | export const useAggregation = () => { |
| | | export const useEventOperate = () => { |
| | | const scalingJudgment = [ |
| | | { name: '县', value: [0, 48651], gJson: null }, |
| | | { name: '市', value: [48651, 314863], gJson: jiangxishi }, |
| | |
| | | ), |
| | | label: { |
| | | // 随机整数 |
| | | text: Math.floor(Math.random() * 100) + '号机巢', |
| | | text: Math.floor(Math.random() * 100) + '号事件', |
| | | font: '14pt monospace', |
| | | fillColor: Cesium.Color.WHITE, |
| | | outlineColor: Cesium.Color.BLACK, |
| | |
| | | pixelOffset: new Cesium.Cartesian2(0, -9), |
| | | }, |
| | | billboard: { |
| | | image: new Cesium.ConstantProperty(data1), |
| | | image: new Cesium.ConstantProperty(eventImg), |
| | | width: 24, |
| | | height: 24, |
| | | }, |
| | |
| | | position: position, |
| | | label: { |
| | | // 随机整数 |
| | | text: feature.name + Math.floor(Math.random() * 100), |
| | | text: Math.floor(Math.random() * 100) + '个事件', |
| | | font: '14pt monospace', |
| | | fillColor: Cesium.Color.WHITE, |
| | | outlineColor: Cesium.Color.BLACK, |
| | |
| | | |
| | | // 获取弹框box |
| | | const getLabelDom = () => { |
| | | const vNode = h(MapPopUpBox, { data: '参数', removeLabel }); |
| | | const vNode = h(EventPopUpBox, { data: '参数', removeLabel }); |
| | | const tooltipContainer = document.createElement('div'); |
| | | tooltipContainer.id = 'mapPopUpBox'; |
| | | tooltipContainer.style.position = 'absolute'; |
| | | tooltipContainer.style.transform = 'translateY(-50%)'; |
| | | tooltipContainer.style.transform = 'translate(-50%,-110%)'; |
| | | tooltipContainer.style.pointerEvents = 'none'; |
| | | document.querySelector('.page-index').append(tooltipContainer); |
| | | render(vNode, tooltipContainer); |
| | |
| | | |
| | | // 弹框位置刷新 |
| | | const labelBox = () => { |
| | | store.commit('setSingleUavHome', { |
| | | id: '123' |
| | | }); |
| | | let dom = document.querySelector('#mapPopUpBox'); |
| | | if (!dom) { |
| | | dom = getLabelDom(); |
| | |
| | | const pickedObject = viewer.scene.pick(click.position); |
| | | if (Cesium.defined(pickedObject) && pickedObject.id) { |
| | | const entity = pickedObject.id; |
| | | positionC3 = entity.position._value; |
| | | positionC3 = entity?.position?._value; |
| | | if (!positionC3) return; |
| | | viewer.scene.postRender.removeEventListener(labelBox); |
| | | viewer.scene.postRender.addEventListener(labelBox); |
| | | } |