update at 2026-02-14 13:26:19

miniapp/pages/index/index.js

@@ -314,6 +314,19 @@ function getWindowHeightFromResizePayload(payload) {
   return null;
 }
 
+/**
+ * 兼容 onWindowResize 不同回调结构，提取 windowWidth。
+ */
+function getWindowWidthFromResizePayload(payload) {
+  if (payload && payload.size && Number.isFinite(payload.size.windowWidth)) {
+    return payload.size.windowWidth;
+  }
+  if (payload && Number.isFinite(payload.windowWidth)) {
+    return payload.windowWidth;
+  }
+  return null;
+}
+
 /**
  * 方向切换：target->source 时对连线做镜像翻转。
  */
@@ -811,7 +824,8 @@ Page({
     targetAlignValues: TARGET_ALIGN_OPTIONS.map((item) => item.value),
     targetAlignIndex: 0,
     targetAlignMode: TARGET_ALIGN_OPTIONS[0].value,
-    bottomPanelsHeightPx: 300
+    bottomPanelsHeightPx: 300,
+    isLandscape: false
   },
 
   /**
@@ -824,7 +838,8 @@ Page({
     if (typeof wx.onWindowResize === 'function') {
       this._handleWindowResize = (payload) => {
         const nextWindowHeight = getWindowHeightFromResizePayload(payload);
-        this.updateBottomPanelsHeight(nextWindowHeight);
+        const nextWindowWidth = getWindowWidthFromResizePayload(payload);
+        this.updateBottomPanelsHeight(nextWindowHeight, nextWindowWidth);
       };
       wx.onWindowResize(this._handleWindowResize);
     }
@@ -844,29 +859,41 @@ Page({
    * - 优先保持 300px
    * - 在小高度窗口中自动收缩到 180~300 区间，避免挤压主预览区
    */
-  updateBottomPanelsHeight(windowHeight) {
+  updateBottomPanelsHeight(windowHeight, windowWidth) {
     let resolvedWindowHeight = Number(windowHeight);
+    let resolvedWindowWidth = Number(windowWidth);
     if (!Number.isFinite(resolvedWindowHeight)) {
       try {
         if (typeof wx.getWindowInfo === 'function') {
-          resolvedWindowHeight = wx.getWindowInfo().windowHeight;
+          const info = wx.getWindowInfo();
+          resolvedWindowHeight = info.windowHeight;
+          resolvedWindowWidth = info.windowWidth;
         } else {
-          resolvedWindowHeight = wx.getSystemInfoSync().windowHeight;
+          const info = wx.getSystemInfoSync();
+          resolvedWindowHeight = info.windowHeight;
+          resolvedWindowWidth = info.windowWidth;
         }
       } catch (error) {
         resolvedWindowHeight = 760;
+        resolvedWindowWidth = 390;
       }
     }
+    if (!Number.isFinite(resolvedWindowWidth)) {
+      resolvedWindowWidth = 390;
+    }
 
+    const isLandscape = resolvedWindowWidth > resolvedWindowHeight;
     const remainForBottomPanels = resolvedWindowHeight - 360;
-    const nextHeight = clampNumber(remainForBottomPanels, 180, 300, 300);
+    const nextHeight = isLandscape ? 0 : clampNumber(remainForBottomPanels, 180, 300, 300);
-    if (nextHeight === this.data.bottomPanelsHeightPx) {
+    if (nextHeight === this.data.bottomPanelsHeightPx && isLandscape === this.data.isLandscape) {
+      this.drawSankey();
       return;
     }
 
     this.setData(
       {
-        bottomPanelsHeightPx: nextHeight
+        bottomPanelsHeightPx: nextHeight,
+        isLandscape
       },
       () => {
         this.drawSankey();

miniapp/pages/index/index.json

@@ -1,4 +1,5 @@
 {
   "navigationBarTitleText": "星程桑基图",
+  "pageOrientation": "auto",
   "usingComponents": {}
 }

miniapp/pages/index/index.wxml

@@ -85,7 +85,7 @@
     />
   </view>
 
-  <view class="bottom-panels" style="height: {{bottomPanelsHeightPx}}px;">
+  <view wx:if="{{!isLandscape}}" class="bottom-panels" style="height: {{bottomPanelsHeightPx}}px;">
     <view class="panel data-panel">
       <image class="panel-title" src="../../assets/icons/data-select.svg" mode="widthFix" />
       <scroll-view class="data-scroll" scroll-y enhanced enable-flex show-scrollbar="true">