Как отлаживать фрактальное дерево? - PullRequest
Новая
       22

Как отлаживать фрактальное дерево?

0 голосов
/ 20 апреля 2019

Мне нужна помощь в отладке моего кода.

У меня есть задача создания для экзамена AP.Я попытался дать подсказки "неопределенным" 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)

1 Ответ

0 голосов
/ 20 апреля 2019

Я могу заставить его работать для вас, но без объяснения причин я не могу заставить его работать должным образом 

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>
...