| | |
| | | <img class="icon deblurring" src="/img/icon/tool-sign.png" alt /> |
| | | <span>地图标记</span> |
| | | </div> |
| | | <img class="close" src="/img/navicon/close.png" alt @click="closeModel" /> |
| | | <img |
| | | class="btn-box deblurring" |
| | | @click.stop="addSign" |
| | | src="/img/navicon/add.png" |
| | | alt |
| | | /> |
| | | <img |
| | | class="close deblurring" |
| | | src="/img/navicon/close.png" |
| | | alt |
| | | @click="closeModel" |
| | | /> |
| | | </template> |
| | | <template slot="public-box-content"> |
| | | <div class="list-box"> |
| | | <ul v-show="signList.length > 0"> |
| | | <li v-for="(item, index) in signList" :key="index"> |
| | | <div class="list-box" v-loading="loading"> |
| | | <ul v-show="signShow"> |
| | | <li |
| | | v-for="(item, index) in signList" |
| | | :key="index" |
| | | @click="dingw(item)" |
| | | > |
| | | <img src="/img/icon/sign-list.png" alt /> |
| | | {{ item.name }} |
| | | <el-button |
| | |
| | | size="mini" |
| | | icon="el-icon-delete" |
| | | circle |
| | | @click="deleteIcon(item.id)" |
| | | @click.stop="deleteIcon(item.id)" |
| | | ></el-button> |
| | | </li> |
| | | </ul> |
| | | <div v-show="signList.length == 0" class="no-data"> |
| | | <div v-show="!signShow" class="no-data"> |
| | | <img src="/img/icon/no-data.png" alt /> |
| | | <div>暂无数据</div> |
| | | </div> |
| | | </div> |
| | | <div class="btn-box"> |
| | | <el-button type="primary" size="mini" @click.stop="addSign" |
| | | >新增</el-button |
| | | > |
| | | </div> |
| | | </template> |
| | | </public-box> |
| | |
| | | export default { |
| | | data() { |
| | | return { |
| | | DC: null, |
| | | loading: true, |
| | | signList: [], |
| | | signShow: true, |
| | | destroyedFlag: true, |
| | | }; |
| | | }, |
| | | computed: { |
| | | ...mapGetters(["viewer", "addSignList"]), |
| | | ...mapGetters(["addSignList"]), |
| | | }, |
| | | mounted() { |
| | | this.$store.commit("initLabelLayer", this.viewer); |
| | | this.$store.commit("initLabelLayer", global.viewer); |
| | | this.getData(); |
| | | }, |
| | | watch: { |
| | |
| | | }, |
| | | }, |
| | | methods: { |
| | | dingw(item) { |
| | | const that = this; |
| | | // console.log(item); |
| | | // this.$store.dispatch("mapFlyTo", { |
| | | // lntLat: [item.jd, item.wd, 120], //114.04020791, 27.62934732 |
| | | // heading: 0, |
| | | // pitch: -90, |
| | | // roll: 0, |
| | | // noOpen: true, |
| | | // mviewer: that.viewer, |
| | | // }); |
| | | global.viewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | item.jd, |
| | | item.wd, |
| | | 400.0 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0, |
| | | }, |
| | | }); |
| | | }, |
| | | deleteIcon(id) { |
| | | let that = this; |
| | | const that = this; |
| | | deletelabel(id).then((res) => { |
| | | console.log(res); |
| | | if (res.data.code == 200) { |
| | |
| | | }); |
| | | }, |
| | | getData() { |
| | | let that = this; |
| | | const that = this; |
| | | that.loading = true; |
| | | let oks = setTimeout(() => { |
| | | that.loading = false; |
| | | that.signShow = false; |
| | | }, 5000); |
| | | getlabel().then((res) => { |
| | | clearTimeout(oks); |
| | | console.log(res); |
| | | const data = res.data.data.records; |
| | | that.signList = data; |
| | | that.signList.length > 0 |
| | | ? (that.signShow = true) |
| | | : (that.signShow = false); |
| | | that.loading = false; |
| | | // that.$store.commit("clearLabelLayerIcon"); |
| | | that.$store.commit("addLabelLayerIcon", { list: data, clear: true }); |
| | | that.$store.dispatch("addLabelLayerIcon", { |
| | | list: data, |
| | | clear: true, |
| | | }); |
| | | }); |
| | | }, |
| | | moveMessage(e, b) { |
| | | if (b == "") { |
| | | this.viewer.tooltip.enable = false; |
| | | global.viewer.tooltip.enable = false; |
| | | } else { |
| | | this.viewer.tooltip.enable = true; |
| | | this.viewer.tooltip.showAt(e.windowPosition, b); |
| | | global.viewer.tooltip.enable = true; |
| | | global.viewer.tooltip.showAt(e.windowPosition, b); |
| | | } |
| | | }, |
| | | |
| | | addSign() { |
| | | var that = this; |
| | | that.DC = global.DC; |
| | | |
| | | that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => |
| | | this.$store.commit("set_closeMapClick", true); |
| | | // console.log("开始", "see"); |
| | | global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => |
| | | that.moveMessage(e, "点击确认标注位置") |
| | | ); |
| | | |
| | | that.viewer.once(that.DC.MouseEventType.CLICK, (e) => { |
| | | global.viewer.once(global.DC.MouseEventType.CLICK, (e) => { |
| | | if (that.destroyedFlag == false) return; |
| | | |
| | | that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => |
| | | global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => |
| | | that.moveMessage(e, "") |
| | | ); |
| | | |
| | | // eslint-disable-next-line no-unused-vars |
| | | const popup = new this.DC.DivForms(this.viewer, { |
| | | const popup = new global.DC.DivForms(global.viewer, { |
| | | domId: "AddTagBox", |
| | | position: [ |
| | | that.DC.Transform.transformWGS84ToCartesian( |
| | | new that.DC.Position( |
| | | global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position( |
| | | Number(e.wgs84SurfacePosition.lng), |
| | | Number(e.wgs84SurfacePosition.lat), |
| | | Number(e.wgs84SurfacePosition.alt) |
| | |
| | | destroyed() { |
| | | var that = this; |
| | | that.destroyedFlag = false; |
| | | if (that.DC) { |
| | | that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => |
| | | if (global.DC) { |
| | | global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => |
| | | that.moveMessage(e, "") |
| | | ); |
| | | } |
| | | this.$store.commit("clearLabelLayerIcon"); |
| | | }, |
| | | }; |
| | | </script> |