From 81f54040c2cb65537c6c6e1db8358a39a57dea0d Mon Sep 17 00:00:00 2001
From: mayisheng <admin>
Date: Mon, 15 Aug 2022 16:14:01 +0800
Subject: [PATCH] 1
---
src/components/map/index.vue | 177 +++++++++++++++++++++++++++++++++++-----------------------
1 files changed, 107 insertions(+), 70 deletions(-)
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 891ef09..394dff1 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -1,37 +1,30 @@
/* eslint-disable camelcase */
<template>
<div id="viewer-container" style="height: 100%; width: 100%" @click="mapClick($event)">
- <video
- id="video"
- style="position: fixed; visibility: hidden"
- muted
- autoplay
- loop
- crossorigin
- controls
- >
- <source src="http://dc.dvgis.cn/examples/data/demo.mp4" type="video/mp4" />
- </video>
-
<div
style="
- position: fixed;
- left: 4px;
- bottom: 4px;
- width: 80px;
- line-height: 24px;
- text-align: center;
- color: #fff;
- font-size: 14px;
- border-radius: 4px;
- background: #2196f3ed;
- z-index: 11;
- "
+ position: fixed;
+ left: 4px;
+ bottom: 4px;
+ width: 80px;
+ line-height: 24px;
+ text-align: center;
+ color: #fff;
+ font-size: 14px;
+ border-radius: 4px;
+ background: #2196f3ed;
+ z-index: 11;
+ "
>智慧校区</div>
- <dimension />
+ <dimension
+ :wheelFlag="wheelFlag"
+ :startWheel="startWheel"
+ :startSmallWheel="startSmallWheel"
+ @change-wheel="changeWheel"
+ />
- <!-- <calender /> -->
+ <calender v-if="calenderShow" />
<left-nav ref="leftNav"></left-nav>
@@ -65,12 +58,15 @@
components: {
mapPopup,
campusBuildingSearch,
- dimension
- // calender
+ dimension,
+ calender
},
data () {
return {
- samllMapFlag: false
+ samllMapFlag: false,
+ wheelFlag: true,
+ startWheel: false,
+ startSmallWheel: false
}
},
watch: {
@@ -158,13 +154,12 @@
'campusNavFlag',
'orgNavBarFlag',
'arcNavBarFlag',
- 'searchPopupFlag'
+ 'searchPopupFlag',
+ 'calenderShow'
])
},
mounted () {
var that = this
-
- let eagleViewer
function distanceSurface () {
global.viewer.measure.distanceSurface()
@@ -220,36 +215,55 @@
global.viewer.measure.deactivate()
}
+ if (global.viewer != null) {
+ global.viewer = null
+ global.eagleViewer = null
+ }
+
function initViewer () {
global.viewer = new global.DC.Viewer('viewer-container', {
contextOptions: {
webgl: {
+ alpha: true,
stencil: true,
preserveDrawingBuffer: true
}
}
- }).setOptions({
- // showAtmosphere: false, 大气层
- showMoon: true, // 月亮
- showSun: true, // 太阳
- skyBox: {
- show: true
- }
})
- const chartLayer = new global.DC.ChartLayer('busLayer').addTo(global.viewer)
+ global.viewer.scene.globe.baseColor = global.DC.Namespace.Cesium.Color.WHITE
- chartLayer.setOption(that.busPathsInit())
+ if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) { // 判断是否支持图像渲染像素化处理
+ global.viewer.setOptions({
+ resolutionScale: window.devicePixelRatio
+ })
+ }
- // global.viewer.scene.backgroundColor = global.DC.Namespace.Cesium.Color.fromBytes(245, 244, 238)
+ // 是否开启抗锯齿
+ // global.viewer.scene.fxaa = true
+ // global.viewer.scene.postProcessStages.fxaa.enabled = true
+ // .setOptions({
+ // // showAtmosphere: false, 大气层
+ // showMoon: true, // 月亮
+ // showSun: true, // 太阳
+ // skyBox: {
+ // show: true
+ // }
+ // })
- global.viewer.use(new global.DC.Weather())
- global.viewer.weather.cloud.enable = true
- global.viewer.weather.cloud.rotateAmount = 0.02
+ // const chartLayer = new global.DC.ChartLayer('busLayer').addTo(global.viewer)
+
+ // chartLayer.setOption(that.busPathsInit())
+
+ // global.viewer.scene.backgroundColor = global.DC.Namespace.Cesium.Color.fromBytes(255, 255, 255)
+
+ // global.viewer.use(new global.DC.Weather())
+ // global.viewer.weather.cloud.enable = true
+ // global.viewer.weather.cloud.rotateAmount = 0.02
that.$store.commit('SET_VIEWEREXIST', true)
- eagleViewer = new global.DC.Viewer('eagleEyeMap', {
+ global.eagleViewer = new global.DC.Viewer('eagleEyeMap', {
animation: false,
baseLayerPicker: false,
imageryProvider: false,
@@ -261,14 +275,13 @@
selectionIndicator: false,
timeline: false,
navigationHelpButton: false,
- navigationInstructionsInitiallyVisible: false,
- creditContainer: undefined
+ navigationInstructionsInitiallyVisible: false
// sceneMode: global.DC.Namespace.Cesium.SceneMode.SCENE2D
})
- eagleViewer.imageryLayers.addImageryProvider(
+ global.eagleViewer.imageryLayers.addImageryProvider(
new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
- url: 'http://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=9ae78c51a0a28f06444d541148496e36',
+ url: 'http://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0',
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
format: 'image/jpeg',
show: true,
@@ -276,9 +289,9 @@
})
)
- eagleViewer.imageryLayers.addImageryProvider(
+ global.eagleViewer.imageryLayers.addImageryProvider(
new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
- url: 'http://t{s}.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=9ae78c51a0a28f06444d541148496e36',
+ url: 'http://t{s}.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0',
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
format: 'image/jpeg',
show: true,
@@ -287,7 +300,7 @@
)
var sceneL = global.viewer.scene
- var sceneR = eagleViewer.scene
+ var sceneR = global.eagleViewer.scene
var handlerL = new global.DC.Namespace.Cesium.ScreenSpaceEventHandler(sceneL.canvas)
var handlerR = new global.DC.Namespace.Cesium.ScreenSpaceEventHandler(sceneR.canvas)
@@ -295,6 +308,30 @@
var isLeftTrigger = false
var isRightTrigger = false
+
+ handlerL.setInputAction(function (movement) {
+ that.startWheel = true
+ if (movement > 0) {
+ // 向下
+ that.wheelFlag = true
+ } else {
+ // 向上
+ that.wheelFlag = false
+ }
+ }, global.DC.Namespace.Cesium.ScreenSpaceEventType.WHEEL)
+
+ handlerR.setInputAction(function (movement) {
+ that.startSmallWheel = true
+ if (that.samllMapFlag) {
+ if (movement > 0) {
+ // 向下
+ that.wheelFlag = true
+ } else {
+ // 向上
+ that.wheelFlag = false
+ }
+ }
+ }, global.DC.Namespace.Cesium.ScreenSpaceEventType.WHEEL)
handlerL.setInputAction(function (movement) {
isLeftTrigger = true
@@ -312,7 +349,7 @@
if (isLeftTrigger) {
const position = global.DC.Transform.transformCartesianToWGS84(global.viewer.camera.position)
- eagleViewer.camera.flyTo({
+ global.eagleViewer.camera.flyTo({
destination: global.DC.Transform.transformWGS84ToCartesian(new global.DC.Position(position.lng, position.lat, position.alt + 1000)),
@@ -338,17 +375,19 @@
var synceagleViewer = function () {
if (isRightTrigger && that.samllMapFlag) {
+ const position = global.DC.Transform.transformCartesianToWGS84(global.eagleViewer.camera.position)
+
global.viewer.camera.flyTo({
- destination: eagleViewer.camera.position,
+ destination: global.DC.Transform.transformWGS84ToCartesian(new global.DC.Position(position.lng, position.lat, position.alt > 1100 ? position.alt - 1000 : 100)),
orientation: {
- heading: eagleViewer.camera.heading,
+ heading: global.eagleViewer.camera.heading,
- pitch: eagleViewer.camera.pitch,
+ pitch: global.eagleViewer.camera.pitch,
- roll: eagleViewer.camera.roll
+ roll: global.eagleViewer.camera.roll
},
@@ -358,11 +397,11 @@
}
}
- eagleViewer.camera.setView({
+ global.eagleViewer.camera.setView({
// Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州
// fromDegrees()方法,将经纬度和高程转换为世界坐标
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- 115.871863, 28.743861, 1400.0
+ 116.35381525, 27.95839468, 1950.0
),
orientation: {
// 指向
@@ -373,9 +412,9 @@
}
})
- eagleViewer.camera.changed.addEventListener(synceagleViewer)
+ global.eagleViewer.camera.changed.addEventListener(synceagleViewer)
- eagleViewer.scene.preRender.addEventListener(synceagleViewer)
+ global.eagleViewer.scene.preRender.addEventListener(synceagleViewer)
// global.viewer.camera.percentageChanged = 0.01
// eagleViewer.camera.percentageChanged = 0.01
@@ -404,9 +443,7 @@
// })
// })
- that.$refs.leftNav.initialize()
-
- // const key = '0f7c1d161d7352116a21aacf0e9f44c1'
+ // const key = 'e9533f5acb2ac470b07f406a4d24b4f0'
// const vec = global.DC.ImageryLayerFactory.createTdtImageryLayer({
// key
// })
@@ -547,8 +584,13 @@
}
global.DC.ready(initViewer)
+
+ that.$refs.leftNav.initialize()
},
methods: {
+ changeWheel (val, type) {
+ this[type] = val
+ },
mapClick (e) {
this.$refs.campusNavRoute.shortcutShow(e)
this.$refs.campusBuildingSearch.shortcutShow(e)
@@ -810,10 +852,8 @@
var res = []
for (var i = 0; i < data.length; i++) {
var dataItem = data[i]
- // console.log('dataItem',dataItem) //第二个数据
var fromCoord = [115.8716, 28.7436]
var toCoord = chinaGeoCoordMap[dataItem[0].name]
- // console.log('toCoord',toCoord);//第一个地址
if (fromCoord && toCoord) {
res.push([
{
@@ -880,7 +920,6 @@
// color: '#f00'
color: function (params) {
// 圆环显示文字
- // console.log('redName',redName)
return '#ffa022'
},
@@ -901,7 +940,6 @@
extraCssText: 'z-index:100',
formatter: function (params, ticket, callback) {
// 根据业务自己拓展要显示的内容
- // console.log('params--2',params)
let res = ''
const name = params.data.dataItem[0].name
const price = params.data.dataItem[0].price
@@ -918,7 +956,6 @@
}
},
data: item[1].map(function (dataItem) {
- // console.log('dataItem',dataItem[0]);
return {
dataItem: dataItem,
name: dataItem[0].name,
--
Gitblit v1.9.3