修复一堆问题
This commit is contained in:
@@ -45,7 +45,7 @@ const ListCard: React.FC<ListCardProps> = ({
|
||||
className="image"
|
||||
mode="aspectFill"
|
||||
lazyLoad
|
||||
defaultSource="https://images.unsplash.com/photo-1554068865-24cecd4e34b8?w=200&h=200&fit=crop&crop=center"
|
||||
defaultSource={require("@/static/emptyStatus/publish-empty-card.png")}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -89,25 +89,15 @@ const RadarChart: React.FC = forwardRef((props, ref) => {
|
||||
ctx.lineWidth = 1;
|
||||
ctx.stroke();
|
||||
|
||||
// 标签
|
||||
const offset = 10;
|
||||
const textX = center.x + (radius + offset) * Math.cos(angle);
|
||||
const textY = center.y + (radius + offset) * Math.sin(angle);
|
||||
// 标签:沿轴线外侧延伸,文字中心对齐轴线端点
|
||||
const labelOffset = 28;
|
||||
const textX = center.x + (radius + labelOffset) * Math.cos(angle);
|
||||
const textY = center.y + (radius + labelOffset) * Math.sin(angle);
|
||||
|
||||
ctx.font = "12px sans-serif";
|
||||
ctx.fillStyle = "#333";
|
||||
ctx.textBaseline = "middle";
|
||||
|
||||
if (
|
||||
Math.abs(angle) < 0.01 ||
|
||||
Math.abs(Math.abs(angle) - Math.PI) < 0.01
|
||||
) {
|
||||
ctx.textAlign = "center";
|
||||
} else if (angle > -Math.PI / 2 && angle < Math.PI / 2) {
|
||||
ctx.textAlign = "left";
|
||||
} else {
|
||||
ctx.textAlign = "right";
|
||||
}
|
||||
ctx.textAlign = "center";
|
||||
|
||||
ctx.fillText(label, textX, textY);
|
||||
});
|
||||
|
||||
@@ -102,26 +102,15 @@ const RadarChartV2 = forwardRef<RadarChartV2Ref, RadarChartV2Props>((props, ref)
|
||||
ctx.lineWidth = 1 * (radarSize / 200); // 根据2倍图调整线宽
|
||||
ctx.stroke();
|
||||
|
||||
// 标签 - 文字显示在圆圈外面
|
||||
const offset = 10 * (radarSize / 200); // 文字距离圆圈的偏移量(2倍图)
|
||||
const textX = center.x + (radius + offset) * Math.cos(angle);
|
||||
const textY = center.y + (radius + offset) * Math.sin(angle);
|
||||
// 标签:沿轴线外侧延伸,文字中心对齐轴线端点(与 index.tsx 一致)
|
||||
const labelOffset = 28 * (radarSize / 200); // 文字距离圆圈的偏移量(2倍图)
|
||||
const textX = center.x + (radius + labelOffset) * Math.cos(angle);
|
||||
const textY = center.y + (radius + labelOffset) * Math.sin(angle);
|
||||
|
||||
ctx.font = `${12 * (radarSize / 200)}px sans-serif`; // 根据2倍图调整字体大小
|
||||
ctx.fillStyle = "#333";
|
||||
ctx.textBaseline = "middle";
|
||||
|
||||
// 调整文字对齐方式
|
||||
if (
|
||||
Math.abs(angle) < 0.01 ||
|
||||
Math.abs(Math.abs(angle) - Math.PI) < 0.01
|
||||
) {
|
||||
ctx.textAlign = "center";
|
||||
} else if (angle > -Math.PI / 2 && angle < Math.PI / 2) {
|
||||
ctx.textAlign = "left";
|
||||
} else {
|
||||
ctx.textAlign = "right";
|
||||
}
|
||||
ctx.textAlign = "center";
|
||||
|
||||
ctx.fillText(label, textX, textY);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user