youhua

少年

2024-01-20 bcb686607ddff77f83b5e6d597f483b3d49e596e

youhua

 src/assets/App.css

@@ -75,12 +75,15 @@
.el-scrollbar {
  overflow: hidden;
  position: relative;
  background-color: rgba(45,52,68,.9);
  color: white;
  /* background-color: rgba(45,52,68,.9); */
  background-color: #ffffff;
  color: #212e3e;
}
.el-scrollbar li{
  border:1px solid rgba(45,52,68,.9);
  color: white;
  /* border:1px solid rgba(45,52,68,.9); */
  color: #212e3e;

  /* color: white; */
}
.el-scrollbar .hover{
  overflow: hidden;

 src/components/leftMenu/sousuo.vue

@@ -58,6 +58,14 @@
          @input="changeInput"
          clearable
        >
          <el-select v-model="select" slot="prepend" placeholder="请选择">
            <el-option
              v-for="(item, index) in options"
              :key="index"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
          <el-button
            slot="append"
            icon="el-icon-search"
@@ -128,7 +136,10 @@
  height: 100%;
  top: 0;
  background-color: #f3f3f3;
  z-index: 3000;
  z-index: 99;
}
.el-select {
  width: 80px;
}

/* æ¯æ¡æœç´¢ç»“æžœ */
@@ -178,8 +189,8 @@
import axios from "axios";
import store from "@/utils/store.js";
import common from "@/components/common";
let flyPoint;
let flyLine;
window.flyPoint = null;
window.flyLine = null;
let Allresults = [];

export default {
@@ -193,25 +204,40 @@
      showList: false,
      total: 0,
      poiList: [],
      select: "全部",
      options: [
        {
          label: "全部",
          value: "全部",
        },
        {
          label: "POI",
          value: "POI",
        },
        {
          label: "地块",
          value: "地块",
        },
      ],
    };
  },
  methods: {
    clearval() {
      this.syssval = "请输入关键词搜索地图";
      flyPoint && Viewer.entities.remove(flyPoint);
      flyPoint = undefined;
      flyLine && sgworld.Creator.DeleteObject(flyLine);
      flyLine = undefined;
      window.flyPoint && Viewer.entities.remove(window.flyPoint);
      window.flyPoint = undefined;
      window.flyLine && sgworld.Creator.DeleteObject(window.flyLine);
      window.flyLine = undefined;
      this.poi_text = "";
      this.ssjgxs = false;
    },
    changeInput() {
      if (this.poi_text === "") {
        this.ssjgxs = false;
        flyPoint && Viewer.entities.remove(flyPoint);
        flyPoint = undefined;
        flyLine && sgworld.Creator.DeleteObject(flyLine);
        flyLine = undefined;
        window.flyPoint && Viewer.entities.remove(window.flyPoint);
        window.flyPoint = undefined;
        window.flyLine && sgworld.Creator.DeleteObject(window.flyLine);
        window.flyLine = undefined;
      } else {
        clearTimeout(timers);
        timers = setTimeout(() => {
@@ -262,111 +288,189 @@
        this.ssjgxs = true;
        Allresults = [];
        this.poiList = [];
        axios
          .all([
            // 115接口（可查地块名）
            axios.post(common.poiserve2, {
              adcode: "110115",
              address: {
                name: "",
                type: "",
              },
              adname: "大兴区",
              cityname: "北京市",
              name: {
                name: this.poi_text,
                type: "",
              },
              page: 1,
              perPageCount: 20,
              pcode: "110000",
              pname: "",
              resType: "",
            }),
            // // å¸‚级平台（百度：会查到外地）
            // axios.get(common.poiserve, {
            //   params: {
            //     request: "bdPoi",
            //     query: this.poi_text,
            //     output: "json",
            //     coord: "cgcs2000",
            //     page_num: 0,
            //     page_size: 20,
            //   },
            // }),
            //  å¸‚级平台（高德）
            axios.get(common.poiserve, {
              params: {
                request: "GdPoi",
                keywords: this.poi_text,
                output: "json",
                coord: "cgcs2000",
                offset: 20,
                page: 1,
              },
            }),
          ])
          .then(
            (data) => {
              // this.total = data.data.pois.length;
              // this.poiList =
              //   data.data && data.data.pois;
              //115接口
              if (data[0].status == 200) {
                data[0].data.data.res
                  .filter((item) => {
                    return item.name.includes(this.poi_text);
                  })
                  .forEach((val) => {
                    Allresults.push(val);
        switch (this.select) {
          case "全部":
            axios
              .all([
                // 115接口（可查地块名）
                axios.post(common.poiserve2, {
                  adcode: "110115",
                  address: {
                    name: "",
                    type: "",
                  },
                  adname: "大兴区",
                  cityname: "北京市",
                  name: {
                    name: this.poi_text,
                    type: "",
                  },
                  page: 1,
                  perPageCount: 20,
                  pcode: "110000",
                  pname: "",
                  resType: "",
                }),
                // // å¸‚级平台（百度：会查到外地）
                // axios.get(common.poiserve, {
                //   params: {
                //     request: "bdPoi",
                //     query: this.poi_text,
                //     output: "json",
                //     coord: "cgcs2000",
                //     page_num: 0,
                //     page_size: 20,
                //   },
                // }),
                //  å¸‚级平台（高德）
                axios.get(common.poiserve, {
                  params: {
                    request: "GdPoi",
                    keywords: this.poi_text,
                    output: "json",
                    coord: "cgcs2000",
                    offset: 20,
                    page: 1,
                  },
                }),
              ])
              .then(
                (data) => {
                  // this.total = data.data.pois.length;
                  // this.poiList =
                  //   data.data && data.data.pois;
                  //115接口
                  if (data[0].status == 200) {
                    data[0].data.data.res
                      .filter((item) => {
                        return item.name.includes(this.poi_text);
                      })
                      .forEach((val) => {
                        Allresults.push(val);
                      });
                  }
                  // å¸‚级平台
                  // // ç™¾åº¦
                  // if (data[1].data.status == 0) {
                  //   data[1].data.results.forEach((val) => {
                  //     let obj = {
                  //       address: val.address,
                  //       adname: val.area,
                  //       cityname: val.city,
                  //       id: val.uid,
                  //       lat: val.location.lat,
                  //       lng: val.location.lng,
                  //       name: val.name,
                  //       pname: val.province,
                  //     };
                  //     Allresults.push(obj);
                  //   });
                  // }
                  // é«˜å¾·
                  if (data[1].data.status == 1) {
                    data[1].data.pois.forEach((val) => {
                      let poiarr = val.location.split(",");
                      let poi = {
                        lon: parseFloat(poiarr[0]),
                        lat: parseFloat(poiarr[1]),
                      };
                      let obj = {
                        address: val.address,
                        adname: val.area,
                        cityname: val.city,
                        id: val.uid,
                        lat: poi.lat,
                        lng: poi.lon,
                        name: val.name,
                        pname: val.province,
                      };
                      Allresults.push(obj);
                    });
                  }
                  this.total = Allresults.length;
                  this.poiList = Allresults;
                  this.showList = true;
                },
                (response) => {
                  console.log("error");
                }
              );
            break;
          case "POI":
            axios
              .get(common.poiserve, {
                params: {
                  request: "GdPoi",
                  keywords: this.poi_text,
                  output: "json",
                  coord: "cgcs2000",
                  offset: 20,
                  page: 1,
                },
              })
              .then((res) => {
                // é«˜å¾·
                if (res.data.status == 1) {
                  res.data.pois.forEach((val) => {
                    let poiarr = val.location.split(",");
                    let poi = {
                      lon: parseFloat(poiarr[0]),
                      lat: parseFloat(poiarr[1]),
                    };
                    let obj = {
                      address: val.address,
                      adname: val.area,
                      cityname: val.city,
                      id: val.uid,
                      lat: poi.lat,
                      lng: poi.lon,
                      name: val.name,
                      pname: val.province,
                    };
                    Allresults.push(obj);
                  });
              }
              // å¸‚级平台
              // // ç™¾åº¦
              // if (data[1].data.status == 0) {
              //   data[1].data.results.forEach((val) => {
              //     let obj = {
              //       address: val.address,
              //       adname: val.area,
              //       cityname: val.city,
              //       id: val.uid,
              //       lat: val.location.lat,
              //       lng: val.location.lng,
              //       name: val.name,
              //       pname: val.province,
              //     };
              //     Allresults.push(obj);
              //   });
              // }
              // é«˜å¾·
              if (data[1].data.status == 1) {
                data[1].data.pois.forEach((val) => {
                  let poiarr = val.location.split(",");
                  let poi = {
                    lon: parseFloat(poiarr[0]),
                    lat: parseFloat(poiarr[1]),
                  };
                  let obj = {
                    address: val.address,
                    adname: val.area,
                    cityname: val.city,
                    id: val.uid,
                    lat: poi.lat,
                    lng: poi.lon,
                    name: val.name,
                    pname: val.province,
                  };
                  Allresults.push(obj);
                });
              }
              this.total = Allresults.length;
              this.poiList = Allresults;
              this.showList = true;
            },
            (response) => {
              console.log("error");
            }
          );
                }
                this.total = Allresults.length;
                this.poiList = Allresults;
                this.showList = true;
              });
            break;
          case "地块":
            axios
              .post(common.poiserve2, {
                adcode: "110115",
                address: {
                  name: "",
                  type: "",
                },
                adname: "大兴区",
                cityname: "北京市",
                name: {
                  name: this.poi_text,
                  type: "",
                },
                page: 1,
                perPageCount: 20,
                pcode: "110000",
                pname: "",
                resType: "",
              })
              .then((res) => {
                if (res.status == 200) {
                  res.data.data.res
                    .filter((item) => {
                      return item.name.includes(this.poi_text);
                    })
                    .forEach((val) => {
                      Allresults.push(val);
                    });
                }
                this.total = Allresults.length;
                this.poiList = Allresults;
                this.showList = true;
              });
            break;
        }
      }
    },
    getPosition(geo) {
@@ -380,8 +484,8 @@
      // let degrees = item.location.split(',');
      // let degrees = [item.location.lng, item.location.lat];
      let degrees = [item.lng, item.lat];
      flyPoint && Viewer.entities.remove(flyPoint);
      flyLine && sgworld.Creator.DeleteObject(flyLine);
      window.flyPoint && Viewer.entities.remove(window.flyPoint);
      window.flyLine && sgworld.Creator.DeleteObject(window.flyLine);
      sgworld.Navigate.flyToPointsInterest({
        destination: Cesium.Cartesian3.fromDegrees(
          degrees[0],
@@ -390,7 +494,7 @@
        ),
      });
      // æ·»åŠ ç‚¹ä½
      flyPoint = Viewer.entities.add({
      window.flyPoint = Viewer.entities.add({
        position: Cesium.Cartesian3.fromDegrees(degrees[0], degrees[1]),
        billboard: {
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
@@ -399,7 +503,7 @@
          heightReference: 1,
          disableDepthTestDistance: Number.POSITIVE_INFINITY,
        },
        properties:item
        properties: item,
      });
      // å¦‚果是地块，添加范围线
      if (item.type == "大兴用地") {
@@ -428,7 +532,7 @@
                  z: 0,
                });
              }
              flyLine = sgworld.Creator.createPolyline(
              window.flyLine = sgworld.Creator.createPolyline(
                geometry,
                "#ff0000",
                1,

 src/components/sideMenu/layerMenu/layerPanel.vue

@@ -252,6 +252,7 @@
      curZTIndex: -1,
      state: store.thematicLayer,
      basicMapChecked: store.basicMapChecked.val,
      state1: store.tdglInfo,
    };
  },
  mounted() {
@@ -473,6 +474,32 @@
        //   // store.setThematicLayerItemId(result.id);
      }
    },
    //加载地块模型
    loadLayer() {
      window.tdglLayer = sgworld.Creator.createImageryProvider(
        layers[8].name,
        "tms",
        {
          id: layers[8].children[0].id,
          url: layers[8].children[0].urls,
          fileExtension: layers[8].children[0].img || "png",
          enablePickFeatures: false,
          level: layers[8].children[0].Level,
          minimumLevel: layers[8].children[0].minimumLevel,
          maximumLevel: layers[8].children[0].maximumLevel,
          tilingScheme:
            layers[8].children[0].tileType === "Geo"
              ? new Cesium.GeographicTilingScheme()
              : new Cesium.WebMercatorTilingScheme(),
          // alpha: layers[8].children[0].alpha,
          alpha: this.state1.alpha,
        },
        "0",
        layers[8].children[0].zIndex,
        true,
        ""
      );
    },
    // ç¬¬ä¸‰è¡Œ ä¸“题功能 ç‚¹å‡»
    handleFuncClick(index) {
      if (this.curFuncIndex == index) {
@@ -489,50 +516,29 @@
        if (window.tdglLayer) {
          sgworld.Creator.DeleteObject(window.tdglLayer);
        }
      } else {
        // éšè—åº•éƒ¨å›¾å±‚面版
        store.setLayerPanelShow(false);
        // éšè—å³ä¸Šè§’菜单面板
        store.setMenuListShow(false);
        // éšè—åº•éƒ¨æ¼«æ¸¸é¢æ¿
        store.setRoamPanelShow(false);
        this.curFuncIndex = index;
        switch (index) {
          case 0:
            window.tdglLayer = sgworld.Creator.createImageryProvider(
              layers[8].name,
              "tms",
              {
                id: layers[8].children[0].id,
                url: layers[8].children[0].urls,
                fileExtension: layers[8].children[0].img || "png",
                enablePickFeatures: false,
                level: layers[8].children[0].Level,
                minimumLevel: layers[8].children[0].minimumLevel,
                maximumLevel: layers[8].children[0].maximumLevel,
                tilingScheme:
                  layers[8].children[0].tileType === "Geo"
                    ? new Cesium.GeographicTilingScheme()
                    : new Cesium.WebMercatorTilingScheme(),
                alpha: layers[8].children[0].alpha,
              },
              "0",
              layers[8].children[0].zIndex,
              true,
              ""
            );
            store.setTdglFlag(true);
            
            break;
          case 1:
            this.curFuncIndex = -1;
            store.setTdglFlag(false);
            if (window.tdglLayer) {
              sgworld.Creator.DeleteObject(window.tdglLayer);
            }
            store.setHistoryShow(true);
            break;
        }
      }
      // éšè—åº•éƒ¨å›¾å±‚面版
      store.setLayerPanelShow(false);
      // éšè—å³ä¸Šè§’菜单面板
      store.setMenuListShow(false);
      // éšè—åº•éƒ¨æ¼«æ¸¸é¢æ¿
      store.setRoamPanelShow(false);
      //显示滑动条
      store.setSliderShow(true);
      this.curFuncIndex = index;
      switch (index) {
        case 0:
          this.loadLayer();
          store.setTdglFlag(true);
          break;
        case 1:
          this.curFuncIndex = -1;
          store.setTdglFlag(false);
          if (window.tdglLayer) {
            sgworld.Creator.DeleteObject(window.tdglLayer);
          }
          store.setHistoryShow(true);
          break;
      }
    },
    showLayerTree() {
@@ -579,6 +585,12 @@
      immediate: true, //刷新加载 ç«‹é©¬è§¦å‘一次handler
      deep: true, // å¯ä»¥æ·±åº¦æ£€æµ‹åˆ° obj å¯¹è±¡çš„属性值的变化
    },
    "state1.alpha": {
      handler: function (newVal) {
        this.handleFuncClick(0);
      },
      deep: true,
    },
  },
};
</script>

 src/components/sideMenu/roamPanel/roamPanel.vue

@@ -115,7 +115,7 @@
          type: 2,
          title: result.name,
          shade: false,
          area: ["100%", "210px"],
          area: ["100%", "220px"],
          offset: "r",
          skin: "other-class",
          content: SmartEarthRootUrl + "Workers/path/Path.html",

 src/components/sideMenu/sliderAlpha/alpha.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,30 @@
<template>
  <div class="sliders">
    <el-slider v-model="alpha" vertical height="200px" :max="1" :min="0" :step="0.01"  @input="changeSlider">
    </el-slider>
  </div>
</template>

<script>
import store from "@/utils/store.js";
export default {
  data() {
    return {
      alpha: store.tdglInfo.alpha,
    };
  },
  methods: {
    changeSlider(val) {
      store.setAlpha(val);
    },
  },
};
</script>

<style scoped>
.sliders {
  position: absolute;
  top: 2rem;
  left: 0.15rem;
}
</style>

 src/components/sideMenu/sliderAlpha/main.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,20 @@
<template>
    <div v-if="state.sliderShow">
        <myAlpha></myAlpha>
    </div>
</template>

<script>
import myAlpha from './alpha.vue';
import store from "@/utils/store.js";
export default {
    components: {
        myAlpha
    },
    data() {
        return {
            state: store.tdglInfo,
        }
    }
}
</script>

 src/components/viewer.vue

@@ -51,6 +51,7 @@
    <my-layer-tree-panel></my-layer-tree-panel>
    <!-- åœŸåœ°ç®¡ç†å¼¹çª— -->
    <my-land-admin-info></my-land-admin-info>
    <my-slider></my-slider>
  </div>
</template>
<script>
@@ -76,7 +77,9 @@
import layerTreePanel from "./sideMenu/layerTreePanel/main.vue";
import history from "./poplayer/history.vue";
import landAdminInfo from "./poplayer/landAdmin.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main.vue";
import Axios from "axios";

export default {
  name: "viewer",
  components: {
@@ -98,6 +101,7 @@
    "my-layer-tree-panel": layerTreePanel,
    "my-history": history,
    "my-land-admin-info": landAdminInfo,
    "my-slider":sliderAlpha
  },
  data() {
    return {

 src/main.js

@@ -17,6 +17,7 @@
Vue.use(animated);
window.sgworld = null;
window.viewer = null;
window.alpha = 1;
Vue.prototype.Layer = vueLayer(Vue);
Vue.prototype.$global = _GLOBAL
Vue.use(elementUI);

 src/utils/map.js

@@ -615,6 +615,10 @@
            }
            let nPickFeature = sgworld.Viewer.scene.pick(event.position);
            console.log(nPickFeature);
            if (nPickFeature == undefined) {
                window.flyPoint && Viewer.entities.remove(window.flyPoint);
                window.flyPoint = undefined;
            }
            // console.log(event.position);//屏幕位置
            if (!nPickFeature || !nPickFeature.id) {
                return
@@ -661,7 +665,7 @@
                nPickFeature.primitive.image =
                    window.SmartEarthRootUrl + "Workers/image/point.png";
                //点击弹框(部件、企业、监控)
                if (nPickFeature.id.tag) {
                if (nPickFeature.id.tag || nPickFeature.id.show) {
                    let properties = nPickFeature.id.properties;
                    let propertyNames = nPickFeature.id.properties.propertyNames;
                    if (propertyNames.indexOf("监控名") !== -1) {
@@ -740,6 +744,13 @@
                            lon: lon,
                            lat: lat,
                        }
                    } else if (propertyNames.includes("id")) {
                        objdata = {
                            POITYPE: "POINT",
                            name: properties["_name"]._value,
                            lat: properties["_lat"]._value,
                            lon: properties["_lng"]._value,
                        }
                    }
                    divPoint3 && divPoint3.deleteObject();
                    store.setPoplayerShowAction(false);

 src/utils/poiKeys.js

@@ -26,21 +26,26 @@
        // å»ºç­‘密度: 'jzmd',
    },
    'NOTDGL': {
        åœ°å—信息:"zwxx",
        åœ°å—信息: "zwxx",
    },
    'SPJK': {
        ç›‘控名称:"name",
        ç›‘控类型:"type",
        ç›‘控功能:"function",
        æ‰€åœ¨åŒºåŸŸ:"area",
        ç›‘控编号:"number",
        ç›‘控内码:"code",
        ç›‘控名称: "name",
        ç›‘控类型: "type",
        ç›‘控功能: "function",
        æ‰€åœ¨åŒºåŸŸ: "area",
        ç›‘控编号: "number",
        ç›‘控内码: "code",
    },
    'CSBJ': {
        éƒ¨ä»¶åç§°:"name",
        å®‰è£…地址:"address",
        éƒ¨ä»¶ç¼–码:"code",
        éƒ¨ä»¶ç±»åž‹:"type",
        éƒ¨ä»¶åç§°: "name",
        å®‰è£…地址: "address",
        éƒ¨ä»¶ç¼–码: "code",
        éƒ¨ä»¶ç±»åž‹: "type",
    },
    'POINT': {
        åç§°: 'name',
        ç»åº¦: 'lon',
        çº¬åº¦: 'lat'
    }
}
export default keys

 src/utils/store.js

@@ -131,8 +131,16 @@
    tdglInfo: {
        flag: false,
        show: false,
        sliderShow: false,
        alpha: 1,
        info: {}
    },
    setAlpha(val) {
        this.tdglInfo.alpha = val;
    },
    setSliderShow(val) {
        this.tdglInfo.sliderShow = val;
    },
    setTdglFlag(val) {
        this.tdglInfo.flag = val;
    },

 static/SmartEarthSDK/Workers/path/Path.html

@@ -45,7 +45,7 @@
            /* width: 95%; */
            width: 97%;
            position: absolute;
            bottom: 10px;
            bottom: 8px;
            /* margin-top: 40px; */
        }

@@ -86,7 +86,8 @@
        }

        .layui-form-item {
            border: 1px solid;
            border: 1px dashed rgba(0, 0, 0, 0.1);
            padding: 4px;
            margin-bottom: 0px !important;
            border-bottom: none;
        }
@@ -106,13 +107,17 @@
        }

        .bnt-box {
            text-align: center;
            height: 48px;
            /* text-align: center; */
            height: 60px;
            display: flex;
            justify-content: space-around;
            align-items: center;
        }

        .bnt-box button {
            margin-top: 5px;
            margin-top: 15px;
        }


        .fly {
            display: none;
@@ -121,7 +126,8 @@
        #flySpeed {
            padding: 19px 0;
        }
        .norline{

        .norline {
            display: none !important;
        }
    </style>

 static/config copy.json

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,13 @@
{
  "username": "zjchy",
  "password": "admin123",
  "min_view_height": 40,
  "token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6IjEyMyJ9.K8V0sPO_Y1CUunw4vGe6S899lDpsPixZ0b70KhP6O5M",
  "traffic": "http://www.map.zj.cn:8899/geoserver/zjplatform/wms",
  "poi_search11": "http://10.10.4.116:8085/yzAdapter/Navigation",
  "poi_search22": "http://10.10.4.115:8022/poisearch/qgpoi/POIQuery",
  "poi_search": "https://skyzt.bda.gov.cn/yzAdapter/Navigation",
  "poi_search2": "https://skyzt.bda.gov.cn/yzxncsApi/poisearch/qgpoi/POIQuery",
  "space_query": "http://10.20.55.133:3866/zjchys/query/list",
  "gis_base_url": "https://skyzt.bda.gov.cn/"
}