Processing.js
Processing
Børre Stenseth
p5js >Klokke

En analog klokke

Hva

I denne modulen bruker vi transformasjoner for å tegn en analog klokke. Du finner en lignende løsning beskrevet ved processing pde-filer her: Klokke .

Vi legger også til en norsk datoangivelse. Den siste er helt uavhegig av p5js.


Klokka tegnes med følgende kode:

_sketch.js

Som du ser av koden bruker funksjonene push() og pop() i gjentatte ganger. I p5js innebærer push() at vi tar vare på både koordinatsystemet og stilsettinger. pop() bringer oss tilbake til tilstanden før siste push(). Det er viktig at det er match mellom push() og pop(). Jeg har valgt å bruke indentering i koden for å beholde oversikten over dette. Hva som lagres ved push(), og hentes ved pop(), er beskrevet i dp5js-dokumentasjonen. Når det gjelder manipulering av koordinatsystemet gjelder det translate(), scale() og rotate().

Datoen lages ved et kall på følgende funksjon:

_dato.js

Du kan inspisere denne strukturen på denne siden:
test.html https://borres.hiof.no/wep/proc/p5js/klokke/test.html

[1]
Referanser
  1. Processing.js Processing.js JavaScript interpretator for Processing processingjs.org/ 01-04-2014
p5js >Klokke