Realizzare Giochi in HTML5 Ep. VI: Display Object con CreateJS

Le coordinate del Canvas

Per posizionare gli oggetti all’interno dello spazio di riferimento di un Canvas utilizziamo le coordinate, x e y.

Modificando il valore della coordinata x possiamo spostare un elemento sull’asse orizzontale, modificando il valore della coordinata y lo spostiamo sull’asse verticale. Se non indichiamo nessun valore per queste due coordinate il sistema le considera pari a zero, il punto a coordinate x = 0 e y = 0 di un Canvas si trova nell’angolo in alto a sinistra.

Adesso inseriremo un secondo cerchio, di colore rosa, alle coordinate [100, 70] vale a dire 100 pixel verso destra e 70 pixel verso il basso, ecco il codice:

 pink_circle = new createjs.Shape();
 pink_circle.graphics.beginFill("#FF6699");
 pink_circle.graphics.drawCircle(0,0,30);
 pink_circle.x = 100;
 pink_circle.y = 70;
 pink_circle.graphics.endFill();
 stage.addChild(pink_circle);

Ed ecco il risultato:

0