Indicazione degli angoli
Per impostazione predefinita, gli angoli vengono espressi in radianti, da 0 a 6,283185307179586 (2π).
// height=400
let semiLarghezza;
let semiAltezza;
let raggioMax;
let raggioAssi;
let raggio;
let radianti = 0;
function setup() {
createCanvas(windowWidth, 400);
colorMode(HSL);
textAlign(CENTER,CENTER);
//textSize(14);
//textSize(18);
setupResizable();
//cursor(HAND);
cursor(MOVE);
}
function windowResized() {
resizeCanvas(windowWidth, 400);
setupResizable();
}
function setupResizable() {
semiLarghezza = width/2;
semiAltezza = height/2;
//raggio = min(width,height)*0.3;
raggioMax = min(width,height)/2;
raggioAssi = raggioMax*0.8;
raggio = raggioMax*0.6;
textSize(raggioMax*0.085)
}
function draw() {
// let radianti = frameCount / 200;
if (mouseIsPressed) {
let dx = mouseX-semiLarghezza;
let dy = mouseY-semiAltezza;
radianti = (atan2(dy, dx) + TWO_PI) % TWO_PI;
} else {
radianti += 0.005;
}
let coseno = cos(radianti)*raggio;
let seno = sin(radianti)*raggio;
background(255);
translate(semiLarghezza,semiAltezza);
strokeWeight(1);
// assi cartesiani
stroke(80);
//line(-semiLarghezza,0,semiLarghezza,0);
//line(0,-semiAltezza,0,semiAltezza);
line(-raggioAssi,0,raggioAssi,0);
line(0,-raggioAssi,0,raggioAssi);
// proiezioni
//stroke(90);
//line(coseno,seno,coseno,0);
//line(coseno,seno,0,seno);
// radianti
noStroke();
fill(0,100,50,0.05);
arc( 0,0, raggio*2,raggio*2, 0,radianti );
// punto
// fill(80);
// circle(coseno,seno,7);
strokeWeight(5);
// segmento
stroke(40);
line(0,0,coseno,seno);
// coseno
//stroke(100,90,45);
//line(0,0,coseno,0);
// seno
//stroke(220,100,55);
//line(0,0,0,seno);
// testi
//stroke(100,0.5);
stroke(100);
strokeWeight(2);
textStyle(BOLD);
fill(35);
text( "3.14\n(π)", -raggioAssi*1.1, 0 );
text( "6.28\n(2π)", raggioAssi*1.1, -raggioAssi*0.17 );
text( " 0", raggioAssi*1.1, raggioAssi*0.085 );
text( "4.71", 0, -raggioAssi );
text( "1.57", 0, raggioAssi );
//let semiRadianti = (radianti % TWO_PI) / 2;
let radiantiTxt = (radianti % TWO_PI);
let raggioTxt = raggio*1.175;
fill(0,100,50);
//text( nfc(radianti % TWO_PI, 2), cos(semiRadianti)*raggio/2, sin(semiRadianti)*raggio/2 );
text( nfc(radianti % TWO_PI, 2), cos(radiantiTxt)*raggioTxt, sin(radiantiTxt)*raggioTxt );
//fill(100,90,40);
//text( nfc(cos(radianti)*1.01,2), coseno, -10 );
//fill(220,100,55);
//text( nfc(sin(radianti)*1.01,2), 21, seno );
}
Gli angoli possono essere indicati in gradi, da 0 a 360, inserendo prima l'istruzione angleMode(DEGREES).