添加功能：切换图层的时icon随之变动

husq

2023-10-10 95d5dd947d88e756ffae520e9b1311f65be89469

添加功能：切换图层的时icon随之变动

 src/components/cesiumMap/cesium.vue

@@ -36,7 +36,7 @@
    </template>
    <div class="layer-icon">
      <div class="layer-btn">
        <div class="img"></div>
        <div class="img" :style="{'background': loadBgImg}"></div>
      </div>
    </div>
  </a-popover>
@@ -49,6 +49,7 @@
import { gaodeSearch } from '/@/api/gaode'
import { SearchOutlined, PlusOutlined, MinusOutlined } from '@ant-design/icons-vue'
import { useMyStore } from '/@/store'
import { requireImg } from '/@/utils/common'
import * as Cesium from 'cesium'
type result = {
  label: string,
@@ -130,6 +131,13 @@
  store.commit('SET_MAP_SETTING_MODE', type)
  patternMap()
}
const loadBgImg = computed(() => {
  if (store.state.common.mapSetting.mode === 0) {
    return `url(${requireImg('icons/stand.png')}) no-repeat center`
  } else {
    return `url(${requireImg('icons/satellite-icon.png')}) no-repeat center`
  }
})
const roadChange = (e:any) => {
  if (mapSetting.value.mode === 0) return
  store.commit('SET_MAP_SETTING_ROAD_LINE', e.target.checked)
@@ -139,7 +147,6 @@
    roadPattern(false)
  }
}
const checked = ref(true)
</script>

<style scoped lang="scss">

 src/hooks/use-cesium-tsa.ts

@@ -220,7 +220,6 @@
  // 切换不同背景图层
  const patternMap = () => {
    const imageryLayers = viewer?.scene.imageryLayers
    console.log(imageryLayers, 'imageryLayers')
    // 切换为标准图层
    if (store.state.common.mapSetting.mode === 0) {
      const tdtImg_c = imageryLayers?._layers.find(v => v.imageryProvider._layer === 'tdtImg_c')
@@ -230,7 +229,6 @@
    } else {
      const tdtStand_c = imageryLayers?._layers.find(v => v.imageryProvider.credit.html === 'stand_tc')
      const tdtStand_zj = imageryLayers?._layers.find(v => v.imageryProvider.credit.html === 'stand_zj')
      console.log(tdtStand_c, tdtStand_zj, '===========================')
      viewer?.imageryLayers.remove(tdtStand_c)
      viewer?.imageryLayers.remove(tdtStand_zj)
    }

 src/utils/common.ts

@@ -10,3 +10,7 @@
  lable.click()
  URL.revokeObjectURL(lable.href)
}

export const requireImg = (imgPath: string) => {
  return new URL(`../assets/${imgPath}`, import.meta.url).href
}