canvas画圆形头像的方法

    getCirclePic(ctx: any, x: number, y: number, r: number, pic: string, dx: number, dy: number, dWidth: number, dHeight: number) {

      //  x:圆心x轴位置 

      //  y:圆心x轴位置 

      //  r:圆半径

      //  pic:图片 

      //  dx:图片左上角x轴位置

      //  dy:图片左上角y轴位置 

      //  dWidth:图片的宽 

      //  dHeight:图片的高

      ctx.save();

      ctx.beginPath();

      ctx.arc(x, y, r, 0, 2 * Math.PI, false);

      ctx.fill();

      ctx.clip();

      ctx.drawImage(pic, dx, dy, dWidth, dHeight);

      ctx.restore();

    },

*参数后的类型约束不使用TS的同学自行删除哦

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。