
previous

page 1
next

Moving right on from the last tutorial ... can you believe that this pattern was produced by just spiral()?
function spiral(d=1) {
fd(d); rt(89); d++;
if (d<500) spiral(d);
}
fd(d); rt(89); d++;
if (d<500) spiral(d);
}
Study this code carefully and see how many changes you can spot before I point them out in the next section.
Now this is new - (d=1) is how we can supply a value when one is not offered. So my spiral() ends up being treated as spiral(1) - this results in a line of length 1 and a turn of 89 degrees. You should be able to work out the rest of the story.
You will also have noticed that fd now requires an input as does rt.
function fd(d) {
g_ctx.beginPath();
g_ctx.moveTo(g_x,g_y);
var rad=g_h*Math.PI/180.0;
var dx=g_step*d*Math.sin(rad);
var dy=-g_step*d*Math.cos(rad);
g_x=g_x+dx; g_y=g_y+dy;
g_ctx.lineTo(g_x,g_y);
g_ctx.stroke();
}
function rt(angle) {
g_h=g_h+angle;
g_h=g_h%360;
}
g_ctx.beginPath();
g_ctx.moveTo(g_x,g_y);
var rad=g_h*Math.PI/180.0;
var dx=g_step*d*Math.sin(rad);
var dy=-g_step*d*Math.cos(rad);
g_x=g_x+dx; g_y=g_y+dy;
g_ctx.lineTo(g_x,g_y);
g_ctx.stroke();
}
function rt(angle) {
g_h=g_h+angle;
g_h=g_h%360;
}
So copy and paste these into a my.js file in a project_14 directory.
previous
next