canvas显示优化

@@ -4,6 +4,8 @@ import { formatTimeByDefined } from '../../utils/index.js'
 import Yas from '../../utils/yas';
 
 let yas;
+let {screenWidth} = wx.getSystemInfoSync();
+let radio = (screenWidth / 750).toFixed(2);
 
 Page({
 
@@ -37,18 +39,9 @@ Page({
   * 画progress底部背景
   */
   drawProgressbg: function (summary) {
-    // let summary = {
-    //   totalIncome: '130.98',
-    //   goodsIncome: '30.98',
-    //   compensateIncome: '100',
-    // }
-    // this.setData({
-    //   summary: summary
-    // });
-    // 使用 wx.createContext 获取绘图上下文 context
     var ctx = wx.createCanvasContext('canvasProgressbg')
     // 设置圆环的宽度
-    ctx.setLineWidth(14);
+    ctx.setLineWidth(28 * radio);
     // 设置圆环的颜色
     let strokeColor = '#E0E0E0'
     if (summary && summary.totalIncome > 0) {
@@ -61,7 +54,7 @@ Page({
     ctx.beginPath();
     //设置一个原点(110,110)，半径为100的圆的路径到当前路径
     console.log("起始点：" + Math.PI)
-    ctx.arc(60, 60, 51, 0, 2 * Math.PI, false);
+    ctx.arc(120 * radio, 120 * radio, 100 * radio, 0, 2 * Math.PI, false);
     //对当前路径进行描边
     ctx.stroke();
     //开始绘制
@@ -75,7 +68,7 @@ Page({
     // 使用 wx.createContext 获取绘图上下文 context
     var context = wx.createCanvasContext('canvasProgress');
     // 设置圆环的宽度
-    context.setLineWidth(14);
+    context.setLineWidth(28 * radio);
     // 设置圆环的颜色
     let strokeColor = '#002B47'
     // if (this.data.summary.totalIncome <= 0){
@@ -87,7 +80,7 @@ Page({
     //开始一个新的路径
     context.beginPath();
     //参数step 为绘制的圆环周长，从0到2为一周 。 -Math.PI / 2 将起始角设在12点钟位置 ，结束角 通过改变 step 的值确定
-    context.arc(60, 60, 51, -Math.PI / 2, step * Math.PI - Math.PI / 2, false);
+    context.arc(120 * radio, 120 * radio, 100 * radio, -Math.PI / 2, step * Math.PI - Math.PI / 2, false);
     //对当前路径进行描边
     context.stroke();
     //开始绘制