如何调试分形树？

Question

我需要帮助调试我的代码。

我有AP考试的创建任务。我尝试给出“undefined”ctx，angle，len和arc的提示，因为它没有识别出这些。

var ctx = prompt("Please enter a number between -360 and 360");
var branchWidth = prompt ("Please enter a number between one and ten");
var len = prompt ("Please enter any number between 0 and 20");
var angle = ctx;
function start() 
function draw(startX, startY, len, angle) {
  ctx.beginPath();
  ctx.save();
  ctx.translate(startX, startY);
  ctx.rotate(angle * Math.PI / 180);
  ctx.moveTo(0, 0);
  ctx.lineTo(0, -len);
  ctx.stroke();
  if (len < 10) {
    ctx.restore();
    return;
  }
  draw(0, -len, len * 0.8, -15);
  draw(0, -len, len * 0.8, 15);
  ctx.restore();
}
ctx.lineWidth = branchWidth;
ctx.strokeStyle = "rgb(rand";
ctx.fillStyle = "green";
if (len < 10) {
  ctx.beginPath();
  ctx.arc(0, -len, 10, 0, Math.PI / 2);
  ctx.fill();
  ctx.restore();
  return;
}
draw(0, -len, len * 0.8, angle + 10, branchWidth * 0.8);
draw(0, -len, len * 0.8, angle - 10, branchWidth * 0.8);
ctx.shadowBlur = 15;
ctx.shadowColor = "rgba(0,0,0,0.8)";
if (angle > 0) {
  ctx.bezierCurveTo(10, -len / 2, 10, -len / 2, 0, -len);
} else {
  ctx.bezierCurveTo(-10, -len / 2, -10, -len / 2, 0, -len);
}

start();

运行的预期程序，但得到结果：错误：行：8：SyntaxError：意外的令牌（8：0）

Answer 1

我可以让它为你跑，但没有解释我不能让它正常工作

var angle = prompt("Please enter a number between -360 and 360");
var branchWidth = prompt ("Please enter a number between one and ten");
var len = prompt ("Please enter any number between 0 and 20");
const ctx = document.getElementById("canvas").getContext("2d");
function draw(startX, startY, len, angle) {
  ctx.beginPath();
  ctx.save();
  ctx.translate(startX, startY);
  ctx.rotate(angle * Math.PI / 180);
  ctx.moveTo(0, 0);
  ctx.lineTo(0, -len);
  ctx.stroke();
  if (len < 10) {
    ctx.restore();
    return;
  }
  draw(0, -len, len * 0.8, -15);
  draw(0, -len, len * 0.8, 15);
  ctx.restore();
}
function start() {
  ctx.lineWidth = branchWidth;
  ctx.strokeStyle = "rgb(rand";
  ctx.fillStyle = "green";
  if (len < 10) {
    ctx.beginPath();
    ctx.arc(0, -len, 10, 0, Math.PI / 2);
    ctx.fill();
    ctx.restore();
    return;
  }
  draw(0, -len, len * 0.8, angle + 10, branchWidth * 0.8);
  draw(0, -len, len * 0.8, angle - 10, branchWidth * 0.8);
  ctx.shadowBlur = 15;
  ctx.shadowColor = "rgba(0,0,0,0.8)";
  if (angle > 0) {
    ctx.bezierCurveTo(10, -len / 2, 10, -len / 2, 0, -len);
  } else {
    ctx.bezierCurveTo(-10, -len / 2, -10, -len / 2, 0, -len);
  }
}
start();

<canvas id="canvas" width=1000 height=1000></canvas>