From 16eb67ab6b103663d30cad9ba74360f982e131cb Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期二, 03 九月 2024 10:34:59 +0800 Subject: [PATCH] 自定义列显隐控制 --- src/views/screen/components/screen-map-three/index.vue | 43 +++++++++++++++++++++++++++++++++++++------ 1 files changed, 37 insertions(+), 6 deletions(-) diff --git a/src/views/screen/components/screen-map-three/index.vue b/src/views/screen/components/screen-map-three/index.vue index 9d6eedf..f500e99 100644 --- a/src/views/screen/components/screen-map-three/index.vue +++ b/src/views/screen/components/screen-map-three/index.vue @@ -1,23 +1,54 @@ <template> - <div class="map-container" ref="mapContainer"> - + <div class="map-container"> + <canvas class="world" ref="worldContainer"></canvas> </div> </template> <script> -import World from './world/world'; +import Experience from './experience/index'; let world = null; export default { name: 'ScreenMapThree', + props: { + loadEnd: { + type: Boolean, + default: false + }, + }, + watch: { + loadEnd: { + handler(newVal) { + if (newVal) { + world = new Experience(this.$refs.worldContainer); + } + } + } + }, mounted() { - world = new World(this.$refs.mapContainer); - } + + }, + beforeDestroy() { + world.destroy(); + world = null; + }, } </script> <style lang="scss" scoped> .map-container { width: 100%; - height: 100%; + height:100%; + // position: absolute; + // left: 25%; + // top: 65px; + z-index: 0; + // background: url("../../../../assets/images/screen/cardBg.png"); + // background-size: cover !important; + // background-repeat: no-repeat !important; + // background-position: center center !important; + .world { + width: 100%; + height: 100%; + } } </style> \ No newline at end of file -- Gitblit v1.8.0