web-view

WEB-VIEW/src/views/components/BigScreenMap/index.vue

@@ -84,7 +84,7 @@ import VlImglayers from '@/components/ol/VLImgLayers';
 import { arcgisQuery } from '@/utils/arcgis-map-server-query';
 import VlMapDevInfo from '@/components/ol/VlMapDevInfo';
 import VlChinaCities from '@/components/ol/VlChinaCities';
-import { MultiPolygon } from 'ol/geom';
+import { MultiPolygon, Point } from 'ol/geom';
 import { getSrid, mapFit, toArcGIS } from '@/utils/arcgis-utils';
 import { Stroke, Style } from 'ol/style';
 import { Vector as VectorSource } from 'ol/source';
@@ -95,7 +95,7 @@ import { scatter_bg4, bg_text } from './base64Img.js';
 import { Geometry as WkxGeometry } from 'wkx';
 import { GeoJSON } from 'ol/format';
 import { convertRingsToGeoJSON } from '@/utils/ArcGISGeoJSONConvertTool.js';
-import { Fill, Text } from 'ol/style';
+import { Fill, Text, Icon } from 'ol/style';
 import VlToolBox from '@/components/ol/VlToolBox';
 
 import TABLE_COMP_MAPPING from './TABLE_COMP_MAPPING.js';
@@ -104,7 +104,7 @@ import TdytMapping from '@/mock/TdytMapping.js';
 
 import HeatmapLayer from 'ol/layer/Heatmap';
 import hotJson from '@/assets/geoJson/GYYDPT4490.json';
-
+import { Feature } from 'ol';
 export default {
   name: 'BigScreenMap',
   computed: {
@@ -182,6 +182,9 @@ export default {
   },
   data() {
     return {
+      mapPointList: [],
+      pointLayerSource: null,
+      pointLayer: null, // 绘制地图中心点的图层
       map: undefined,
       mapDragPan: null,
       visibleLayerId: '',
@@ -351,9 +354,13 @@ export default {
     });
     this.$vm.$on('location-feature-where', (payload) => {
       //根据dzjgh进行图斑定位
-      const { layerId, where, setting = {} } = payload;
+      const { layerId, where, setting = {}, isFit = false } = payload;
       this.locationFeatureWhere(layerId, where, setting);
     });
+    this.$vm.$on('addPoint', (city) => {
+      //根据dzjgh进行图斑定位
+      this.addPoints(city);
+    });
     this.$vm.$on('location-more-feature-where', (payload) => {
       //根据dzjgh进行图斑定位
       const { layerId, where, setting = {} } = payload;
@@ -449,6 +456,40 @@ export default {
     this.echartslayer && this.echartslayer.remove();
   },
   methods: {
+    addPoints(city) {
+      // 地理坐标数组
+      const pointData = [city];
+      // const pointData = [city.longitude, city.latitude];
+      console.log(pointData);
+      pointData.map((item) => {
+        // 创建点
+        const point = new Feature({
+          geometry: new Point([item.longitude, item.latitude]),
+          data: item,
+        });
+        // 点的样式
+        const iconStyle = new Style({
+          image: new Icon({
+            color: '#ffffff',
+            crossOrigin: 'anonymous',
+            src: require('../../../assets/images/webview/dian.png'), // 图片url,
+          }),
+        });
+        // 设置样式
+        point.setStyle(iconStyle);
+        this.mapPointList.push(point);
+      });
+
+      // 创建geojson据源
+      this.pointLayerSource = new VectorSource({ features: this.mapPointList });
+      // 创建图层 并加载数据
+      this.pointLayer = new VectorLayer({ source: this.pointLayerSource });
+      // 将图层添加地图上
+      this.pointLayer.setZIndex(1003);
+      console.log(this.pointLayer);
+      this.map.addLayer(this.pointLayer);
+    },
+
     initHotLayer(field) {
       this.heatMapLayer = new HeatmapLayer({
         source: new VectorSource({
@@ -813,7 +854,7 @@ export default {
         }
       }
     },
-    async locationFeatureWhere(layerId, where, setting) {
+    async locationFeatureWhere(layerId, where, setting, isFit) {
       this.spinShow = true;
       const layerById = this.$refs.configLayer.getLayerConfigById(layerId);
       await arcgisQuery(
@@ -832,6 +873,21 @@ export default {
         ).toWkt();
         feature.set('wkt', wkt);
         this.feature = feature;
+        console.log(isFit);
+        console.log(geometry);
+        console.log(geometry.getExtent());
+        // if (isFit) {
+        setTimeout(() => {
+          let [width, height] = this.map.getSize();
+          width = Math.ceil(width / 5);
+          height = Math.ceil(height / 5);
+          this.map.getView().fit(geometry.getExtent(), {
+            padding: [height, width, height + 340, width],
+            duration: 500,
+            maxZoom: 18,
+          });
+        }, 500);
+        // }
       });
       this.spinShow = false;
     },

WEB-VIEW/src/webview.vue

@@ -63,6 +63,7 @@ export default {
   components: { WebViewMap, SlideCard },
   data() {
     return {
+      citys: {},
       userInfo: {},
       dkbhModel: '',
       scale: 12,
@@ -83,6 +84,12 @@ export default {
   },
   mounted() {},
   created() {
+    console.log(this.$vm);
+    let that = this;
+    setInterval(() => {
+      that.citys = JSON.parse(that.$route.query.city);
+      that.$vm.$emit('addPoint', that.citys);
+    }, 3000);
     this.userInfo = JSON.parse(this.$route.query.objs);
     this.queryWarningPage();
   },
@@ -113,6 +120,7 @@ export default {
         layerId: 'bj-dkgl',
         where: `dksyh = '${dksyh}'`,
         setting: { outFields: 'dksyh,dkbh,dkwz,gddw,dkmj' },
+        isFit: true,
       });
     },
     queryClick() {

YSGZYBZ_WXAPP/pages/demo/index.vue

@@ -7,17 +7,43 @@
 <script>
 import httpAjax from '@/utils/https.js';
 import config from '@/utils/config.js';
+
 export default {
   components: {},
   data() {
     return {
+      time: null,
       webViewSrc:
-        'http://10.10.9.58:8084/#/?objs=' +
+        config.webViewUrl +
+        '?objs=' +
         JSON.stringify(uni.getStorageSync('userInfo')),
     };
   },
-  mounted() {},
+  mounted() {
+    this.time = setInterval(() => {
+      this.initGetLocation();
+    }, 3000);
+  },
   methods: {
+    initGetLocation() {
+      let that = this;
+      let citys = {
+        longitude: '',
+        latitude: '',
+      };
+      uni.getLocation({
+        success: function (res) {
+          citys.longitude = res.longitude;
+          citys.latitude = res.latitude;
+          that.webViewSrc =
+            config.webViewUrl +
+            '?objs=' +
+            JSON.stringify(uni.getStorageSync('userInfo')) +
+            '&city=' +
+            JSON.stringify(citys);
+        },
+      });
+    },
     onMessageHandler(event) {
       console.log(event);
       let res = event.detail.data;

YSGZYBZ_WXAPP/unpackage/dist/dev/mp-weixin/common/vendor.js

@@ -3435,7 +3435,7 @@ Object.defineProperty(exports, "__esModule", { value: true });exports.default =
   //发布线上需要吧login里面地址跟这里替换掉
   baseUrl: "http://10.10.9.71:7089/ysgzybz/",
   // baseUrl: "https://zlzd.zrzyt.zj.gov.cn/app215/ybz-api/",
-
+  webViewUrl: "http://10.10.9.58:8084/#/",
   bjdkgl: 'https://zlzd.zrzyt.zj.gov.cn/arcMapServer216/arcgis/rest/services/YSYBZ/BJ_DKGL/MapServer' };var _default =
 
 

YSGZYBZ_WXAPP/utils/config.js

@@ -2,7 +2,7 @@ const config = {
   //发布线上需要吧login里面地址跟这里替换掉
   baseUrl: "http://10.10.9.71:7089/ysgzybz/",
   // baseUrl: "https://zlzd.zrzyt.zj.gov.cn/app215/ybz-api/",
-
+  webViewUrl: "http://10.10.9.58:8084/#/",
   bjdkgl: 'https://zlzd.zrzyt.zj.gov.cn/arcMapServer216/arcgis/rest/services/YSYBZ/BJ_DKGL/MapServer'
 }