dos

Public/static/js/common.js

@@ -153,15 +153,27 @@ function createPoster() {
     let posterImg = new Image();
     posterImg.src = 'http://maf.dev.izhida.cn/Public/static/image2/poster' + resultType + '.png';
     posterImg.onload = function () {
-        posterCtx.drawImage(posterImg, 0, 0, posterCanvas.width, posterCanvas.height);
+        // posterCtx.drawImage(posterImg, 0, 0, posterCanvas.width, posterCanvas.height);
         let headimg = new Image();
         headimg.src = window.getImageUrl + '?url=' + encodeURI(user_header_url);
         headimg.onload = function () {
-            posterCtx.drawImage(headimg, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52));
+            // posterCtx.drawImage(headimg, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52));
+            circleImg(posterCtx, headimg, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52));
         }
     }
 }
 
+function circleImg(ctx, img, x, y, r) {
+    ctx.save();
+    var d = 2 * r;
+    var cx = x + r;
+    var cy = y + r;
+    ctx.arc(cx, cy, r, 0, 2 * Math.PI);
+    ctx.clip();
+    ctx.drawImage(img, x, y, d, d);
+    ctx.restore();
+}
+
 function submitAnswer() {
     if (nowAnswer !== '') {
         if (answerArr[0] == 0) {