微信小程序使用canvas画圆环进度条

微信小程序使用canvas画圆环进度条

1、代码参考：https://segmentfault.com/a/1190000013219501，文章内容很清晰。

2、问题：

使用这种方式将会提醒：

从基础库 2.9.0 开始，本接口停止维护，请使用 Canvas 代替

参考官方文档：https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.createCanvasContext.html

3、改进：

由于最开始推荐的文章已经有了wxss和wxml代码，我只展示做过改进的js代码

// 1、背景圆环
  drawProgressbg: function(){
   
   
    // 使用 wx.createContext 获取绘图上下文 context
    let ctx
    wx.createSelectorQuery().select('.progress_bg').context(function (res) {
   
   
      ctx = res.context
      ctx.setLineWidth(25); // 设置圆环的宽度