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 | 35 ++++++++++++++++++++++++++++++----- 1 files changed, 30 insertions(+), 5 deletions(-) diff --git a/src/views/screen/components/screen-map-three/index.vue b/src/views/screen/components/screen-map-three/index.vue index 1d010f4..f500e99 100644 --- a/src/views/screen/components/screen-map-three/index.vue +++ b/src/views/screen/components/screen-map-three/index.vue @@ -1,5 +1,5 @@ <template> - <div class="map-container" > + <div class="map-container"> <canvas class="world" ref="worldContainer"></canvas> </div> </template> @@ -9,18 +9,43 @@ 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 Experience(this.$refs.worldContainer); - } + + }, + beforeDestroy() { + world.destroy(); + world = null; + }, } </script> <style lang="scss" scoped> .map-container { width: 100%; - height: 100%; - position: absolute; + 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%; -- Gitblit v1.8.0