Files
Genarrative/packages/image-canvas-react/src/canvasWorldRendering.ts
T
k88936 7288c6f641
Project CI / Repository checks (push) Successful in 2m59s
Project CI / Frontend tests (push) Successful in 3m29s
Project CI / Backend tests (push) Successful in 8m37s
Project CI / Native shell tests (push) Successful in 20m55s
Fix/修复无限画布图标文字模糊 (#285)
closes #279
closes #284

实现: 从2(暂定)倍放大绘制的画布scale 0.5* 真正的scale

before:
![shotmd-1788579338.jpg](/attachments/9d44ec5e-454c-449b-86bc-b2131fbbc8cc)
![shotmd-1788578910.jpg](/attachments/c9da61a2-b467-43eb-a5de-e5e4d5cb8f70)

after:
![shotmd-1788580930.jpg](/attachments/f1f06e8e-90bf-45e2-a30b-a63ccc308c19)
![shotmd-1788583400.jpg](/attachments/c48ca741-e470-42b3-8030-064e0579f63a)
svg看起来stroke窄了一点点, 可以接受

Reviewed-on: #285
2026-09-09 16:32:43 +08:00

17 lines
654 B
TypeScript

import type { CanvasViewport } from '@genarrative/image-canvas-core';
export const CANVAS_RENDER_SUPERSAMPLE = 2;
/** 将 viewport scale 规范化为可用于渲染和反向缩放的正有限值。 */
export function getSafeViewportScale(viewport: CanvasViewport) {
return Number.isFinite(viewport.scale) && viewport.scale > 0
? viewport.scale
: 1;
}
/** 将逻辑 viewport 转换为 world 的渲染 transform。 */
export function canvasViewportToWorldTransform(viewport: CanvasViewport) {
const scale = getSafeViewportScale(viewport);
return `translate(${viewport.x}px, ${viewport.y}px) scale(${scale / CANVAS_RENDER_SUPERSAMPLE})`;
}