shoe/random-walkers
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Leave a trail behind the walker

Browse Source
This commit is contained in:
shoe 2025-03-21 21:06:44 +00:00
parent 8e657a870a
commit 555735966e
1 changed files with 36 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
random-walkers.js
View File

@ -16,7 +16,7 @@ window.onload = function() {
autoPlace: false, autoPlace: false,
}); });
gui.add(controls, "step_time", 200, 2000).name("step time ms").step(1); gui.add(controls, "step_time", 50, 1000).name("step time ms").step(50);
gui.add(controls, "fadeout", 0, 20).name("trail fadeout length (0 to disable)").step(1); gui.add(controls, "fadeout", 0, 20).name("trail fadeout length (0 to disable)").step(1);
//gui.add(controls, "cell_size", 10, 100).name("cell size").step(1); //gui.add(controls, "cell_size", 10, 100).name("cell size").step(1);
gui.addColor(controls, "color").name("guy color"); gui.addColor(controls, "color").name("guy color");
@ -27,7 +27,7 @@ window.onload = function() {
}; };
var controls = new(function() { var controls = new(function() {
this.step_time = 500; this.step_time = 200;
this.fadeout = 10; this.fadeout = 10;
this.cell_size = 22; this.cell_size = 22;
this.color = "#FFB000"; this.color = "#FFB000";
@ -92,7 +92,11 @@ function init_walk() {
} }
function move_walker() { function move_walker() {
add_random_direction(walker_pos); // leave a trail
trails.push({row: walker.row, col: walker.col, color: walker.color});
// move in random dir
add_random_direction(walker);
} }
function add_random_direction(pos) { function add_random_direction(pos) {
@ -116,6 +120,26 @@ function add_random_direction(pos) {
* Drawing * * Drawing *
****************************************************************************/ ****************************************************************************/
// from https://www.sitepoint.com/javascript-generate-lighter-darker-color/
function tweak_color_luminance(hex, lum) {
// validate hex string
hex = String(hex).replace(/[^0-9a-f]/gi, '');
if (hex.length < 6) {
hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
}
lum = lum || 0;
// convert to decimal and change luminosity
var rgb = "#", c, i;
for (i = 0; i < 3; i++) {
c = parseInt(hex.substr(i*2,2), 16);
c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
rgb += ("00"+c).substr(c.length);
}
return rgb;
}
function draw() { function draw() {
// pixel width and height // pixel width and height
var old_width = ctx.canvas.width; var old_width = ctx.canvas.width;
@ -143,7 +167,13 @@ function draw() {
draw_grid(); draw_grid();
// draw a colored square at the walker location // draw a colored square at the walker location
draw_grid_square(walker_pos.row, walker_pos.col, "red"); draw_grid_square(walker.row, walker.col, walker.color);
// for any trails, draw them
for (var i = 0; i < trails.length; i++) {
t = trails[i];
draw_grid_square(t.row, t.col, t.color);
}
// TODO CODE // TODO CODE
} }
@ -186,5 +216,6 @@ var offset_v = (canvas.height - (controls.cell_size * n_rows)).div(2);
var offset = {h: offset_h, v: offset_v}; var offset = {h: offset_h, v: offset_v};
// set start position of walker and start the random walk // set start position of walker and start the random walk
var walker_pos = {row: n_rows.div(2), col: n_cols.div(2)}; var walker = {row: n_rows.div(2), col: n_cols.div(2), color: controls.color};
trails = []
init_walk(); init_walk();