管道基础大数据平台系统开发-【前端】-新系統界面
q
Surpriseplus
2022-12-23 8d301b885c7c433300b5bbeb47a0864eb738fad4
src/views/Synthesis/LeftMenu.vue
@@ -10,6 +10,7 @@
      <div>{{ $t(item.label) }}</div>
    </div>
    <mapinfo ref="mapinfo" />
    <maplayer ref="maplayer" />
    <input type="file" accept=".kml" class="file" style="display: none" />
  </div>
</template>
@@ -17,8 +18,10 @@
<script>
import { transform } from 'ol/proj';
import mapinfo from '../Tools/mapinfo.vue';
import maplayer from '../Tools/maplayer.vue';
export default {
  components: { mapinfo },
  components: { mapinfo, maplayer },
  data() {
    return {
      showTwoMenuFlag: false,
@@ -31,18 +34,7 @@
            name: '图层管理',
            css: 'twoMenu_imge11',
          },
          {
            id: 'a2',
            name: '场景提取',
            label: 'synthesis.sceneExtraction',
            css: 'twoMenu_imge12',
          },
          {
            id: 'a3',
            label: 'synthesis.release',
            name: '场景发布',
            css: 'twoMenu_imge13',
          },
        ],
        [
          {
@@ -119,12 +111,7 @@
            name: '地图快照',
            css: 'twoMenu_imge34',
          },
          {
            id: 'c5',
            label: 'synthesis.tdisplay',
            name: '三维演示',
            css: 'twoMenu_imge35',
          },
        ],
        [
          {
@@ -303,7 +290,25 @@
            name: '清除',
            css: 'twoMenu_imge87',
          },
        ],
        ],[
            {
            id: 'i1',
            name: '场景提取',
            label: 'synthesis.sceneExtraction',
            css: 'twoMenu_imge12',
          },
          {
            id: 'i2',
            label: 'synthesis.release',
            name: '场景发布',
            css: 'twoMenu_imge13',
          }, {
            id: 'i3',
            label: 'synthesis.tdisplay',
            name: '三维演示',
            css: 'twoMenu_imge35',
          },
        ]
      ],
      isRuler: false,
      isNaviget: false,
@@ -434,7 +439,7 @@
      }
    },
    handleOpenClick() {
      // let that = this;
      sgworld.Creator.SimpleGraphic.edit(true, { editProp: true });
      let fileInput = document.querySelector('.file');
      fileInput.onchange = function (evt) {
        let files = evt.target.files;
@@ -443,17 +448,35 @@
          let fileReader = new FileReader();
          fileReader.readAsDataURL(file);
          fileReader.onload = () => {
            sgworld.Viewer.dataSources
              .add(
                Cesium.KmlDataSource.load(fileReader.result, {
                  camera: sgworld.Viewer.scene.camera,
                  canvas: sgworld.Viewer.scene.canvas,
                })
              )
              .then((KmlDataSource) => {
                console.log(KmlDataSource);
                // let entities = kmlDataSource.entities;
              });
            var kmlOptions = {
              camera: sgworld.Viewer.scene.camera,
              canvas: sgworld.Viewer.scene.canvas,
              clampToGround: true,
            };
            var geocachePromise = Cesium.KmlDataSource.load(
              fileReader.result,
              kmlOptions
            );
            geocachePromise.then(function (dataSource) {
              var geocacheEntities = dataSource.entities.values;
              for (var i = 0; i < geocacheEntities.length; i++) {
                var entity = geocacheEntities[i];
                sgworld.Viewer.entities.add(entity);
              }
            });
            // sgworld.Viewer.dataSources
            //   .add(
            //     Cesium.KmlDataSource.load(fileReader.result, {
            //       camera: sgworld.Viewer.scene.camera,
            //       canvas: sgworld.Viewer.scene.canvas,
            //     })
            //   )
            //   .then((KmlDataSource) => {
            //     console.log(KmlDataSource);
            //     // let entities = kmlDataSource.entities;
            //   });
          };
        }
        // fileInput.value = null;
@@ -932,6 +955,13 @@
          break;
      }
    },
    setCoverage(res) {
      switch (res) {
        case 'a1':
          this.$refs && this.$refs.maplayer && this.$refs.maplayer.open();
          break;
      }
    },
    menuChange(res) {
      this.setListTwoMenu = this.setListTwoMenuAll[res];
    },
@@ -946,6 +976,11 @@
    this.$bus.$on('setChangeTwoMenu', (res) => {
      this.menuChange(res);
    });
    this.$bus.$on('showLeftMenu', (res) => {
      this.$store.state.showAllLayers = true;
      this.setCoverage('a1');
      // this.$bus.$emit('setAllLayers', true);
    });
  },
};
</script>