如何在基于Canvas的模拟时钟中组装以下代码库，并使Clockface具有28小时112分钟

Question

当分针在112分钟的时钟中击中56分钟时，小时将改变（根据以下代码，56的位置将是第14小时）。我们尝试了许多天的解决方案，并在Stackoverflow社区的Kaiido的帮助下终于取得了突破。它已成为我们月亮时钟系统第一部分的完整解决方案。目前，我们阻止了将数字值组装到模拟Canvas时钟系统中的步骤。这项钟表工作的目的是实现与科学界携手共进的雄心壮志。您在我们的努力下所做的贡献受到高度尊重。var canvas = document.getElementById("canvas");var ctx = canvas.getContext("2d");var radius = canvas.height / 2;ctx.translate(radius, radius);radius = radius * 0.90setInterval(drawClock, 1000);function drawClock() {  drawFace(ctx, radius);  drawNumbers(ctx, radius);  drawTime(ctx, radius);}function drawFace(ctx, radius) {  var grad;  ctx.beginPath();  ctx.arc(0, 0, radius, 0, 2 * Math.PI);  ctx.fillStyle = 'white';  ctx.fill();  grad = ctx.createRadialGradient(0, 0, radius * 0.95, 0, 0, radius * 1.05);  grad.addColorStop(0, '#333');  grad.addColorStop(0.5, 'white');  grad.addColorStop(1, '#333');  ctx.strokeStyle = grad;  ctx.lineWidth = radius * 0.1;  ctx.stroke();  ctx.beginPath();  ctx.arc(0, 0, radius * 0.1, 0, 2 * Math.PI);  ctx.fillStyle = '#333';  ctx.fill();}function drawNumbers(ctx, radius) {  var ang;  var num;  ctx.font = radius * 0.08 + "px arial";  ctx.textBaseline = "middle";  ctx.textAlign = "center";  for (num = 1; num < 29; num++) {    ang = num * Math.PI / 14;    ctx.rotate(ang);    ctx.translate(0, -radius * 0.85);    ctx.rotate(-ang);    ctx.fillText(num.toString(), 0, 0);    ctx.rotate(ang);    ctx.translate(0, radius * 0.85);    ctx.rotate(-ang);  }}function drawTime(ctx, radius) {  var now = new Date();  var hour = now.getHours();  var minute = now.getMinutes();  var second = now.getSeconds();  //hour  hour = hour % 12;  hour = (hour * Math.PI / 6) +    (minute * Math.PI / (6 * 60)) +    (second * Math.PI / (360 * 60));  drawHand(ctx, hour, radius * 0.5, radius * 0.07);  //minute  minute = (minute * Math.PI / 30) + (second * Math.PI / (30 * 60));  drawHand(ctx, minute, radius * 0.8, radius * 0.07);  // second  second = (second * Math.PI / 30);  drawHand(ctx, second, radius * 0.9, radius * 0.02);}