+
+
+
diff --git a/src/app.css b/src/app.css
index ebb50db..fec32cc 100644
--- a/src/app.css
+++ b/src/app.css
@@ -22,7 +22,8 @@
top: 50%!important;
max-width: 100vw!important;
}
-canvas {
+/* 仅 AR 全屏画布;勿用全局 canvas(会把点云 WebGL 拉成 100vw 导致偏左) */
+.fullscreen-canvas {
position: fixed;
left: 0;
top: 0;
diff --git a/src/app.less b/src/app.less
index 5bf141f..379a231 100644
--- a/src/app.less
+++ b/src/app.less
@@ -1,6 +1,16 @@
+html,
+body {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ min-height: 100%;
+ background-color: #eff2f5;
+}
+
#app {
- // height: 100%;
- // overflow-x: hidden;
+ width: 100%;
+ min-height: 100vh;
+ min-height: 100dvh;
}
*,
@@ -37,7 +47,8 @@
// height: 100vh;
}
-canvas {
+/* 仅 AR 全屏画布;勿用全局 canvas(会把点云 WebGL 拉成 100vw 导致偏左) */
+.fullscreen-canvas {
position: fixed;
left: 0;
top: 0;
diff --git a/src/views/douyin/components/ImagePointCloud.vue b/src/views/douyin/components/ImagePointCloud.vue
index e2de931..b484c4c 100644
--- a/src/views/douyin/components/ImagePointCloud.vue
+++ b/src/views/douyin/components/ImagePointCloud.vue
@@ -389,8 +389,18 @@ onUnmounted(() => {
}
.ipc-webgl {
+ position: relative !important;
+ left: auto !important;
+ top: auto !important;
+ right: auto !important;
+ bottom: auto !important;
display: block;
flex-shrink: 0;
+ /* 覆盖全局/历史 fullscreen canvas 规则,保证正方形居中 */
+ width: auto;
+ height: auto;
+ max-width: 100%;
+ max-height: 100%;
opacity: 0;
transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1);
}
@@ -404,12 +414,13 @@ onUnmounted(() => {
}
.ipc-scale {
- position: absolute;
- width: 1px;
- height: 1px;
+ position: absolute !important;
+ width: 1px !important;
+ height: 1px !important;
opacity: 0;
pointer-events: none;
- left: -9999px;
+ left: -9999px !important;
+ top: auto !important;
}
.ipc-fallback {
diff --git a/src/views/douyin/generating.vue b/src/views/douyin/generating.vue
index 29a6602..76832ca 100644
--- a/src/views/douyin/generating.vue
+++ b/src/views/douyin/generating.vue
@@ -28,12 +28,7 @@
@handoff="onHandoff"
/>
-