diff --git a/js/script.js b/js/script.js index 845e75b..4ba2ee6 100644 --- a/js/script.js +++ b/js/script.js @@ -2068,7 +2068,6 @@ // 生成画布(高清无损,保持与显示容器相同的宽高比) async function generateCanvas() { const canvas = exportCanvas; - const ctx = canvas.getContext('2d'); const container = imageContainer; // 获取显示容器的实际尺寸和宽高比 @@ -2085,6 +2084,7 @@ let TARGET_HEIGHT = Math.round(displayHeight * minScale); // 微信特殊处理:微信内置浏览器 canvas 限制更严格 + // 实测微信中 canvas 最大尺寸约为 4096,但超过 2048 可能有问题 const MAX_CANVAS_SIZE = isWechat() ? 2048 : 4096; // 如果超出限制,按宽高比等比例缩放 @@ -2126,7 +2126,18 @@ // 设置画布为高清分辨率 canvas.width = TARGET_WIDTH; canvas.height = TARGET_HEIGHT; + + // 微信中:验证 canvas 尺寸是否设置成功 + if (isWechat() && (canvas.width !== TARGET_WIDTH || canvas.height !== TARGET_HEIGHT)) { + console.warn('Canvas 尺寸设置失败,使用实际尺寸:', canvas.width, 'x', canvas.height); + TARGET_WIDTH = canvas.width; + TARGET_HEIGHT = canvas.height; + } + console.log('实际画布尺寸:', canvas.width, 'x', canvas.height); + + // 获取 2d 上下文(必须在设置尺寸之后) + const ctx = canvas.getContext('2d'); // 启用最高质量渲染 ctx.imageSmoothingEnabled = true; @@ -2139,7 +2150,7 @@ // 计算从显示尺寸到目标分辨率的缩放比例 // 使用统一的缩放比例,保持宽高比,确保所见即所得 const scale = TARGET_WIDTH / displayWidth; - console.log('统一缩放比例:', scale); + console.log('统一缩放比例:', scale, '画布宽高比:', TARGET_WIDTH/TARGET_HEIGHT, '容器宽高比:', displayRatio); if (currentImage) { console.log('背景图原始尺寸:', currentImage.naturalWidth, 'x', currentImage.naturalHeight);