<template>
|
<div class="main3dviewer" @mouseleave="removeEventListener()" @mouseover="addEventListener()"
|
style="position: relative; width: 100%">
|
|
|
|
<sdkContainer style="position: absolute"> </sdkContainer>
|
<div id="sectionCharts" class="sectionChars">
|
<echartsview ref="echartsview" />
|
</div>
|
|
<IdentifyTool ref="IdentifyTool" />
|
</div>
|
</template>
|
<script>
|
import sdkContainer from "../../sgword/mapView-bk.vue"
|
import IdentifyTool from './IdentifyTool.vue'
|
import identifyTool from '@/utils/identifyTools.js'
|
import echartsview from "./echartview.vue";
|
export default {
|
props: {
|
btnClick: {
|
type: Function,
|
default: null,
|
},
|
},
|
components: { sdkContainer, echartsview, IdentifyTool },
|
data() {
|
return {
|
btnTag: 0,
|
is2D3Don: false,
|
isDoubleOn: false,
|
bimObj: null
|
};
|
},
|
methods: {
|
|
removeEventListener() {
|
if (this.isDoubleOn === true) {
|
let that = this;
|
this.$nextTick(() => {
|
if (sgworld && sgworldEx) {
|
console.log("out");
|
Viewer.scene.preRender.removeEventListener(that.start);
|
}
|
});
|
}
|
},
|
start() {
|
this.syncViewer(Viewer, ViewerEx);
|
},
|
syncViewer(global1, global2) {
|
global2.camera.flyTo({
|
destination: global1.camera.position,
|
orientation: {
|
heading: global1.camera.heading,
|
pitch: global1.camera.pitch,
|
roll: global1.camera.roll,
|
},
|
duration: 0.0,
|
});
|
},
|
addEventListener() {
|
//双球开启时，匹配双球监听
|
if (this.isDoubleOn === true) {
|
let that = this;
|
this.$nextTick(() => {
|
if (sgworld && sgworldEx) {
|
Viewer.scene.preRender.addEventListener(that.start);
|
}
|
});
|
}
|
},
|
initalEcharts(option) {
|
let v = option.ison ? "visible" : "hidden";
|
$("#sectionCharts").css("visibility", v);
|
this.$refs.echartsview.initalEcharts(option.data);
|
},
|
identifyInfo() {
|
// identifyTool.start((pick, type) => {
|
// this.$refs.IdentifyTool.open(pick, type)
|
// })
|
}
|
},
|
mounted() {
|
let elementResizeDetectorMaker = require("element-resize-detector");
|
let erd = elementResizeDetectorMaker();
|
//侦听元素的调整大小事件，并使用元素作为调整大小事件的参数来调用侦听器函数。传递给函数的选项将
|
//覆盖实例选项
|
erd.listenTo(
|
document.getElementsByClassName("main3dviewer"),
|
function (element) {
|
let height = element.offsetHeight;
|
let isOn = height > 400 ? "" : "none";
|
$(".rightbuttongroup").css("display", isOn);
|
}
|
);
|
this.identifyInfo()
|
},
|
};
|
</script>
|
<style lang="less" scoped>
|
.divbtn {
|
width: 30px;
|
height: 30px;
|
line-height: 30px;
|
margin: 5px;
|
background-color: rgba(49, 49, 49, 0.8);
|
color: #bfbfbf;
|
border: 1px solid #858585;
|
text-align: center;
|
cursor: pointer;
|
font-size: 8px;
|
}
|
|
.divbtn:hover {
|
border: 1px solid #dddddd;
|
}
|
|
.sectionChars {
|
position: absolute;
|
top: auto;
|
width: 90%;
|
height: 200px;
|
bottom: 10px;
|
left: 5%;
|
padding: 10px 15px;
|
border-radius: 4px;
|
border: 1px solid rgba(128, 128, 128, 0.5);
|
color: #fff;
|
background: rgba(0, 0, 0, 0.4);
|
box-shadow: 0 3px 14px rgba(128, 128, 128, 0.5);
|
z-index: 99999;
|
visibility: hidden;
|
}
|
</style>
|
