instead of pictures (of cats etc.), use automatically generated pictures of colored shapes, like these:
do not generate pictures manually beforehand, but generate a random picture on each trial
use the CanvasTemplate, available here: https://github.com/babe-project/CanvasTemplate
total_set_size
from {10,25,50} and a non-zero focal_set_size
of at most total_set_size
shape
from {circle, square, triangle}focal_set_size
of shape
in the focal_color
, the rest in the other_color
(choose colors from {blue, red, yellow, green})shape
s are focal_color
.”index.html
:helpers.js
:var drawOnCanvas = function(canvasElem, trialInfo) {
var canvas = createCanvas(document.getElementById('canvas')); // defined in scripts/canvas.js
var coords = canvas.getCoords(trialInfo.total, trialInfo.size);
for (var i=0; i<trialInfo.total; i++) {
if (i < trialInfo.focalNumber) { canvas.draw(trialInfo.focalShape, trialInfo.size, coords[i].x, coords[i].y, trialInfo.focalColor); }
else { canvas.draw(trialInfo.otherShape, trialInfo.size, coords[i].x, coords[i].y, trialInfo.otherColor); }
}
};
views.js
: