1

src/components/Radar/indexV2.tsx

@@ -445,12 +445,62 @@ const RadarChartV2 = forwardRef<RadarChartV2Ref, RadarChartV2Props>((props, ref)
               });
               
               
-              // 绘制二维码 - 设计稿位置
+              // 绘制二维码 - 设计稿位置（带白色背景、边框、阴影和圆角）
               
               if (options.qrCodeUrl) {
                 try {
                   const qrImg = await loadImage(canvas, options.qrCodeUrl);
-                  ctx.drawImage(qrImg, qrX, qrY, qrSize, qrSize);
+                  
+                  // 二维码样式参数（2倍图）
+                  const borderWidth = 2 * scale; // 边框宽度 2px
+                  const borderRadius = 10 * scale; // 圆角 10px
+                  const shadowOffsetX = 0; // 阴影 X 偏移
+                  const shadowOffsetY = 1.04727 * scale; // 阴影 Y 偏移 1.04727px
+                  const shadowBlur = 9.42545 * scale; // 阴影模糊 9.42545px
+                  const shadowColor = "rgba(0, 0, 0, 0.12)"; // 阴影颜色
+                  
+                  // 二维码实际绘制区域（留出边框空间）
+                  const qrInnerSize = qrSize - borderWidth * 2;
+                  const qrInnerX = qrX + borderWidth;
+                  const qrInnerY = qrY + borderWidth;
+                  
+                  // 保存上下文状态
+                  ctx.save();
+                  
+                  // 设置阴影
+                  ctx.shadowOffsetX = shadowOffsetX;
+                  ctx.shadowOffsetY = shadowOffsetY;
+                  ctx.shadowBlur = shadowBlur;
+                  ctx.shadowColor = shadowColor;
+                  
+                  // 绘制白色背景（圆角矩形）
+                  ctx.fillStyle = "#FFFFFF";
+                  roundRect(ctx, qrX, qrY, qrSize, qrSize, borderRadius);
+                  ctx.fill();
+                  
+                  // 绘制白色边框
+                  ctx.strokeStyle = "#FFFFFF";
+                  ctx.lineWidth = borderWidth;
+                  roundRect(ctx, qrX, qrY, qrSize, qrSize, borderRadius);
+                  ctx.stroke();
+                  
+                  // 清除阴影（二维码图片不需要阴影）
+                  ctx.shadowOffsetX = 0;
+                  ctx.shadowOffsetY = 0;
+                  ctx.shadowBlur = 0;
+                  ctx.shadowColor = "transparent";
+                  
+                  // 绘制二维码图片（在圆角矩形内）
+                  ctx.save();
+                  // 创建圆角裁剪区域
+                  roundRect(ctx, qrInnerX, qrInnerY, qrInnerSize, qrInnerSize, borderRadius - borderWidth);
+                  ctx.clip();
+                  // 绘制二维码图片
+                  ctx.drawImage(qrImg, qrInnerX, qrInnerY, qrInnerSize, qrInnerSize);
+                  ctx.restore();
+                  
+                  // 恢复上下文状态
+                  ctx.restore();
                 } catch (error) {
                   console.error("Failed to load QR code:", error);
                 }