|
|
@@ -35,26 +35,31 @@ export default {
|
|
|
ctx.imageSmoothingEnabled = false;
|
|
|
ctx.lineWidth = 1;
|
|
|
const img = new Image();
|
|
|
- img.src = require("../../../../assets/icon/classroomObservation/rt-ch_echarts.png");
|
|
|
+ img.src = require("../../../../assets/icon/classroomObservation/rt-ch_echarts2.svg");
|
|
|
img.onload = () => {
|
|
|
- ctx.drawImage(img, 25, 25, 250, 250);
|
|
|
+ ctx.drawImage(img, 0, 0, canvasWidth, canvasWidth);
|
|
|
ctx.beginPath();
|
|
|
- ctx.arc((250*parseFloat(this.data.RT))+25,(250-(250*parseFloat(this.data.CH))+25), 4, 0, 2 * Math.PI);
|
|
|
+ let _showWidth = canvasWidth-((canvasWidth/8.8)*2)
|
|
|
+ ctx.arc((canvasWidth/8.8)+(_showWidth*parseFloat(this.data.RT)),(canvasWidth/8.8)+_showWidth-(_showWidth*parseFloat(this.data.CH)),4,0,2*Math.PI);
|
|
|
+ ctx.lineWidth = 0.5; // 设置边框大小
|
|
|
+ // ctx.arc((canvasWidth*parseFloat(this.data.RT))+(canvasWidth/8.8),(canvasWidth-(canvasWidth*parseFloat(this.data.CH))+(canvasWidth/8.8)), 4, 0, 2 * Math.PI);
|
|
|
ctx.fill();
|
|
|
ctx.stroke();
|
|
|
};
|
|
|
|
|
|
- ctx.fillStyle = "black";
|
|
|
- ctx.font = `20px serif`;
|
|
|
- ctx.fillText("1", 10, 40);
|
|
|
- ctx.fillText("Ch", 0, 150);
|
|
|
- ctx.fillText("0", 10, 290);
|
|
|
- ctx.fillText("Rt", 140, 295);
|
|
|
- ctx.fillText("1", 280, 275);
|
|
|
+ // ctx.fillStyle = "black";
|
|
|
+ // ctx.font = `20px serif`;
|
|
|
+ // ctx.fillText("1", 10, 40);
|
|
|
+ // ctx.fillText("Ch", 0, 150);
|
|
|
+ // ctx.fillText("0", 10, 290);
|
|
|
+ // ctx.fillText("Rt", 140, 295);
|
|
|
+ // ctx.fillText("1", 280, 275);
|
|
|
|
|
|
ctx.fillStyle = fontColor;
|
|
|
ctx.font = "italic bold 24px Arial";
|
|
|
- ctx.fillText(`RT=${this.data.RT} CH=${this.data.CH}`, 40, 330);
|
|
|
+ const text = `RT=${this.data.RT} CH=${this.data.CH}`;
|
|
|
+ const textWidth = ctx.measureText(text).width;
|
|
|
+ ctx.fillText(text, (canvasWidth - textWidth) / 2, canvasHeight - canvasWidth / 12);
|
|
|
},
|
|
|
drawRoundedRect(ctx, x, y, width, height, radius) {
|
|
|
// 限制 radius 的最大值，防止它超过矩形的宽度或高度的一半
|
SanHQin