YZProjectCloud/yanzhu-ui-vue3/src/views/bim/bimModel/modelDialog.vue

<template>
    <div>
        <el-dialog v-model="show" append-to-body :close-on-click-modal="false" :close-on-press-escape="false" :title="title" width="960px" modal-class="model-dialog-show">
            <div :id="elId"></div>
        </el-dialog>
    </div>
</template>

<script>
import useBimStore from '@/store/modules/bim'
export default {
    data() {
        return {
            show: false,
            title: '',
            row: null,
            bimStore: null,
            sapi_1: null,
            elId: 'gis' + +new Date(),
        }
    },
    mounted() {
        this.bimStore = useBimStore()
        window.xapp = this
    },
    methods: {
        showDialog(row) {
            this.elId = 'gis' + +new Date()
            this.row = row
            this.show = true
            this.title = row.name
            this.$nextTick(() => {
                this.initCesium()
            })
        },
        initCesium() {
            // const defaults = { ...this.bimStore.defaults }
            let defaults = {
                container: 'cesiumContainer', //[必须]容器id
                showfps: false,
                openterrain: true,
                imageryprovider: 'tianditu_image',
                openearth: false,
                maxspaceerror: 2000,
                loading: false,
                bgcolor: '#87CEFA',
                outlinecolor: '#000000',
                outlineScaleVal: 1.001,
                selectedcolor: '#ff0000',
                sceneMode: 3,
                TwoMapNavigationEnable: false,
                throughwall: true,
                searchbox: false,
                mapbox: true,
                secretkey: window.config.secretKey, //token.txt文件里的内容
                editmode: false,
                cadmode: false,
                isRequestWebgl2: true,
                requestRenderMode: true,
                colorBlendMode: 2,
                loadAnimation: false,
                isStrictClip: true,
                isMsaaSamples: true,
                isOpenVR: false,
                language: 'zh-CN',
            }

            defaults.container = this.elId
            defaults.bgcolor = '#c6c9d1'
            defaults.secretkey = window.config.secretKey
            this.sapi_1 = new API(defaults)
            let modelUrl = 'https://model.jhncidg.com:18086/Tools/output/model/5513993365509191778/root.glt'
            //https://model.jhncidg.com:18086/Tools/output/model/5570926434042339486/root.glt
            //this.sapi_1.Model.add(this.row.modelAccessAddress, this.row.lightweightName)
            this.sapi_1.Model.add(modelUrl, this.row.lightweightName)
            let mapOptions = {
                imgs: {
                    // 六面图片
                    top: './Engine/Assets/Images/Navigation/bim/top.png',
                    bottom: './Engine/Assets/Images/Navigation/bim/under.png',
                    east: './Engine/Assets/Images/Navigation/bim/east.png',
                    south: './Engine/Assets/Images/Navigation/bim/south.png',
                    west: './Engine/Assets/Images/Navigation/bim/west.png',
                    north: './Engine/Assets/Images/Navigation/bim/north.png',
                },
                offset: {
                    // 屏幕坐标偏移
                    corner: GLENavigationCube.RightTop,
                    x: 25,
                    y: 20,
                },
                cube: {
                    hoverColor: '#7193dc', // 立方导航快鼠标移过显示颜色
                    size: 75, // 导航立方尺寸
                    hotPointSize: 7, // 导航立方棱角热点区域尺寸
                    cubeTextColor: '#4c4c4ccc', // cube 各个面文字颜色
                    cubeStrokeColor: '#374769cc', // cube 各个面边框颜色
                    cubeFillColor: '#374769cc', // cube 各个面填充颜色
                },
                zoomRatios: 1, // 缩放倍率
                show: true, // 是否显示
                showAxes: true, // 是否显示XYZ轴线
            }
            this.sapi_1.Plugin.initNavCube(mapOptions)
            this.sapi_1.Public.setDisableMouseState(false)
            this.sapi_1.Public.setIsflipUnderground(false)
            this.sapi_1.Public.event('LEFT_CLICK', (click) => {
                this.sapi_1.Feature.getByEvent(click.position, (json) => {
                    if (json != undefined) {
                        console.log(json)
                    }
                })
            })
        },
    },
}
</script>

<style></style>