American Pinocchio

Paper.js / HTML5 - canvas / Javascript

Animation réalisée avec librairie Paper.js
Attention, navigateur compatible HTML5 obligatoire (exit IE8 donc)

Faites pinocchio avec les candidats américains aussi...

Code Paperscript

view.viewSize = [896, 477];
var radiuses = [5, 7, 9, 10, 12, 14, 16, 18, 21, 23, 25, 28, 30, 33, 36, 39, 42, 44, 51, 58, 67, 76, 86, 125, 240];
var mousePoint = view.center;

for (var i = 0; i < radiuses.length; i++) {
	var radius = radiuses[radiuses.length - 1 - i];
	var path = new Path.Circle(view.center, radius);
	var raster = new Raster('candidat');
	raster.position = view.center;
	var group = new Group([path, raster]);
	group.clipped = true;
}

function onMouseMove(event) {
	if (event.point.isInside(view.bounds)) {
		mousePoint = event.point;
	}
	else{
		mousePoint=view.center;
	}
}

Pour en savoir plus sur Paper.js, c'est par ici
Pour retourner à l'accueil du Workshop, c'est par là