style: roundRect ticks for smoother gauge appearance
This commit is contained in:
@@ -107,11 +107,11 @@ const M={aspect_ratio:"16:9",render_mode:"contain"};let GAME_ID='';
|
||||
function twScale(i){if(i>=Na)return 1;return 2-(i/(Na-1))}
|
||||
|
||||
// bg ticks
|
||||
for(let i=0;i<N;i++){const p=tp(i),s=twScale(i),w=(tw-gap)*s,h=th*s;ctx.save();ctx.translate(p.x,p.y);ctx.rotate(p.r);ctx.fillStyle='rgba(255,255,255,.04)';ctx.fillRect(-w/2,-h/2,w,h);ctx.restore()}
|
||||
for(let i=0;i<N;i++){const p=tp(i),s=twScale(i),w=(tw-gap)*s,h=th*s;ctx.save();ctx.translate(p.x,p.y);ctx.rotate(p.r);ctx.beginPath();ctx.roundRect(-w/2,-h/2,w,h,th*.4);ctx.fillStyle='rgba(255,255,255,.04)';ctx.fill();ctx.restore()}
|
||||
|
||||
// progress
|
||||
const pc=Math.min(cur/max,1),on=Math.round(pc*N),rl=max*.85;
|
||||
for(let i=0;i<on;i++){const p=tp(i),s=twScale(i),w=(tw-gap)*s,h=th*s;ctx.save();ctx.translate(p.x,p.y);ctx.rotate(p.r);ctx.fillStyle=cur>=rl?'rgba(255,50,35,.95)':'rgba(255,255,255,.85)';ctx.fillRect(-w/2,-h/2,w,h);ctx.restore()}
|
||||
for(let i=0;i<on;i++){const p=tp(i),s=twScale(i),w=(tw-gap)*s,h=th*s;ctx.save();ctx.translate(p.x,p.y);ctx.rotate(p.r);ctx.beginPath();ctx.roundRect(-w/2,-h/2,w,h,th*.4);ctx.fillStyle=cur>=rl?'rgba(255,50,35,.95)':'rgba(255,255,255,.85)';ctx.fill();ctx.restore()}
|
||||
|
||||
// scale nums - larger
|
||||
const sx=Ca/640*W,sy=Cb/480*H,sr=Cr/640*W;
|
||||
|
||||
Reference in New Issue
Block a user