diff --git a/.env.production b/.env.production index 03071f2..6ea19d8 100644 --- a/.env.production +++ b/.env.production @@ -1,4 +1,5 @@ NODE_ENV=production VUE_APP_API_BASE_URL=/armd VUE_APP_CAS_BASE_URL=http://localhost:8888/cas -VUE_APP_ONLINE_BASE_URL=http://fileview.jeecg.com/onlinePreview \ No newline at end of file +VUE_APP_ONLINE_BASE_URL=http://fileview.jeecg.com/onlinePreview +VUE_APP_MAP_BASE_URL=https://ibasemaps-api.arcgis.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}?token=AAPK2b935e8bbf564ef581ca3c6fcaa5f2a71ZH84cPqqFvyz3KplFRHP8HyAwJJkh6cnpcQ-qkWh5aiyDQsGJbsXglGx0QM2cPm \ No newline at end of file diff --git a/public/static/config.js b/public/static/config.js index 2222138..234085a 100644 --- a/public/static/config.js +++ b/public/static/config.js @@ -7,5 +7,7 @@ window._CONFIG = { //单点登录地址 VUE_APP_CAS_BASE_URL: '', //文件预览路径 - VUE_APP_ONLINE_BASE_URL: '' + VUE_APP_ONLINE_BASE_URL: '', + // 离线地图 + VUE_APP_MAP_BASE_URL_OFFLINE: 'http://localhost:8001/map/{z}/{x}{y}.jpg' } \ No newline at end of file diff --git a/src/assets/images/station-operation/map-offline-active.png b/src/assets/images/station-operation/map-offline-active.png new file mode 100644 index 0000000..4ba36c4 Binary files /dev/null and b/src/assets/images/station-operation/map-offline-active.png differ diff --git a/src/assets/images/station-operation/map-offline.png b/src/assets/images/station-operation/map-offline.png new file mode 100644 index 0000000..fbd0fac Binary files /dev/null and b/src/assets/images/station-operation/map-offline.png differ diff --git a/src/assets/images/station-operation/map-online-active.png b/src/assets/images/station-operation/map-online-active.png new file mode 100644 index 0000000..a7273a9 Binary files /dev/null and b/src/assets/images/station-operation/map-online-active.png differ diff --git a/src/assets/images/station-operation/map-online.png b/src/assets/images/station-operation/map-online.png new file mode 100644 index 0000000..21f3f19 Binary files /dev/null and b/src/assets/images/station-operation/map-online.png differ diff --git a/src/views/stationOperation/components/Map.vue b/src/views/stationOperation/components/Map.vue index f4ef585..b565283 100644 --- a/src/views/stationOperation/components/Map.vue +++ b/src/views/stationOperation/components/Map.vue @@ -12,38 +12,35 @@ import XYZ from 'ol/source/XYZ' import View from 'ol/View' import { fromLonLat } from 'ol/proj' +const mapSourceUrl = process.env.VUE_APP_MAP_BASE_URL export default { props: { - token: { - type: String, - required: true - }, zoom: { type: Number, - default: 1 + default: 1, }, maxZoom: { type: Number, - default: 16 + default: 16, }, minZoom: { type: Number, - default: 1 + default: 1, }, center: { type: Object, default() { return { longitude: 116, - latitude: 40 + latitude: 40, } - } - } + }, + }, }, data() { return { map: null, - stationList: [] + stationList: [], } }, mounted() { @@ -53,27 +50,28 @@ export default { // 初始化地图 initMap() { const { longitude, latitude } = this.center - const layers = [ - new TileLayer({ - source: new XYZ({ - url: `https://ibasemaps-api.arcgis.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}?token=${this.token}` - }) - }) - ] + + this.tileLayer = new TileLayer({ + source: new XYZ({ + url: mapSourceUrl, + }), + }) + + const layers = [this.tileLayer] const view = new View({ projection: 'EPSG:3857', // 使用这个坐标系 - center: fromLonLat([longitude, latitude]), + center: fromLonLat([longitude, latitude]), zoom: this.zoom, maxZoom: this.maxZoom, - minZoom: this.minZoom + minZoom: this.minZoom, }) this.map = new Map({ target: this.$refs.mapContainerRef, layers, view, - controls: [] + controls: [], }) }, @@ -109,10 +107,19 @@ export default { panTo(center, duration = 1000) { return this.map.getView().animate({ center: fromLonLat(center), - duration + duration, }) - } - } + }, + + // 修改地图来源 + changeSource(url) { + this.tileLayer.setSource( + new XYZ({ + url, + }) + ) + }, + }, }