Skip to content

Instantly share code, notes, and snippets.

@Sillium
Last active November 6, 2023 12:23
Show Gist options
  • Save Sillium/4210779bc2d759b494fa60ba4f464bd8 to your computer and use it in GitHub Desktop.
Save Sillium/4210779bc2d759b494fa60ba4f464bd8 to your computer and use it in GitHub Desktop.
async function drawArc(
on,
percent = 50,
percent2 = -1
) {
const canvSize = 200;
const canvas = new DrawContext();
canvas.opaque = false;
const canvWidth = 18; // circle thickness
const canvRadius = 80; // circle radius
canvas.size = new Size(canvSize, canvSize);
canvas.respectScreenScale = true;
const deg = Math.floor(percent * 3.6);
let ctr = new Point(canvSize / 2, canvSize / 2);
bgx = ctr.x - canvRadius;
bgy = ctr.y - canvRadius;
bgd = 2 * canvRadius;
bgr = new Rect(bgx, bgy, bgd, bgd);
canvas.opaque = false;
canvas.setFillColor(Color.white());
canvas.setStrokeColor(new Color("#333333"));
canvas.setLineWidth(canvWidth);
canvas.strokeEllipse(bgr);
for (t = 0; t < deg; t++) {
rect_x = ctr.x + canvRadius * sinDeg(t) - canvWidth / 2;
rect_y = ctr.y - canvRadius * cosDeg(t) - canvWidth / 2;
rect_r = new Rect(rect_x, rect_y, canvWidth, canvWidth);
canvas.fillEllipse(rect_r);
}
if (percent2 >= 0) {
const canvRadius2 = 56; // circle radius
const deg2 = Math.floor(percent2 * 3.6);
bgx2 = ctr.x - canvRadius2;
bgy2 = ctr.y - canvRadius2;
bgd2 = 2 * canvRadius2;
bgr2 = new Rect(bgx2, bgy2, bgd2, bgd2);
canvas.strokeEllipse(bgr2);
for (t = 0; t < deg2; t++) {
rect_x = ctr.x + canvRadius2 * sinDeg(t) - canvWidth / 2;
rect_y = ctr.y - canvRadius2 * cosDeg(t) - canvWidth / 2;
rect_r = new Rect(rect_x, rect_y, canvWidth, canvWidth);
canvas.fillEllipse(rect_r);
}
}
let stack = on.addStack();
stack.size = new Size(65, 65);
stack.backgroundImage = canvas.getImage();
let padding = 0;
stack.setPadding(padding, padding, padding, padding);
stack.centerAlignContent();
return stack;
}
function sinDeg(deg) {
return Math.sin((deg * Math.PI) / 180);
}
function cosDeg(deg) {
return Math.cos((deg * Math.PI) / 180);
}
module.exports = {
drawArc
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment