From bf9ae048b9006d58f29674b9d70ee01d8e3c0b59 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 04 Dec 2023 17:10:18 +0800
Subject: [PATCH] 移动端，不同校区的逻辑适配
---
src/components/mobilemap/index.vue | 124 ++++++++++++++++++++++++++++++++++++++--
1 files changed, 116 insertions(+), 8 deletions(-)
diff --git a/src/components/mobilemap/index.vue b/src/components/mobilemap/index.vue
index 7ed28b2..b5675ce 100644
--- a/src/components/mobilemap/index.vue
+++ b/src/components/mobilemap/index.vue
@@ -38,18 +38,62 @@
import { mapGetters } from 'vuex'
import { getBuildClock } from '@/api/mobile/buildsClock/buildsClock' // 楼栋详情
+import OlView from "ol/View.js"
+
+import OlLayerTile from "ol/layer/Tile.js"
+
+import XYZ from "ol/source/XYZ"
+
import VectorLayer from "ol/layer/Vector"
import VectorSource from "ol/source/Vector"
+import { OverviewMap, defaults } from "ol/control"
import { Polygon } from 'ol/geom'
import Feature from 'ol/Feature.js'
import Point from 'ol/geom/Point.js'
import { Icon, Style, Fill, Text, Stroke, Circle } from 'ol/style.js'
+import TilegridTileGrid from "ol/tilegrid/TileGrid"
let architecturePolygon = null
let select = null
let sitePositionLayer = null
+
+let campusLayers = [
+ {
+ key: 1,
+ tileUrl: "https://fkxt.jxstnu.edu.cn/changjing/arcgis/rest/services/ksd1/MapServer/tile/{z}/{y}/{x}",
+ center: [112.63716735643777, -0.087080937773012637833],
+ resolution: 0.00014276766034981682,
+ origin: [-400.0, 399.9999999999998],
+ resolutions: [
+ 0.00019035688046642243, 0.00014276766034981682, 0.00009517844023321122,
+ 0.00004758922011660561,
+ ],
+ fullExtent: [
+ 112.51302281804038, -0.17416638494176828, 112.76131189483516,
+ 0.000004509395743004334,
+ ],
+ polygonUrl: 'https://fkxt.jxstnu.edu.cn/changjing/lkarcgisapp'
+ },
+ {
+ key: 2,
+ tileUrl: "https://dev.jxpskj.com:8023/arcgis156/rest/services/cc/MapServer/tile/{z}/{y}/{x}",
+ center: [115.79624983, 28.6416099],
+ resolution: 0.000007138383017490841,
+ origin: [-400.0, 400.0],
+ resolutions: [
+ 0.000014276766034981682, 0.000007138383017490841, 0.00000475892201166056,
+ 0.00000237946100583028,
+ ],
+ fullExtent: [
+ 115.76861782444642, 28.63584422760626, 115.82432471553928, 28.663308794331794,
+ ],
+ polygonUrl: ''
+ }
+]
+
+let campusLoadLayer
export default {
name: 'mobilemapBox',
@@ -87,7 +131,8 @@
width: 0,
height: 0
},
- map2D: this.$store.state.openlayerData.openlayers.map2D
+ map2D: this.$store.state.openlayerData.openlayers.map2D,
+ campusValue: ''
}
},
@@ -102,18 +147,26 @@
this.bigPopup.height = '0'
this.bigPopup.display = 'none'
}
+ },
+
+ campusValue: {
+ handler (newData) {
+ this.$nextTick(() => {
+ this.campusCut(newData)
+
+ this.$refs.mobileLeftNav.initialize(newData)
+
+ this.createdLayers(newData)
+ })
+ }
}
},
-
mounted () {
const that = this
this.map2D.setTarget('sceneview')
- this.map2D.getView().setResolution(0.00009517844023321122)
this.$nextTick(() => {
- that.$refs.mobileLeftNav.initialize()
-
sitePositionLayer = new VectorLayer({
// 图标图层
zIndex: 99,
@@ -122,7 +175,6 @@
this.map2D.addLayer(sitePositionLayer)
- this.createdLayers()
this.map2D.on("singleclick", function (event) {
let flag = true
@@ -206,9 +258,13 @@
select = null
},
- createdLayers () {
+ createdLayers (campusKey) {
const that = this
+ let curCampus = campusLayers.find(item => item.key == campusKey)
+ if (architecturePolygon) {
+ this.map2D.removeLayer(architecturePolygon)
+ }
architecturePolygon = new VectorLayer({
// 图标图层
source: new VectorSource(),
@@ -218,7 +274,7 @@
axios
.get(
- 'https://fkxt.jxstnu.edu.cn/changjing/lkarcgisapp?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&returnTrueCurves=false&resultOffset=&resultRecordCount=&f=pjson'
+ curCampus.polygonUrl + '?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&returnTrueCurves=false&resultOffset=&resultRecordCount=&f=pjson'
)
.then((resultData) => {
resultData.data.features.forEach((item) => {
@@ -298,6 +354,58 @@
)
}
},
+
+ campusCut (campusKey) {
+ if (campusLoadLayer) this.map2D.removeLayer(campusLoadLayer)
+ let curCampus = campusLayers.find(item => item.key == campusKey)
+
+ const tileGrid = new TilegridTileGrid({
+ tileSize: 256,
+ origin: curCampus.origin,
+ extent: curCampus.fullExtent,
+ resolutions: curCampus.resolutions,
+ })
+ // 瓦片数据源
+ const tileArcGISXYZ = new XYZ({
+ tileGrid: tileGrid,
+ projection: "EPSG:4326",
+ url: curCampus.tileUrl,
+ })
+
+ campusLoadLayer = new OlLayerTile({
+ source: tileArcGISXYZ,
+ })
+
+ this.map2D.addLayer(campusLoadLayer)
+
+
+ this.map2D.controls = defaults().extend([
+ // 添加一个鹰眼控件
+ new OverviewMap({
+ // 实例化一个OverviewMap类的对象，并加入到地图中
+ collapsed: false,
+ view: new OlView({
+ // 初始化中心点坐标
+ center: curCampus.center,
+ }),
+ layers: [
+ campusLoadLayer
+ ]
+ })
+ ])
+
+ this.map2D.setView(new OlView({
+ // 初始化中心点坐标
+ center: curCampus.center,
+ resolution: curCampus.resolution,
+ projection: "EPSG:4326",
+ extent: curCampus.fullExtent,
+ }))
+ },
+
+ setCampusValue (val) {
+ this.campusValue = val
+ }
}
}
</script>
--
Gitblit v1.9.3