各位大佬好，这是我的可运行能复现问题的代码片段，麻烦帮忙看看问题出在哪里，非常感谢！

// ========== 最小复现：星球选择布局在开发者工具与真机上不一致 ==========

// Minimal repro: Planet selection layout differs between DevTools and real device

//

// 问题描述: buildPlanets() 用 screenWidth / screenHeight 计算星球坐标,

// 但开发者工具和真机返回的屏幕尺寸不同（分辨率、DPR、安全区域）,

// 导致布局偏移。相机变换进一步放大了差异。

//

// Issue: buildPlanets() computes planet positions from screenWidth/screenHeight,

// but DevTools and real devices return different values (resolution, DPR, safe area),

// causing layout shifts. Camera transforms amplify the difference.

const canvas = wx.createCanvas();

const ctx = canvas.getContext('2d');

const info = wx.getWindowInfo ? wx.getWindowInfo() : wx.getSystemInfoSync();

const safeArea = (info && info.safeArea) || {};

canvas.width = info.screenWidth;

canvas.height = info.screenHeight;

const W = info.screenWidth;

const H = info.screenHeight;

// ---- 关键调试信息 ---- | ---- KEY DEBUG INFO ----

console.log('[Repro] screenWidth:', W, 'screenHeight:', H);

console.log('[Repro] windowWidth:', info.windowWidth, 'windowHeight:', info.windowHeight);

console.log('[Repro] pixelRatio:', info.pixelRatio);

console.log('[Repro] safeArea:', JSON.stringify(safeArea));

// ---- 和原项目相同的星球布局算法 ---- | ---- Same layout algorithm as the project ----

const PLANET_RADIUS = 40;

const PADDING_RATIO = 0.05;

const PLANET_Y_OFFSET = 0;

function buildPlanets(screenW, screenH) {

  const centerX = screenW / 2;

  const centerY = screenH / 2 + PLANET_Y_OFFSET;

  const paddingX = screenW * PADDING_RATIO;

  const paddingY = screenH * PADDING_RATIO;

  const halfW = screenW / 2 - paddingX - PLANET_RADIUS;

  const halfH = screenH / 2 - paddingY - PLANET_RADIUS;

  // 北斗七星布局 | Big Dipper layout

  const offsets = [

    { x: -0.60 * halfW, y:  0.55 * halfH },

    { x:  0.45 * halfW, y:  0.60 * halfH },

    { x:  0.40 * halfW, y:  0.10 * halfH },

    { x: -0.50 * halfW, y:  0.05 * halfH },

    { x: -0.15 * halfW, y: -0.30 * halfH },

    { x:  0.30 * halfW, y: -0.55 * halfH },

    { x:  0.75 * halfW, y: -0.70 * halfH },

  ];

  return offsets.map((o, i) => ({

    id: i,

    x: centerX + o.x,

    y: centerY + o.y,

  }));

}

const planets = buildPlanets(W, H);

// ---- 绘制 ---- | ---- DRAW ----

function draw() {

  // 背景

  ctx.fillStyle = '#0D1B2A';

  ctx.fillRect(0, 0, W, H);

  // 星座连线 | Constellation lines

  ctx.strokeStyle = 'rgba(65, 234, 212, 0.3)';

  ctx.lineWidth = 2;

  ctx.setLineDash([8, 6]);

  // 勺斗 | Bowl: 0→1→2→3→0

  ctx.beginPath();

  ctx.moveTo(planets[0].x, planets[0].y);

  ctx.lineTo(planets[1].x, planets[1].y);

  ctx.lineTo(planets[2].x, planets[2].y);

  ctx.lineTo(planets[3].x, planets[3].y);

  ctx.closePath();

  ctx.stroke();

  // 勺柄 | Handle: 3→4→5→6

  ctx.beginPath();

  ctx.moveTo(planets[3].x, planets[3].y);

  ctx.lineTo(planets[4].x, planets[4].y);

  ctx.lineTo(planets[5].x, planets[5].y);

  ctx.lineTo(planets[6].x, planets[6].y);

  ctx.stroke();

  ctx.setLineDash([]);

  // 星球 + 坐标标注 | Planets + coordinate labels

  const names = ['天枢','天璇','天玑','天权','玉衡','开阳','瑶光'];

  planets.forEach((p, i) => {

    // 圆圈

    ctx.strokeStyle = '#41EAD4';

    ctx.lineWidth = 3;

    ctx.beginPath();

    ctx.arc(p.x, p.y, PLANET_RADIUS, 0, Math.PI * 2);

    ctx.stroke();

    // 名称

    ctx.fillStyle = '#41EAD4';

    ctx.font = 'bold 14px Arial';

    ctx.textAlign = 'center';

    ctx.textBaseline = 'top';

    ctx.fillText(names[i], p.x, p.y + PLANET_RADIUS + 8);

    // 坐标（调试用）| Coordinates (debug)

    ctx.font = '10px Arial';

    ctx.fillStyle = '#FFC107';

    ctx.fillText(`(${Math.round(p.x)}, ${Math.round(p.y)})`, p.x, p.y + PLANET_RADIUS + 26);

  });

  // ---- 屏幕信息叠加层 ---- | ---- SCREEN INFO OVERLAY ----

  ctx.fillStyle = 'rgba(0,0,0,0.7)';

  ctx.fillRect(8, 8, 280, 120);

  ctx.fillStyle = '#FFC107';

  ctx.font = 'bold 13px monospace';

  ctx.textAlign = 'left';

  ctx.textBaseline = 'top';

  const lines = [

    `screen: ${W} × ${H}`,

    `window: ${info.windowWidth} × ${info.windowHeight}`,

    `pixelRatio: ${info.pixelRatio}`,

    `safeArea: T${safeArea.top || 0} B${safeArea.bottom || 0}`,

    `canvas: ${canvas.width} × ${canvas.height}`,

    `halfW: ${(W/2 - W*PADDING_RATIO - PLANET_RADIUS).toFixed(1)}  halfH: ${(H/2 - H*PADDING_RATIO - PLANET_RADIUS).toFixed(1)}`,

  ];

  lines.forEach((l, i) => ctx.fillText(l, 16, 16 + i * 18));

  // 安全区域边框 | Safe area border

  if (safeArea.left != null) {

    ctx.strokeStyle = 'rgba(255, 193, 7, 0.4)';

    ctx.lineWidth = 1;

    ctx.setLineDash([4, 4]);

    ctx.strokeRect(

      safeArea.left || 0,

      safeArea.top || 0,

      (safeArea.right || W) - (safeArea.left || 0),

      (safeArea.bottom || H) - (safeArea.top || 0)

    );

    ctx.setLineDash([]);

  }

}

draw();

// ---- 请在开发者工具和真机上分别运行，对比左上角的调试信息和星球坐标 ----

// Run on both DevTools and real device. Compare the debug overlay and planet coordinates.

当然以真机为准啊，这有什么好纠结的。