业务需要在canvas中画不同粗细的线条,多次调用setLineWidth这个接口改变线条直径,第一次之后设置全部无效,颜色等其他参数则没问题。 小程序电脑调试工具上预览也没问题,上传到iphone7 最新ios最新微信上预览则出现问题。
var context = wx.createCanvasContext( 'ringBar' )
context.arc(150, 79, 70, 0.2*Math.PI, 0.8*Math.PI, true ) context.setStrokeStyle( "#E87500" ) context.setLineCap( 'round' ) context.stroke() // 进度环 var startAng = -1.2*Math.PI var allAng = 0.2*Math.PI var curEndAng = ( this .data.curQuitDay/ this .data.totalQuitDay)*1.4*Math.PI-1.2*Math.PI if ( this .data.curAng < curEndAng) { this .setData({ curAng: this .data.curAng + Math.PI * 0.01 }) } else { clearInterval( this .barInterval) } context.beginPath() context.arc(150, 79, 70, this .data.curAng, 0.8*Math.PI, true ) var grd = context.createLinearGradient(80, 70, 220, 70) grd.addColorStop(0, '#C986FF' ) grd.addColorStop(1, "#A0FBFF" )
context.stroke() |