百度地图替换成cesium
This commit is contained in:
parent
cca21ba6e9
commit
9e572490d5
|
|
@ -12,7 +12,7 @@
|
||||||
<link rel="stylesheet" href="./static/css/reset.css">
|
<link rel="stylesheet" href="./static/css/reset.css">
|
||||||
<link rel="stylesheet" href="./static/js/Cesium/Widgets/widgets.css">
|
<link rel="stylesheet" href="./static/js/Cesium/Widgets/widgets.css">
|
||||||
<script type="text/javascript" src="./static/js/Cesium/Cesium.js"></script>
|
<script type="text/javascript" src="./static/js/Cesium/Cesium.js"></script>
|
||||||
<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&type=webgl&ak=AwIb6rcMDySo2AKQ2hVGIjmFCL4J1oJK"></script>
|
<!-- <script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&type=webgl&ak=AwIb6rcMDySo2AKQ2hVGIjmFCL4J1oJK"></script>-->
|
||||||
<!-- <script src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script> -->
|
<!-- <script src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script> -->
|
||||||
<!-- <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyD9kf3RTO2HwggOQ1_fbZawfiKzyBNPXeY"></script> -->
|
<!-- <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyD9kf3RTO2HwggOQ1_fbZawfiKzyBNPXeY"></script> -->
|
||||||
<!-- <script type="text/javascript" src="http://124.16.219.154:8080/geoserver/gwc/service/wmts?service=WMTS&version=1.1.1&request=GetCapabilities"></script> -->
|
<!-- <script type="text/javascript" src="http://124.16.219.154:8080/geoserver/gwc/service/wmts?service=WMTS&version=1.1.1&request=GetCapabilities"></script> -->
|
||||||
|
|
|
||||||
23
src/main.js
23
src/main.js
|
|
@ -8,34 +8,17 @@ import '../static/css/fonts.css'
|
||||||
import Enlocale from '../node_modules/element-ui/lib/locale/lang/en'
|
import Enlocale from '../node_modules/element-ui/lib/locale/lang/en'
|
||||||
import Zhlocale from '../node_modules/element-ui/lib/locale/lang/zh-CN'
|
import Zhlocale from '../node_modules/element-ui/lib/locale/lang/zh-CN'
|
||||||
import router from './router/index.js'
|
import router from './router/index.js'
|
||||||
import BaiduMap from 'vue-baidu-map'
|
|
||||||
import 'echarts-gl'
|
import 'echarts-gl'
|
||||||
Vue.use(BaiduMap, {
|
|
||||||
ak: 'AwIb6rcMDySo2AKQ2hVGIjmFCL4J1oJK'
|
|
||||||
})
|
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
import qs from 'qs'
|
import qs from 'qs'
|
||||||
|
|
||||||
import store from './store/index'
|
import store from './store/index'
|
||||||
|
|
||||||
// import * as VueGoogleMaps from 'vue2-google-maps'
|
|
||||||
|
|
||||||
// Vue.use(VueGoogleMaps, {
|
|
||||||
// load: {
|
|
||||||
// key: 'AIzaSyD9kf3RTO2HwggOQ1_fbZawfiKzyBNPXeY',
|
|
||||||
// libraries: ['geometry', 'places'] // 如果需要的话
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
window.sessionStorage.setItem('webInfo', 'ASOS')
|
window.sessionStorage.setItem('webInfo', 'ASOS')
|
||||||
Vue.use(ElementUI, { locale: Zhlocale })
|
Vue.use(ElementUI, { locale: Zhlocale })
|
||||||
// router.beforeEach((to, from, next) => {
|
|
||||||
// if (to.path.split('/')[1] == 'releaseManagement') {
|
|
||||||
// Vue.use(ElementUI, { locale: Zhlocale })
|
|
||||||
// } else {
|
|
||||||
// Vue.use(ElementUI, { locale: Enlocale })
|
|
||||||
// }
|
|
||||||
// next()
|
|
||||||
// })
|
|
||||||
Vue.prototype.$axios = axios
|
Vue.prototype.$axios = axios
|
||||||
Vue.prototype.$qs = qs
|
Vue.prototype.$qs = qs
|
||||||
Vue.prototype.$echarts = echarts
|
Vue.prototype.$echarts = echarts
|
||||||
|
|
|
||||||
|
|
@ -25,27 +25,7 @@
|
||||||
<div class="map-module">
|
<div class="map-module">
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">下潜单位</div>
|
<div class="map-title">下潜单位</div>
|
||||||
<baidu-map
|
<div id="baiduCesiumContainer" ref="baiduCesiumContainer" style="height: 100%;width:100%;" />
|
||||||
:center="baiduCenter"
|
|
||||||
:zoom="baiduZoom"
|
|
||||||
:scroll-wheel-zoom="true"
|
|
||||||
map-type="BMAP_SATELLITE_MAP"
|
|
||||||
style="width: 100%; height: 100%"
|
|
||||||
>
|
|
||||||
<bm-marker
|
|
||||||
v-for="(item, index) in baiduMarker"
|
|
||||||
:key="index"
|
|
||||||
:position="item.position"
|
|
||||||
:dragging="true"
|
|
||||||
:icon="item.icon"
|
|
||||||
@click="tapBaidu(item, index)"
|
|
||||||
>
|
|
||||||
<bm-label
|
|
||||||
:content="item.content"
|
|
||||||
:offset="item.offset"
|
|
||||||
/>
|
|
||||||
</bm-marker>
|
|
||||||
</baidu-map>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">下潜地图</div>
|
<div class="map-title">下潜地图</div>
|
||||||
|
|
@ -142,10 +122,9 @@ export default {
|
||||||
unit: '个'
|
unit: '个'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
baiduCenter: { lng: 114.4040, lat: 30.5196 },
|
// Cesium相关 - 参航单位地图
|
||||||
baiduZoom: 5,
|
baiduCesiumViewer: null,
|
||||||
baiduMarker: [],
|
baiduCesiumEntities: [], // 存储参航单位标记实体
|
||||||
activeMarkerIndex: -1, // 当前激活的标记点索引
|
|
||||||
viewer: null,
|
viewer: null,
|
||||||
// 地图图层基础地址
|
// 地图图层基础地址
|
||||||
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
||||||
|
|
@ -168,7 +147,17 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
||||||
this.initCesium()
|
this.initCesium() // 初始化航次地图
|
||||||
|
this.initBaiduCesium() // 初始化参航单位地图
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 清理Cesium资源
|
||||||
|
if (this.baiduCesiumViewer) {
|
||||||
|
this.baiduCesiumViewer.destroy()
|
||||||
|
}
|
||||||
|
if (this.viewer) {
|
||||||
|
this.viewer.destroy()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 载人潜水器数据
|
// 载人潜水器数据
|
||||||
|
|
@ -206,20 +195,11 @@ export default {
|
||||||
// 下潜单位统计
|
// 下潜单位统计
|
||||||
getHovUnit() {
|
getHovUnit() {
|
||||||
hovUnit().then(res => {
|
hovUnit().then(res => {
|
||||||
this.baiduMarker = res.array.map(item => {
|
// 清除之前的标记
|
||||||
return {
|
this.clearBaiduCesiumMarkers()
|
||||||
position: {
|
|
||||||
lng: item.unit_lon,
|
// 创建参航单位标记
|
||||||
lat: item.unit_lat
|
this.createBaiduCesiumMarkers(res.array)
|
||||||
},
|
|
||||||
content: item.unit_name,
|
|
||||||
offset: { width: 16, height: 32 },
|
|
||||||
icon: {
|
|
||||||
url: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg==',
|
|
||||||
size: { width: 32, height: 32 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const typeCount = res.array.reduce((acc, unit) => {
|
const typeCount = res.array.reduce((acc, unit) => {
|
||||||
const type = unit.unit_type
|
const type = unit.unit_type
|
||||||
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
||||||
|
|
@ -231,6 +211,55 @@ export default {
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
// 创建参航单位Cesium标记点
|
||||||
|
createBaiduCesiumMarkers(units) {
|
||||||
|
if (!this.baiduCesiumViewer) return
|
||||||
|
|
||||||
|
const entities = []
|
||||||
|
|
||||||
|
units.forEach((item, index) => {
|
||||||
|
// 创建标记实体
|
||||||
|
const entity = this.baiduCesiumViewer.entities.add({
|
||||||
|
position: Cesium.Cartesian3.fromDegrees(item.unit_lon, item.unit_lat),
|
||||||
|
billboard: {
|
||||||
|
image: '../../../static/img/01.png', // 正常状态的图标
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: item.unit_name,
|
||||||
|
font: '14pt monospace',
|
||||||
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||||
|
outlineWidth: 2,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
pixelOffset: new Cesium.Cartesian2(0, -40), // 标签在标记下方
|
||||||
|
fillColor: Cesium.Color.WHITE,
|
||||||
|
outlineColor: Cesium.Color.BLACK
|
||||||
|
},
|
||||||
|
unitData: item, // 存储原始数据
|
||||||
|
index: index // 存储索引
|
||||||
|
})
|
||||||
|
entities.push(entity)
|
||||||
|
})
|
||||||
|
|
||||||
|
this.baiduCesiumEntities = entities
|
||||||
|
|
||||||
|
// 调整视角以显示所有标记
|
||||||
|
if (entities.length > 0) {
|
||||||
|
this.baiduCesiumViewer.zoomTo(entities)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 清除参航单位标记
|
||||||
|
clearBaiduCesiumMarkers() {
|
||||||
|
if (this.baiduCesiumViewer && this.baiduCesiumEntities.length > 0) {
|
||||||
|
this.baiduCesiumEntities.forEach(entity => {
|
||||||
|
this.baiduCesiumViewer.entities.remove(entity)
|
||||||
|
})
|
||||||
|
this.baiduCesiumEntities = []
|
||||||
|
}
|
||||||
|
},
|
||||||
// 潜次统计
|
// 潜次统计
|
||||||
gitHovDiving(params = {}) {
|
gitHovDiving(params = {}) {
|
||||||
hovDiving(params).then(res => {
|
hovDiving(params).then(res => {
|
||||||
|
|
@ -240,19 +269,40 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
tapBaidu(item, index) {
|
// 初始化Cesium - 参航单位地图
|
||||||
// 重置所有标记点为普通图标
|
initBaiduCesium() {
|
||||||
this.baiduMarker.forEach(marker => {
|
this.baiduCesiumViewer = new Cesium.Viewer(this.$refs.baiduCesiumContainer, {
|
||||||
marker.icon.url = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg=='
|
sceneMode: Cesium.SceneMode.SCENE2D,
|
||||||
marker.icon.size = { width: 32, height: 32 }
|
shadows: false,
|
||||||
marker.offset = { width: 16, height: 32 }
|
timeline: false,
|
||||||
|
baseLayerPicker: false,
|
||||||
|
imageryProviderViewModels: this.imageryViewModels,
|
||||||
|
terrainProviderViewModels: [],
|
||||||
|
fullscreenButton: false,
|
||||||
|
selectionIndicator: false,
|
||||||
|
homeButton: false,
|
||||||
|
sceneModePicker: false,
|
||||||
|
animation: false,
|
||||||
|
infoBox: false,
|
||||||
|
geocoder: false,
|
||||||
|
navigationHelpButton: false
|
||||||
|
})
|
||||||
|
this.baiduCesiumViewer._cesiumWidget._creditContainer.style.display = 'none'
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.moon.show = false
|
||||||
|
this.baiduCesiumViewer.scene.fog.enabled = false
|
||||||
|
this.baiduCesiumViewer.scene.skyAtmosphere.show = false
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.skyBox.show = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.enableLighting = false
|
||||||
|
this.baiduCesiumViewer.shadowMap.darkness = 0.8
|
||||||
|
this.baiduCesiumViewer.scene._sunBloom = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.showGroundAtmosphere = false
|
||||||
|
this.baiduCesiumViewer.scene.postProcessStages.fxaa.enabled = true
|
||||||
|
|
||||||
|
this.baiduCesiumViewer.camera.setView({
|
||||||
|
destination: Cesium.Cartesian3.fromDegrees(114.4040, 30.5196, 4000000)
|
||||||
})
|
})
|
||||||
// 设置当前点击的标记点为高亮图标
|
|
||||||
this.baiduMarker[index].icon.url = 'data:image/png;base64,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'
|
|
||||||
this.baiduMarker[index].icon.size = { width: 48, height: 48 } // 高亮时稍大一些
|
|
||||||
this.baiduMarker[index].offset = { width: 24, height: 48 } // 高亮时稍大一些
|
|
||||||
// 记录当前激活的标记点索引
|
|
||||||
this.activeMarkerIndex = index
|
|
||||||
},
|
},
|
||||||
// 初始化cesium
|
// 初始化cesium
|
||||||
initCesium() {
|
initCesium() {
|
||||||
|
|
@ -473,16 +523,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* 隐藏百度地图Logo和版权信息 */
|
|
||||||
.anchorBL {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.BMap_cpyCtrl {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.el-icon-arrow-down {
|
.el-icon-arrow-down {
|
||||||
font-size: 12px
|
font-size: 12px
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -25,27 +25,7 @@
|
||||||
<div class="map-module">
|
<div class="map-module">
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">下潜单位</div>
|
<div class="map-title">下潜单位</div>
|
||||||
<baidu-map
|
<div id="baiduCesiumContainer" ref="baiduCesiumContainer" style="height: 100%;width:100%;" />
|
||||||
:center="baiduCenter"
|
|
||||||
:zoom="baiduZoom"
|
|
||||||
:scroll-wheel-zoom="true"
|
|
||||||
map-type="BMAP_SATELLITE_MAP"
|
|
||||||
style="width: 100%; height: 100%"
|
|
||||||
>
|
|
||||||
<bm-marker
|
|
||||||
v-for="(item, index) in baiduMarker"
|
|
||||||
:key="index"
|
|
||||||
:position="item.position"
|
|
||||||
:dragging="true"
|
|
||||||
:icon="item.icon"
|
|
||||||
@click="tapBaidu(item, index)"
|
|
||||||
>
|
|
||||||
<bm-label
|
|
||||||
:content="item.content"
|
|
||||||
:offset="item.offset"
|
|
||||||
/>
|
|
||||||
</bm-marker>
|
|
||||||
</baidu-map>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">下潜地图</div>
|
<div class="map-title">下潜地图</div>
|
||||||
|
|
@ -142,10 +122,9 @@ export default {
|
||||||
unit: '个'
|
unit: '个'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
baiduCenter: { lng: 114.4040, lat: 30.5196 },
|
// Cesium相关 - 参航单位地图
|
||||||
baiduZoom: 5,
|
baiduCesiumViewer: null,
|
||||||
baiduMarker: [],
|
baiduCesiumEntities: [], // 存储参航单位标记实体
|
||||||
activeMarkerIndex: -1, // 当前激活的标记点索引
|
|
||||||
viewer: null,
|
viewer: null,
|
||||||
// 地图图层基础地址
|
// 地图图层基础地址
|
||||||
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
||||||
|
|
@ -168,7 +147,17 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
||||||
this.initCesium()
|
this.initCesium() // 初始化航次地图
|
||||||
|
this.initBaiduCesium() // 初始化参航单位地图
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 清理Cesium资源
|
||||||
|
if (this.baiduCesiumViewer) {
|
||||||
|
this.baiduCesiumViewer.destroy()
|
||||||
|
}
|
||||||
|
if (this.viewer) {
|
||||||
|
this.viewer.destroy()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 遥控潜水器数据
|
// 遥控潜水器数据
|
||||||
|
|
@ -206,20 +195,11 @@ export default {
|
||||||
// 下潜单位统计
|
// 下潜单位统计
|
||||||
getHovUnit() {
|
getHovUnit() {
|
||||||
hovUnit().then(res => {
|
hovUnit().then(res => {
|
||||||
this.baiduMarker = res.array.map(item => {
|
// 清除之前的标记
|
||||||
return {
|
this.clearBaiduCesiumMarkers()
|
||||||
position: {
|
|
||||||
lng: item.unit_lon,
|
// 创建参航单位标记
|
||||||
lat: item.unit_lat
|
this.createBaiduCesiumMarkers(res.array)
|
||||||
},
|
|
||||||
content: item.unit_name,
|
|
||||||
offset: { width: 16, height: 32 },
|
|
||||||
icon: {
|
|
||||||
url: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg==',
|
|
||||||
size: { width: 32, height: 32 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const typeCount = res.array.reduce((acc, unit) => {
|
const typeCount = res.array.reduce((acc, unit) => {
|
||||||
const type = unit.unit_type
|
const type = unit.unit_type
|
||||||
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
||||||
|
|
@ -231,6 +211,55 @@ export default {
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
// 创建参航单位Cesium标记点
|
||||||
|
createBaiduCesiumMarkers(units) {
|
||||||
|
if (!this.baiduCesiumViewer) return
|
||||||
|
|
||||||
|
const entities = []
|
||||||
|
|
||||||
|
units.forEach((item, index) => {
|
||||||
|
// 创建标记实体
|
||||||
|
const entity = this.baiduCesiumViewer.entities.add({
|
||||||
|
position: Cesium.Cartesian3.fromDegrees(item.unit_lon, item.unit_lat),
|
||||||
|
billboard: {
|
||||||
|
image: '../../../static/img/01.png', // 正常状态的图标
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: item.unit_name,
|
||||||
|
font: '14pt monospace',
|
||||||
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||||
|
outlineWidth: 2,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
pixelOffset: new Cesium.Cartesian2(0, -40), // 标签在标记下方
|
||||||
|
fillColor: Cesium.Color.WHITE,
|
||||||
|
outlineColor: Cesium.Color.BLACK
|
||||||
|
},
|
||||||
|
unitData: item, // 存储原始数据
|
||||||
|
index: index // 存储索引
|
||||||
|
})
|
||||||
|
entities.push(entity)
|
||||||
|
})
|
||||||
|
|
||||||
|
this.baiduCesiumEntities = entities
|
||||||
|
|
||||||
|
// 调整视角以显示所有标记
|
||||||
|
if (entities.length > 0) {
|
||||||
|
this.baiduCesiumViewer.zoomTo(entities)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 清除参航单位标记
|
||||||
|
clearBaiduCesiumMarkers() {
|
||||||
|
if (this.baiduCesiumViewer && this.baiduCesiumEntities.length > 0) {
|
||||||
|
this.baiduCesiumEntities.forEach(entity => {
|
||||||
|
this.baiduCesiumViewer.entities.remove(entity)
|
||||||
|
})
|
||||||
|
this.baiduCesiumEntities = []
|
||||||
|
}
|
||||||
|
},
|
||||||
// 潜次统计
|
// 潜次统计
|
||||||
gitHovDiving(params = {}) {
|
gitHovDiving(params = {}) {
|
||||||
hovDiving(params).then(res => {
|
hovDiving(params).then(res => {
|
||||||
|
|
@ -240,19 +269,40 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
tapBaidu(item, index) {
|
// 初始化Cesium - 参航单位地图
|
||||||
// 重置所有标记点为普通图标
|
initBaiduCesium() {
|
||||||
this.baiduMarker.forEach(marker => {
|
this.baiduCesiumViewer = new Cesium.Viewer(this.$refs.baiduCesiumContainer, {
|
||||||
marker.icon.url = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg=='
|
sceneMode: Cesium.SceneMode.SCENE2D,
|
||||||
marker.icon.size = { width: 32, height: 32 }
|
shadows: false,
|
||||||
marker.offset = { width: 16, height: 32 }
|
timeline: false,
|
||||||
|
baseLayerPicker: false,
|
||||||
|
imageryProviderViewModels: this.imageryViewModels,
|
||||||
|
terrainProviderViewModels: [],
|
||||||
|
fullscreenButton: false,
|
||||||
|
selectionIndicator: false,
|
||||||
|
homeButton: false,
|
||||||
|
sceneModePicker: false,
|
||||||
|
animation: false,
|
||||||
|
infoBox: false,
|
||||||
|
geocoder: false,
|
||||||
|
navigationHelpButton: false
|
||||||
|
})
|
||||||
|
this.baiduCesiumViewer._cesiumWidget._creditContainer.style.display = 'none'
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.moon.show = false
|
||||||
|
this.baiduCesiumViewer.scene.fog.enabled = false
|
||||||
|
this.baiduCesiumViewer.scene.skyAtmosphere.show = false
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.skyBox.show = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.enableLighting = false
|
||||||
|
this.baiduCesiumViewer.shadowMap.darkness = 0.8
|
||||||
|
this.baiduCesiumViewer.scene._sunBloom = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.showGroundAtmosphere = false
|
||||||
|
this.baiduCesiumViewer.scene.postProcessStages.fxaa.enabled = true
|
||||||
|
|
||||||
|
this.baiduCesiumViewer.camera.setView({
|
||||||
|
destination: Cesium.Cartesian3.fromDegrees(114.4040, 30.5196, 4000000)
|
||||||
})
|
})
|
||||||
// 设置当前点击的标记点为高亮图标
|
|
||||||
this.baiduMarker[index].icon.url = 'data:image/png;base64,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'
|
|
||||||
this.baiduMarker[index].icon.size = { width: 48, height: 48 } // 高亮时稍大一些
|
|
||||||
this.baiduMarker[index].offset = { width: 24, height: 48 } // 高亮时稍大一些
|
|
||||||
// 记录当前激活的标记点索引
|
|
||||||
this.activeMarkerIndex = index
|
|
||||||
},
|
},
|
||||||
// 初始化cesium
|
// 初始化cesium
|
||||||
initCesium() {
|
initCesium() {
|
||||||
|
|
@ -473,16 +523,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* 隐藏百度地图Logo和版权信息 */
|
|
||||||
.anchorBL {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.BMap_cpyCtrl {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.el-icon-arrow-down {
|
.el-icon-arrow-down {
|
||||||
font-size: 12px
|
font-size: 12px
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -25,27 +25,7 @@
|
||||||
<div class="map-module">
|
<div class="map-module">
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">参航单位</div>
|
<div class="map-title">参航单位</div>
|
||||||
<baidu-map
|
<div id="baiduCesiumContainer" ref="baiduCesiumContainer" style="height: 100%;width:100%;" />
|
||||||
:center="baiduCenter"
|
|
||||||
:zoom="baiduZoom"
|
|
||||||
:scroll-wheel-zoom="true"
|
|
||||||
map-type="BMAP_SATELLITE_MAP"
|
|
||||||
style="width: 100%; height: 100%"
|
|
||||||
>
|
|
||||||
<bm-marker
|
|
||||||
v-for="(item, index) in baiduMarker"
|
|
||||||
:key="index"
|
|
||||||
:position="item.position"
|
|
||||||
:dragging="true"
|
|
||||||
:icon="item.icon"
|
|
||||||
@click="tapBaidu(item, index)"
|
|
||||||
>
|
|
||||||
<bm-label
|
|
||||||
:content="item.content"
|
|
||||||
:offset="item.offset"
|
|
||||||
/>
|
|
||||||
</bm-marker>
|
|
||||||
</baidu-map>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">航次地图</div>
|
<div class="map-title">航次地图</div>
|
||||||
|
|
@ -149,10 +129,9 @@ export default {
|
||||||
unit: 'KM'
|
unit: 'KM'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
baiduCenter: { lng: 114.4040, lat: 30.5196 },
|
// Cesium相关 - 参航单位地图
|
||||||
baiduZoom: 5,
|
baiduCesiumViewer: null,
|
||||||
baiduMarker: [],
|
baiduCesiumEntities: [], // 存储参航单位标记实体
|
||||||
activeMarkerIndex: -1, // 当前激活的标记点索引
|
|
||||||
viewer: null,
|
viewer: null,
|
||||||
// 地图图层基础地址
|
// 地图图层基础地址
|
||||||
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
||||||
|
|
@ -175,7 +154,17 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
||||||
this.initCesium()
|
this.initCesium() // 初始化航次地图
|
||||||
|
this.initBaiduCesium() // 初始化参航单位地图
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 清理Cesium资源
|
||||||
|
if (this.baiduCesiumViewer) {
|
||||||
|
this.baiduCesiumViewer.destroy()
|
||||||
|
}
|
||||||
|
if (this.viewer) {
|
||||||
|
this.viewer.destroy()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 科考船数据
|
// 科考船数据
|
||||||
|
|
@ -214,20 +203,12 @@ export default {
|
||||||
// 参航单位统计
|
// 参航单位统计
|
||||||
getShipUnit() {
|
getShipUnit() {
|
||||||
shipUnit().then(res => {
|
shipUnit().then(res => {
|
||||||
this.baiduMarker = res.array.map(item => {
|
// 清除之前的标记
|
||||||
return {
|
this.clearBaiduCesiumMarkers()
|
||||||
position: {
|
|
||||||
lng: item.unit_lon,
|
// 创建参航单位标记
|
||||||
lat: item.unit_lat
|
this.createBaiduCesiumMarkers(res.array)
|
||||||
},
|
|
||||||
content: item.unit_name,
|
|
||||||
offset: { width: 16, height: 32 },
|
|
||||||
icon: {
|
|
||||||
url: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg==',
|
|
||||||
size: { width: 32, height: 32 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const typeCount = res.array.reduce((acc, unit) => {
|
const typeCount = res.array.reduce((acc, unit) => {
|
||||||
const type = unit.unit_type
|
const type = unit.unit_type
|
||||||
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
||||||
|
|
@ -239,6 +220,55 @@ export default {
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
// 创建参航单位Cesium标记点
|
||||||
|
createBaiduCesiumMarkers(units) {
|
||||||
|
if (!this.baiduCesiumViewer) return
|
||||||
|
|
||||||
|
const entities = []
|
||||||
|
|
||||||
|
units.forEach((item, index) => {
|
||||||
|
// 创建标记实体
|
||||||
|
const entity = this.baiduCesiumViewer.entities.add({
|
||||||
|
position: Cesium.Cartesian3.fromDegrees(item.unit_lon, item.unit_lat),
|
||||||
|
billboard: {
|
||||||
|
image: '../../../static/img/01.png', // 正常状态的图标
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: item.unit_name,
|
||||||
|
font: '14pt monospace',
|
||||||
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||||
|
outlineWidth: 2,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
pixelOffset: new Cesium.Cartesian2(0, -40), // 标签在标记下方
|
||||||
|
fillColor: Cesium.Color.WHITE,
|
||||||
|
outlineColor: Cesium.Color.BLACK
|
||||||
|
},
|
||||||
|
unitData: item, // 存储原始数据
|
||||||
|
index: index // 存储索引
|
||||||
|
})
|
||||||
|
entities.push(entity)
|
||||||
|
})
|
||||||
|
|
||||||
|
this.baiduCesiumEntities = entities
|
||||||
|
|
||||||
|
// 调整视角以显示所有标记
|
||||||
|
if (entities.length > 0) {
|
||||||
|
this.baiduCesiumViewer.zoomTo(entities)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 清除参航单位标记
|
||||||
|
clearBaiduCesiumMarkers() {
|
||||||
|
if (this.baiduCesiumViewer && this.baiduCesiumEntities.length > 0) {
|
||||||
|
this.baiduCesiumEntities.forEach(entity => {
|
||||||
|
this.baiduCesiumViewer.entities.remove(entity)
|
||||||
|
})
|
||||||
|
this.baiduCesiumEntities = []
|
||||||
|
}
|
||||||
|
},
|
||||||
// 航次统计
|
// 航次统计
|
||||||
gitShipVoyage(params = {}) {
|
gitShipVoyage(params = {}) {
|
||||||
shipVoyage(params).then(res => {
|
shipVoyage(params).then(res => {
|
||||||
|
|
@ -248,20 +278,40 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
tapBaidu(item, index) {
|
// 初始化Cesium - 参航单位地图
|
||||||
console.log(item)
|
initBaiduCesium() {
|
||||||
// 重置所有标记点为普通图标
|
this.baiduCesiumViewer = new Cesium.Viewer(this.$refs.baiduCesiumContainer, {
|
||||||
this.baiduMarker.forEach(marker => {
|
sceneMode: Cesium.SceneMode.SCENE2D,
|
||||||
marker.icon.url = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg=='
|
shadows: false,
|
||||||
marker.icon.size = { width: 32, height: 32 }
|
timeline: false,
|
||||||
marker.offset = { width: 16, height: 32 }
|
baseLayerPicker: false,
|
||||||
|
imageryProviderViewModels: this.imageryViewModels,
|
||||||
|
terrainProviderViewModels: [],
|
||||||
|
fullscreenButton: false,
|
||||||
|
selectionIndicator: false,
|
||||||
|
homeButton: false,
|
||||||
|
sceneModePicker: false,
|
||||||
|
animation: false,
|
||||||
|
infoBox: false,
|
||||||
|
geocoder: false,
|
||||||
|
navigationHelpButton: false
|
||||||
|
})
|
||||||
|
this.baiduCesiumViewer._cesiumWidget._creditContainer.style.display = 'none'
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.moon.show = false
|
||||||
|
this.baiduCesiumViewer.scene.fog.enabled = false
|
||||||
|
this.baiduCesiumViewer.scene.skyAtmosphere.show = false
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.skyBox.show = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.enableLighting = false
|
||||||
|
this.baiduCesiumViewer.shadowMap.darkness = 0.8
|
||||||
|
this.baiduCesiumViewer.scene._sunBloom = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.showGroundAtmosphere = false
|
||||||
|
this.baiduCesiumViewer.scene.postProcessStages.fxaa.enabled = true
|
||||||
|
|
||||||
|
this.baiduCesiumViewer.camera.setView({
|
||||||
|
destination: Cesium.Cartesian3.fromDegrees(114.4040, 30.5196, 4000000)
|
||||||
})
|
})
|
||||||
// 设置当前点击的标记点为高亮图标
|
|
||||||
this.baiduMarker[index].icon.url = 'data:image/png;base64,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'
|
|
||||||
this.baiduMarker[index].icon.size = { width: 48, height: 48 } // 高亮时稍大一些
|
|
||||||
this.baiduMarker[index].offset = { width: 24, height: 48 } // 高亮时稍大一些
|
|
||||||
// 记录当前激活的标记点索引
|
|
||||||
this.activeMarkerIndex = index
|
|
||||||
},
|
},
|
||||||
// 初始化cesium
|
// 初始化cesium
|
||||||
initCesium() {
|
initCesium() {
|
||||||
|
|
@ -489,16 +539,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* 隐藏百度地图Logo和版权信息 */
|
|
||||||
.anchorBL {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.BMap_cpyCtrl {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.el-icon-arrow-down {
|
.el-icon-arrow-down {
|
||||||
font-size: 12px
|
font-size: 12px
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -25,27 +25,7 @@
|
||||||
<div class="map-module">
|
<div class="map-module">
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">下潜单位</div>
|
<div class="map-title">下潜单位</div>
|
||||||
<baidu-map
|
<div id="baiduCesiumContainer" ref="baiduCesiumContainer" style="height: 100%;width:100%;" />
|
||||||
:center="baiduCenter"
|
|
||||||
:zoom="baiduZoom"
|
|
||||||
:scroll-wheel-zoom="true"
|
|
||||||
map-type="BMAP_SATELLITE_MAP"
|
|
||||||
style="width: 100%; height: 100%"
|
|
||||||
>
|
|
||||||
<bm-marker
|
|
||||||
v-for="(item, index) in baiduMarker"
|
|
||||||
:key="index"
|
|
||||||
:position="item.position"
|
|
||||||
:dragging="true"
|
|
||||||
:icon="item.icon"
|
|
||||||
@click="tapBaidu(item, index)"
|
|
||||||
>
|
|
||||||
<bm-label
|
|
||||||
:content="item.content"
|
|
||||||
:offset="item.offset"
|
|
||||||
/>
|
|
||||||
</bm-marker>
|
|
||||||
</baidu-map>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="bezel">
|
<div class="bezel">
|
||||||
<div class="map-title">下潜地图</div>
|
<div class="map-title">下潜地图</div>
|
||||||
|
|
@ -142,10 +122,9 @@ export default {
|
||||||
unit: '个'
|
unit: '个'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
baiduCenter: { lng: 114.4040, lat: 30.5196 },
|
// Cesium相关 - 参航单位地图
|
||||||
baiduZoom: 5,
|
baiduCesiumViewer: null,
|
||||||
baiduMarker: [],
|
baiduCesiumEntities: [], // 存储参航单位标记实体
|
||||||
activeMarkerIndex: -1, // 当前激活的标记点索引
|
|
||||||
viewer: null,
|
viewer: null,
|
||||||
// 地图图层基础地址
|
// 地图图层基础地址
|
||||||
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
CesiumHostAddr: `${window.location.protocol}//${window.location.hostname}:${window.location.port}/`,
|
||||||
|
|
@ -168,7 +147,17 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr)
|
||||||
this.initCesium()
|
this.initCesium() // 初始化航次地图
|
||||||
|
this.initBaiduCesium() // 初始化参航单位地图
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 清理Cesium资源
|
||||||
|
if (this.baiduCesiumViewer) {
|
||||||
|
this.baiduCesiumViewer.destroy()
|
||||||
|
}
|
||||||
|
if (this.viewer) {
|
||||||
|
this.viewer.destroy()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 无人航行潜水器数据
|
// 无人航行潜水器数据
|
||||||
|
|
@ -206,20 +195,11 @@ export default {
|
||||||
// 下潜单位统计
|
// 下潜单位统计
|
||||||
getHovUnit() {
|
getHovUnit() {
|
||||||
hovUnit().then(res => {
|
hovUnit().then(res => {
|
||||||
this.baiduMarker = res.array.map(item => {
|
// 清除之前的标记
|
||||||
return {
|
this.clearBaiduCesiumMarkers()
|
||||||
position: {
|
|
||||||
lng: item.unit_lon,
|
// 创建参航单位标记
|
||||||
lat: item.unit_lat
|
this.createBaiduCesiumMarkers(res.array)
|
||||||
},
|
|
||||||
content: item.unit_name,
|
|
||||||
offset: { width: 16, height: 32 },
|
|
||||||
icon: {
|
|
||||||
url: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg==',
|
|
||||||
size: { width: 32, height: 32 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const typeCount = res.array.reduce((acc, unit) => {
|
const typeCount = res.array.reduce((acc, unit) => {
|
||||||
const type = unit.unit_type
|
const type = unit.unit_type
|
||||||
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1,否则初始化为1
|
||||||
|
|
@ -231,6 +211,55 @@ export default {
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
// 创建参航单位Cesium标记点
|
||||||
|
createBaiduCesiumMarkers(units) {
|
||||||
|
if (!this.baiduCesiumViewer) return
|
||||||
|
|
||||||
|
const entities = []
|
||||||
|
|
||||||
|
units.forEach((item, index) => {
|
||||||
|
// 创建标记实体
|
||||||
|
const entity = this.baiduCesiumViewer.entities.add({
|
||||||
|
position: Cesium.Cartesian3.fromDegrees(item.unit_lon, item.unit_lat),
|
||||||
|
billboard: {
|
||||||
|
image: '../../../static/img/01.png', // 正常状态的图标
|
||||||
|
width: 32,
|
||||||
|
height: 32,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: item.unit_name,
|
||||||
|
font: '14pt monospace',
|
||||||
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||||
|
outlineWidth: 2,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||||
|
pixelOffset: new Cesium.Cartesian2(0, -40), // 标签在标记下方
|
||||||
|
fillColor: Cesium.Color.WHITE,
|
||||||
|
outlineColor: Cesium.Color.BLACK
|
||||||
|
},
|
||||||
|
unitData: item, // 存储原始数据
|
||||||
|
index: index // 存储索引
|
||||||
|
})
|
||||||
|
entities.push(entity)
|
||||||
|
})
|
||||||
|
|
||||||
|
this.baiduCesiumEntities = entities
|
||||||
|
|
||||||
|
// 调整视角以显示所有标记
|
||||||
|
if (entities.length > 0) {
|
||||||
|
this.baiduCesiumViewer.zoomTo(entities)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 清除参航单位标记
|
||||||
|
clearBaiduCesiumMarkers() {
|
||||||
|
if (this.baiduCesiumViewer && this.baiduCesiumEntities.length > 0) {
|
||||||
|
this.baiduCesiumEntities.forEach(entity => {
|
||||||
|
this.baiduCesiumViewer.entities.remove(entity)
|
||||||
|
})
|
||||||
|
this.baiduCesiumEntities = []
|
||||||
|
}
|
||||||
|
},
|
||||||
// 潜次统计
|
// 潜次统计
|
||||||
gitHovDiving(params = {}) {
|
gitHovDiving(params = {}) {
|
||||||
hovDiving(params).then(res => {
|
hovDiving(params).then(res => {
|
||||||
|
|
@ -240,19 +269,40 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
tapBaidu(item, index) {
|
// 初始化Cesium - 参航单位地图
|
||||||
// 重置所有标记点为普通图标
|
initBaiduCesium() {
|
||||||
this.baiduMarker.forEach(marker => {
|
this.baiduCesiumViewer = new Cesium.Viewer(this.$refs.baiduCesiumContainer, {
|
||||||
marker.icon.url = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAE9klEQVR4AZxXXWgcVRT+zkwaBS0mu1FpSyHFbKoIQjFoRSh5EX8QbYVKq4I+hLa7qRWCf32QRoh/gfqSzcYQiyDUlgZFffHnoRGhQsFQwWLYbKx9kFokuwkRSrHZuf3OzOzuTGaS3c3lfnPO/c65Z76Zu3Nn1kIT7Y6Jy9sSuUJfe64wRZsnlnzkfa5Pc5ooiYYEdOTmHkzkZsftGzcusfiEAL0AuomNPrp9bkJzNFfnMFa31xWQzBWOOjC/AnIAXrtK870IPjTi7FeorxyhMRo5oHOSnMvBmn1NAYnR/KAB3q9VkKFSJrWJeLKYTh1dSG8/rVBfOWITIEPwm87VGv4w1qwqIJEr7IVYx/xZ05a9YXMp0/WOP17VaI7mMmGagNZwayG+xQpIjv/1MNPPEOBVfF7KpHrmD3b+o+NGoLk6R+f6+Wf8mv6wZmIFGKf8mpsi+Hshk3rZ9ddxcOeyhk6t1tRBABEB7dn8UzBmv5/T59uQSY7lH+JtPZ7IzX3poXBcuVBSbeDVYE23do13vYgAse3dGjEG35TSqR/UDyKZze8xRr4jNwCY5zxgQDmNkQ91rWFYS8lKbfUriAjg1e9xg4I/XBs4tI3NdBrL/hiQBID/mHvKhfrkNKY5jIV7pZYxXu1ANCRgY3YmyVgHwQuzfndt4GCZFv42TCepi9zCdpb6u19QqO9yMJ1eDkfBbqq1OvxzVKMhAS0GmysR28B7jCqEZ3UHpDg5VzqUqt4h1zdyzkuBl4NaC9YKnkMzQgJ4C20lFSLXr6gNgmu5RcfGKv+kNogKV8kJxhzH8XdIwLY3tAZjIQGL/d2/MbhIoIxbHlAbhAi+1bEYK/JoVrhKjuZVsQGPVPxWe3Gm4qsNCVDCAD+7ViQiAIJJjRFPtPON2DZS6FWorxyBQA6qzXFcAQJcuHKw51qVpxMRIMa5QJ7dPM5DqOsjReIEwfOg17IxpRCgsu4n/BwEm4j1jI65PGfVBhERANtyt2CB2a1XF0xWn1tsH094mL7+SBdoFdPKaYzjUE9kZx/jXd3hkctfebZ2jAhwf9HwbrXVIpG11qnFTGqUJ+shEj56lNNYBJY873NnS/33/eL7VRMR4Ee8tTbmlbi74OfUNW3Z2V1M8rZi4BT9SI8VwKuahHg/RrFxLDKrQcKyRJcKWos1P0VMixXg5jl4Ty3XtrfeR4XmrUQyW3iW3F4CMMi6NuawqoBSf+pH5nPf55EfJk0txeBUi7HwNmfyVcGXWiY1qX4cVhWgycvX/9e7cFH9ZpYiedcWPflOzrtmO+XqJxrHkb6mgKWB+0tGREVwGdHQUrSNFXbweVcBOmdo/tV7+UEbOW+VWFOAZi2ku07TfkYAXIqOXMHdVBDT7hz993bLYAQit1HEFB/ND2LSQlRdAZq93Hrr67TnCfBzezgxOrdV/ZUoy+IEuUcBuWrb1ptooDUkYKlva0kco98CJUC2Q5xhrGiJ3Bw52ac0n5z0/KF71rz1mqdoSIAmFg93n+fv4Yj6gOxrH52tXiFPzj8t5g2wcQs/Usx0fU23od6wAK22kE6dhGAQbCLyUfvYn0+3fXJpFx/0cbCRGy5mukfoNtybEqBV+bZ7VwxOqs8357hVLvsvL3xRTHe9pXwzaFqAFi/2p14C5DLATzjB3aBfzKRexDraugToeUqZrm20+kqe9n0Oo70ecxMAAP//0tEICQAAAAZJREFUAwDQYMDuVKkB5gAAAABJRU5ErkJggg=='
|
sceneMode: Cesium.SceneMode.SCENE2D,
|
||||||
marker.icon.size = { width: 32, height: 32 }
|
shadows: false,
|
||||||
marker.offset = { width: 16, height: 32 }
|
timeline: false,
|
||||||
|
baseLayerPicker: false,
|
||||||
|
imageryProviderViewModels: this.imageryViewModels,
|
||||||
|
terrainProviderViewModels: [],
|
||||||
|
fullscreenButton: false,
|
||||||
|
selectionIndicator: false,
|
||||||
|
homeButton: false,
|
||||||
|
sceneModePicker: false,
|
||||||
|
animation: false,
|
||||||
|
infoBox: false,
|
||||||
|
geocoder: false,
|
||||||
|
navigationHelpButton: false
|
||||||
|
})
|
||||||
|
this.baiduCesiumViewer._cesiumWidget._creditContainer.style.display = 'none'
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.moon.show = false
|
||||||
|
this.baiduCesiumViewer.scene.fog.enabled = false
|
||||||
|
this.baiduCesiumViewer.scene.skyAtmosphere.show = false
|
||||||
|
this.baiduCesiumViewer.scene.sun.show = false
|
||||||
|
this.baiduCesiumViewer.scene.skyBox.show = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.enableLighting = false
|
||||||
|
this.baiduCesiumViewer.shadowMap.darkness = 0.8
|
||||||
|
this.baiduCesiumViewer.scene._sunBloom = false
|
||||||
|
this.baiduCesiumViewer.scene.globe.showGroundAtmosphere = false
|
||||||
|
this.baiduCesiumViewer.scene.postProcessStages.fxaa.enabled = true
|
||||||
|
|
||||||
|
this.baiduCesiumViewer.camera.setView({
|
||||||
|
destination: Cesium.Cartesian3.fromDegrees(114.4040, 30.5196, 4000000)
|
||||||
})
|
})
|
||||||
// 设置当前点击的标记点为高亮图标
|
|
||||||
this.baiduMarker[index].icon.url = 'data:image/png;base64,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'
|
|
||||||
this.baiduMarker[index].icon.size = { width: 48, height: 48 } // 高亮时稍大一些
|
|
||||||
this.baiduMarker[index].offset = { width: 24, height: 48 } // 高亮时稍大一些
|
|
||||||
// 记录当前激活的标记点索引
|
|
||||||
this.activeMarkerIndex = index
|
|
||||||
},
|
},
|
||||||
// 初始化cesium
|
// 初始化cesium
|
||||||
initCesium() {
|
initCesium() {
|
||||||
|
|
@ -473,16 +523,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* 隐藏百度地图Logo和版权信息 */
|
|
||||||
.anchorBL {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.BMap_cpyCtrl {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
.el-icon-arrow-down {
|
.el-icon-arrow-down {
|
||||||
font-size: 12px
|
font-size: 12px
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue