| | |
| | | <template> |
| | | <div> |
| | | <div id="sdkContainer"></div> |
| | | <!-- <iframe |
| | | id="digital_page" |
| | | v-if="isShowDigitalPerson" |
| | | src="https://iframetester.com/" |
| | | height="450" |
| | | width="600" |
| | | frameborder="no" |
| | | border="0" |
| | | marginwidth="0" |
| | | marginheight="0" |
| | | scrolling="no" |
| | | allowtransparency="yes" |
| | | ></iframe> --> |
| | | <iframe |
| | | v-if="isShowDigitalPerson" |
| | | id="digital_page" |
| | | allow="microphone;" |
| | | :src="digitalHuman" |
| | | :height="digitalSize.height" |
| | | :width="digitalSize.width" |
| | | frameborder="no" |
| | | border="0" |
| | | marginwidth="0" |
| | | marginheight="0" |
| | | scrolling="no" |
| | | allowtransparency="yes" |
| | | ></iframe> |
| | | |
| | | <div class="listBox" v-show="viewer1Show && !isLand"> |
| | | <ul id="viewer_lsyx"> |
| | | <li v-for="(item, index) in arr" :key="index" @click="changeLeftMap($event, item, index)"> |
| | | <li |
| | | v-for="(item, index) in arr" |
| | | :key="index" |
| | | @click="changeLeftMap($event, item, index)" |
| | | > |
| | | {{ item }} |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | |
| | | <layerTreeTwoScreen v-if="layerTreeTwoScreen" /> |
| | | <!-- <div id="bottomInfo" v-html="bottomInfo"></div> --> |
| | | <div id="switchImagerLayer" :style="{ |
| | | transform: `scale(${scale}) translate(${offset},${offset})`, |
| | | '-webkit-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | '-moz-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | '-o-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | '-ms-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | }"> |
| | | <transition name="animate__animated animate__bounce" @click="switchImagerLayerShowOrHide" |
| | | enter-active-class="animate__backInRight" leave-active-class="animate__backOutRight" appear> |
| | | <div |
| | | id="switchImagerLayer" |
| | | :style="{ |
| | | transform: `scale(${scale}) translate(${offset},${offset})`, |
| | | '-webkit-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | '-moz-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | '-o-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | '-ms-transform': `scale(${scale}) translate(${offset},${offset})`, |
| | | }" |
| | | > |
| | | <transition |
| | | name="animate__animated animate__bounce" |
| | | @click="switchImagerLayerShowOrHide" |
| | | enter-active-class="animate__backInRight" |
| | | leave-active-class="animate__backOutRight" |
| | | appear |
| | | > |
| | | <switchImagerLayer ref="switchImagerLayer" v-show="switchImagerLayer" /> |
| | | </transition> |
| | | |
| | | <img class="swichImg" @click="switchImagerLayerShowOrHide" :src="switchImage" /> |
| | | <img |
| | | class="swichImg" |
| | | @click="switchImagerLayerShowOrHide" |
| | | :src="switchImage" |
| | | /> |
| | | <div class="bgbox"> |
| | | <img class="swichImg" @click="switchImagerLayerShowOrHide" src="@/assets/img/new/shiliang.png" /> |
| | | <img class="swichImg bgbox" @click="switchImagerLayerShowOrHide" src="@/assets/img/new/shiliang.png" /> |
| | | <img |
| | | class="swichImg" |
| | | @click="switchImagerLayerShowOrHide" |
| | | src="@/assets/img/new/shiliang.png" |
| | | /> |
| | | <img |
| | | class="swichImg bgbox" |
| | | @click="switchImagerLayerShowOrHide" |
| | | src="@/assets/img/new/shiliang.png" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | import jiejing from "@/assets/img/new/jiejing.png"; |
| | | import "animate.css"; |
| | | import Bus from "@tools/Bus"; |
| | | |
| | | import mapData from "../../../static/mapData"; |
| | | import mapMsg from "../../assets/js/mapMsg"; |
| | | import vueEvents from "@/utils/vueEvent.js"; |
| | | |
| | | let activeLi, nLayer, LWLayer; |
| | | export default { |
| | |
| | | scale: "1", |
| | | offset: "0%", |
| | | radio: 3, |
| | | digitalHuman: null, |
| | | digitalSize: {}, |
| | | arr: [ |
| | | 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, |
| | | 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, |
| | |
| | | }, |
| | | computed: { |
| | | ...mapState(["viewer1Show", "isLand", "layerTreeTwoScreen", "cesiumInit"]), |
| | | isShowDigitalPerson() { |
| | | return this.$store.state.isShowDigitalPerson; |
| | | }, |
| | | }, |
| | | watch: { |
| | | viewer1Show(newvalue, oldvalue) { |
| | |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.digitalHuman = window.digitalHumanURL; |
| | | this.digitalSize = window.digitalSize; |
| | | let pathName = window.location.pathname.split("/"); |
| | | let StaticFileBaseUrl; |
| | | if (pathName.length != 2) { |
| | | StaticFileBaseUrl = `../../../${pathName[1]}/static/CimSDK/`; |
| | | } else { |
| | | StaticFileBaseUrl = `../../../static/CimSDK/`; |
| | | } |
| | | this.$nextTick(function () { |
| | | let that = this; |
| | | //*********北京sdk************ |
| | | window.sgworld = new SmartEarth.EarthCtrl( |
| | | "sdkContainer", |
| | | { |
| | | StaticFileBaseUrl: "../../../static/CimSDK/", |
| | | // StaticFileBaseUrl: "../../../SW/static/CimSDK/", |
| | | // StaticFileBaseUrl: "../../../YZXNCS/static/CimSDK/", |
| | | StaticFileBaseUrl: StaticFileBaseUrl, |
| | | }, |
| | | {}, |
| | | {}, |
| | |
| | | }, |
| | | duration: 5, //飞行时间8s |
| | | }); |
| | | // console.log("加载完成"); |
| | | }, 14000); |
| | | that.setCesiumInit(true); |
| | | } |
| | | ); |
| | | window.Viewer = sgworld._Viewer; |
| | | |
| | | window.viewer = sgworld._Viewer; |
| | | sgworld._Viewer.scene.moon.show = false; |
| | | window.sgwfs = new SmartEarth.WFSTool(sgworld._Viewer, Cesium); |
| | | Viewer.shadows = false; |
| | | //深度检测 |
| | |
| | | // Viewer.scene.screenSpaceCameraController.enableCollisionDetection = false; |
| | | Viewer.scene.globe.translucency.frontFaceAlpha = 0.5; |
| | | Viewer.scene.globe.undergroundColor = undefined; |
| | | |
| | | mapMsg.init(); |
| | | // rpc.clickToCoordinates(); |
| | | // mapMsg.setTime(); |
| | | //开启编辑并启用属性弹窗 |
| | | sgworld.Creator.SimpleGraphic.setEdit(true, { |
| | | editProp: true, |
| | |
| | | }, |
| | | initLSYX() { |
| | | let ul = document.getElementById("viewer_lsyx"); |
| | | let lis = ul.getElementsByTagName('li'); |
| | | let lis = ul.getElementsByTagName("li"); |
| | | lis[19].click(); |
| | | }, |
| | | destroyImageLayer() { |
| | |
| | | nLayer = null; |
| | | } |
| | | nLayer = this.loadBJ54ImageLayer(year); |
| | | if (!LWLayer||Viewer.imageryLayers.indexOf(LWLayer)<0) { |
| | | if(LWLayer) |
| | | { |
| | | if (!LWLayer || Viewer.imageryLayers.indexOf(LWLayer) < 0) { |
| | | if (LWLayer) { |
| | | LWLayer.destroy(); |
| | | } |
| | | LWLayer = this.loadBJ54LWLayer(); |
| | | } |
| | | |
| | | }, |
| | | loadBJ54LWLayer() { |
| | | let url = "http://172.26.64.84/service/ImageEngine/picdis/abc"; |
| | |
| | | cancel: function () { |
| | | if (cancelFn && typeof cancelFn === "function") { |
| | | cancelFn(); |
| | | if (window.pickFeature && window.pickFeature.primitive) { |
| | | window.pickFeature.primitive.image = imgUrl; |
| | | window.pickFeature.primitive.scale = scale; |
| | | window.pickFeature = null; |
| | | } |
| | | } |
| | | }, |
| | | end: function () { |
| | |
| | | border-radius: 10px; |
| | | /* box-shadow: 0px 0px 5px 3px #fff; */ |
| | | } |
| | | |
| | | #digital_page { |
| | | position: absolute; |
| | | left: 0; |
| | | bottom: 120px; |
| | | z-index: 10; |
| | | } |
| | | /* #switchImagerLayer:before { |
| | | content: ""; |
| | | position: absolute; |