修复 问题

This commit is contained in:
张成
2025-12-06 23:11:32 +08:00
parent acc0e1a2e0
commit 899c5881ac
5 changed files with 48 additions and 32 deletions

View File

@@ -158,6 +158,17 @@ const RadarChartV2 = forwardRef<RadarChartV2Ref, RadarChartV2Props>((props, ref)
});
}
// 获取图片信息(宽高)
function getImageInfo(src: string): Promise<{ width: number; height: number }> {
return new Promise((resolve, reject) => {
(Taro as any).getImageInfo({
src,
success: (res: any) => resolve({ width: res.width, height: res.height }),
fail: reject,
});
});
}
// 绘制圆角矩形
function roundRect(ctx: any, x: number, y: number, width: number, height: number, radius: number) {
@@ -177,8 +188,12 @@ const RadarChartV2 = forwardRef<RadarChartV2Ref, RadarChartV2Props>((props, ref)
// 格式化 NTRP 显示
function formatNtrpDisplay(level: string): string {
if (!level) return "";
// 检查是否包含 + 号
const hasPlus = level.includes("+");
const num = parseFloat(level);
return num % 1 === 0 ? num.toFixed(0) : num.toFixed(1);
if (isNaN(num)) return level;
const formatted = num % 1 === 0 ? num.toFixed(0) : num.toFixed(1);
return hasPlus ? `${formatted}+` : formatted;
}
useImperativeHandle(ref, () => ({
@@ -250,6 +265,7 @@ const RadarChartV2 = forwardRef<RadarChartV2Ref, RadarChartV2Props>((props, ref)
try {
const avatarSize = 43.46 * scale; // 设计稿头像尺寸
const avatarImg = await loadImage(canvas, options.avatarUrl);
const avatarInfo = await getImageInfo(options.avatarUrl);
// 头像区域总宽度(头像 + 装饰图片重叠部分)
const avatarWrapWidth = 84.7 * scale; // 设计稿 Frame 1912055063 宽度
@@ -266,11 +282,30 @@ const RadarChartV2 = forwardRef<RadarChartV2Ref, RadarChartV2Props>((props, ref)
ctx.lineWidth = 1 * scale;
ctx.stroke();
// 计算头像绘制尺寸,保持宽高比
const innerSize = avatarSize - 1.94 * scale; // 内部可用尺寸
const avatarAspectRatio = avatarInfo.width / avatarInfo.height;
let drawWidth = innerSize;
let drawHeight = innerSize;
let drawX = avatarX + 0.97 * scale;
let drawY = avatarY + 0.97 * scale;
// 根据宽高比调整尺寸,保持比例不变形
if (avatarAspectRatio > 1) {
// 图片更宽,以高度为准
drawWidth = innerSize * avatarAspectRatio;
drawX = avatarX + avatarSize / 2 - drawWidth / 2;
} else {
// 图片更高或正方形,以宽度为准
drawHeight = innerSize / avatarAspectRatio;
drawY = avatarY + avatarSize / 2 - drawHeight / 2;
}
// 绘制头像(圆形裁剪)
ctx.beginPath();
ctx.arc(avatarX + avatarSize / 2, avatarY + avatarSize / 2, avatarSize / 2 - 0.97 * scale, 0, Math.PI * 2);
ctx.clip();
ctx.drawImage(avatarImg, avatarX + 0.97 * scale, avatarY + 0.97 * scale, avatarSize - 1.94 * scale, avatarSize - 1.94 * scale);
ctx.drawImage(avatarImg, drawX, drawY, drawWidth, drawHeight);
ctx.restore();
// 绘制装饰图片DocCopy- 在头像右侧