A couple of methods exist that modify the whole frame at once.
ra.fillFrame
is useful for doing cellular automata and frame-buffer style effects. It takes a callback that is called with each (x,y) position, and if that callback returns a number, that number is assigned to the field at that spot.
const ra = require('raster');
ra.setSize(64, 64);
ra.setZoom(3);
ra.fillFrame((x, y) => {
return x * y;
});
ra.run();
ra.fillFlood
is called with a postion on the field, and flood fills starting at that position. This fills in the given position with the current color, as well as any adjacent positions in the field that contain the same value.
const ra = require('raster');
ra.setSize(40, 40);
ra.setZoom(4);
ra.fillColor(34);
ra.setColor(2);
ra.drawSquare(2, 5, 21);
ra.drawCircle(12, 9, 13);
ra.setColor(39);
ra.fillFlood(20, 20);
ra.run();
ra.fillPattern
takes a pattern, represented as a 2d grid of colors
const ra = require('raster');
ra.setSize(20, 20);
ra.setZoom(8);
ra.fillPattern([[ 3, 2, 2, 4],
[ 4, 27, 43, 5],
[ 4, 43, 43, 5],
[ 5, 6, 6, 6]]);
ra.run();
Since these methods all operate on an entire field, it can be useful to select just some part of the field to work with instead. By calling ra.select
a subset of the field is retrieved. Any modifications by drawing or filling will also affect the original field, but only in the selected area.
const ra = require('raster');
ra.setSize(64, 64);
ra.setZoom(3);
ra.fillColor(58);
let sel = ra.select(5, 3, 20, 26);
sel.fillFrame((x, y) => {
return x * y;
});
sel = ra.select(31, 5, 26, 23);
sel.setColor(29);
sel.drawCircle(2, 2, 16);
sel.fillFlood(0, 0);
sel = ra.select(4, 35, 56, 24);
sel.fillPattern([[35, 37], [39, 41]]);
ra.run();
Previous: Animation | Table of Contents | Next: Text |