shuishen
2025-09-29 b9a26af5b08d3d92a6c38fd90e023bc4706f19eb
src/pages/map/index.vue
@@ -1,84 +1,84 @@
<!-- 地图 -->
<template>
  <!-- 地图容器 -->
  <view id="map" class="map" style="width: 100%; height: 80vh;"></view>
  <view id="map" class="map" style="width: 100%; height: 80vh"></view>
</template>
<script setup>
  onShow(() => {
   console.log(222)
   // #ifdef APP-PLUS
onShow(() => {
  console.log(222);
  // #ifdef APP-PLUS
   console.log(111)
   plus.screen.lockOrientation('landscape-primary');
   // #endif
  })
  console.log(111);
  plus.screen.lockOrientation("landscape-primary");
  // #endif
});
  onHide(() => {
    console.log(123123)
    // #ifdef APP-PLUS
       plus.screen.lockOrientation('portrait-primary');
       // #endif
  })
onHide(() => {
  console.log(123123);
  // #ifdef APP-PLUS
  plus.screen.lockOrientation("portrait-primary");
  // #endif
});
</script>
<script module="leaflet" lang="renderjs">
  import L from 'leaflet'
  import {
    onBeforeUnmount,
    onMounted
  } from 'vue';
import L from 'leaflet'
import {
  onBeforeUnmount,
  onMounted
} from 'vue';
  export default {
    mounted() {
      var basemapLayer0 = L.tileLayer(
        'http://t1.tianditu.com/vec_c/wmts?layer=vec&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
          maxZoom: 18,
          minZoom: 1,
          tileSize: 256,
          zoomOffset: 1
        });
      var basemapLayer1 = L.tileLayer(
        'http://t1.tianditu.com/cva_c/wmts?layer=cva&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
          maxZoom: 18,
          minZoom: 1,
          tileSize: 256,
          zoomOffset: 1
        });
      var basemapLayer2 = L.tileLayer(
        'http://t1.tianditu.com/img_c/wmts?layer=img&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
          maxZoom: 18,
          minZoom: 1,
          tileSize: 256,
          zoomOffset: 1
        });
      var basemapLayer3 = L.tileLayer(
        'http://t1.tianditu.com/cia_c/wmts?layer=cia&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
          maxZoom: 18,
          minZoom: 1,
          tileSize: 256,
          zoomOffset: 1
        });
      var basemap0 = L.layerGroup([basemapLayer0, basemapLayer1]);
      var basemap1 = L.layerGroup([basemapLayer2, basemapLayer3]);
export default {
  mounted() {
    var basemapLayer0 = L.tileLayer(
      'http://t1.tianditu.com/vec_c/wmts?layer=vec&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
        maxZoom: 18,
        minZoom: 1,
        tileSize: 256,
        zoomOffset: 1
      });
    var basemapLayer1 = L.tileLayer(
      'http://t1.tianditu.com/cva_c/wmts?layer=cva&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
        maxZoom: 18,
        minZoom: 1,
        tileSize: 256,
        zoomOffset: 1
      });
    var basemapLayer2 = L.tileLayer(
      'http://t1.tianditu.com/img_c/wmts?layer=img&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
        maxZoom: 18,
        minZoom: 1,
        tileSize: 256,
        zoomOffset: 1
      });
    var basemapLayer3 = L.tileLayer(
      'http://t1.tianditu.com/cia_c/wmts?layer=cia&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=e110584a27d506da2740edca951683f4', {
        maxZoom: 18,
        minZoom: 1,
        tileSize: 256,
        zoomOffset: 1
      });
    var basemap0 = L.layerGroup([basemapLayer0, basemapLayer1]);
    var basemap1 = L.layerGroup([basemapLayer2, basemapLayer3]);
      let map = L.map('map', {
        preferCanvas: true,
        crs: L.CRS.EPSG4326,
        layers: [basemap1],
        zoomControl: false,
        attributionControl: false,
        doubleClickZoom: false,
        editable: true //绘制控件
      }).setView([25.992338, 114.823254], 13);
    }
    let map = L.map('map', {
      preferCanvas: true,
      crs: L.CRS.EPSG4326,
      layers: [basemap1],
      zoomControl: false,
      attributionControl: false,
      doubleClickZoom: false,
      editable: true //绘制控件
    }).setView([25.992338, 114.823254], 13);
  }
}
</script>
<style scoped>
  /* Leaflet 默认容器要有高度 */
  .map {
    width: 100%;
    height: 100%;
  }
/* Leaflet 默认容器要有高度 */
.map {
  width: 100%;
  height: 100%;
}
</style>