canvas生成圆图和微信小程序canvas圆图
先在HTML中创建 img和canvas并设置id属性
js中
微信小程序也可以使用。
当然了获取canvas会不一样。微信小程序获取canvas,参考()。
画圆采用‘yiven‘博主的: 。
let c=document.getElementById(‘canvas‘); let img=document.getElementById(‘img‘) let context=c.getContext(‘2d‘); img.onload = function(e){ console.log(‘图片加载成功‘,e) drawRoundedImg(50,100,100,100,50,img); } function drawRoundedImg(x,y,w,h,r,bgimg){ context.save(); context.beginPath(); context.moveTo(x+r,y); context.arcTo(x+w,y,x+w,y+h,r); context.arcTo(x+w,y+h,x,y+h,r); context.arcTo(x,y+h,x,y,r); context.arcTo(x,y,x+w,y,r); context.lineWidth = 1;//线条的宽度 context.strokeStyle = "red";//线条的颜色 context.stroke(); context.clip(); context.drawImage(bgimg, x, y, w, h); context.restore(); context.closePath(); }
生成后
原文:https://www.cnblogs.com/1748sb/p/yiven.html