| | |
| | | <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> |
| | | <ul id="viewer_lsyx"> |
| | | <li |
| | | v-for="(item, index) in arr" |
| | | :key="index" |
| | |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | |
| | | <layerTreeTwoScreen v-if="layerTreeTwoScreen" /> |
| | | <!-- <div id="bottomInfo" v-html="bottomInfo"></div> --> |
| | | <div |
| | |
| | | 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 { |
| | | name: "viewer", |
| | |
| | | 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) { |
| | | if (!newvalue) { |
| | | this.destroyImageLayer(); |
| | | } else { |
| | | if (!this.isLand) { |
| | | this.initLSYX(); |
| | | } |
| | | } |
| | | }, |
| | | isLand(newvalue, oldvalue) { |
| | | if (newvalue) { |
| | | this.destroyImageLayer(); |
| | | } else { |
| | | this.initLSYX(); |
| | | } |
| | | }, |
| | | }, |
| | | 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: StaticFileBaseUrl, |
| | | }, |
| | | {}, |
| | | {}, |
| | |
| | | }, |
| | | duration: 5, //飞行时间8s |
| | | }); |
| | | // console.log("加载完成"); |
| | | }, 14000); |
| | | that.setCesiumInit(true); |
| | | } |
| | | ); |
| | | window.Viewer = sgworld._Viewer; |
| | | |
| | | window.sgwfs = new SmartEarth.WFSTool(sgworld._Viewer,Cesium); |
| | | window.viewer = sgworld._Viewer; |
| | | sgworld._Viewer.scene.moon.show = false; |
| | | window.sgwfs = new SmartEarth.WFSTool(sgworld._Viewer, Cesium); |
| | | Viewer.shadows = false; |
| | | //深度检测 |
| | | sgworld.Analysis.depthTestAgainstTerrain(true); |
| | |
| | | // 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, |
| | |
| | | this.destroyImageLayer(); |
| | | } |
| | | }, |
| | | initLSYX() { |
| | | let ul = document.getElementById("viewer_lsyx"); |
| | | let lis = ul.getElementsByTagName("li"); |
| | | lis[19].click(); |
| | | }, |
| | | destroyImageLayer() { |
| | | if (activeLi) { |
| | | activeLi.classList.remove("active"); |
| | |
| | | nLayer = null; |
| | | } |
| | | nLayer = this.loadBJ54ImageLayer(year); |
| | | if (!LWLayer) { |
| | | if (!LWLayer || Viewer.imageryLayers.indexOf(LWLayer) < 0) { |
| | | if (LWLayer) { |
| | | LWLayer.destroy(); |
| | | } |
| | | LWLayer = this.loadBJ54LWLayer(); |
| | | } |
| | | }, |
| | |
| | | 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; |