Просмотр исходного кода

fix: square plot container, no stretching

- Canvas: 500x500 fixed pixels
- Container: 524px wide (wraps canvas + padding + border)
- Removed aspect-ratio that caused image stretching

Co-Authored-By: Claude <noreply@anthropic.com>
nonvioce 3 месяцев назад
Родитель
Сommit
8a5db7b38c
2 измененных файлов с 3 добавлено и 7 удалено
  1. 1 4
      app/src/main/assets/console.css
  2. 2 3
      app/src/main/assets/console.js

+ 1 - 4
app/src/main/assets/console.css

@@ -1418,16 +1418,13 @@ body {
 .plot-container {
 .plot-container {
     margin: 12px auto;
     margin: 12px auto;
     padding: 10px;
     padding: 10px;
-    width: 540px;
+    width: 524px;
     max-width: 100%;
     max-width: 100%;
-    aspect-ratio: 1;
     background: #FCFDFE;
     background: #FCFDFE;
     border: 2px solid #B0BEC5;
     border: 2px solid #B0BEC5;
     border-radius: 0;
     border-radius: 0;
     box-shadow: inset 0 0 0 1px rgba(0,0,0,0.03);
     box-shadow: inset 0 0 0 1px rgba(0,0,0,0.03);
     overflow: hidden;
     overflow: hidden;
-    display: flex;
-    flex-direction: column;
 }
 }
 .plot-canvas {
 .plot-canvas {
     display: block;
     display: block;

+ 2 - 3
app/src/main/assets/console.js

@@ -526,9 +526,8 @@ class SymjaConsole {
         const dpr = window.devicePixelRatio || 1;
         const dpr = window.devicePixelRatio || 1;
         canvas.width = 500 * dpr;
         canvas.width = 500 * dpr;
         canvas.height = 500 * dpr;
         canvas.height = 500 * dpr;
-        canvas.style.width = '100%';
-        canvas.style.height = 'auto';
-        canvas.style.aspectRatio = '1';
+        canvas.style.width = '500px';
+        canvas.style.height = '500px';
         container.appendChild(canvas);
         container.appendChild(canvas);
 
 
         // 图例(多曲线时自动显示)
         // 图例(多曲线时自动显示)