Tutorial per inscrivere un poligono regolare in un poligono regolare- matematica con javascript su webfract

Contatti	MATEMATICA CON JAVASCRIPT - GUIDA CANVAS TUTORIAL PER LA COSTRUZIONE DI UN POLIGONO REGOLARE INSCRITTO IN UN POLIGONO REGOLARE CON LO STESSO NUMERO DI LATI

Il presente tutorial si riferisce a "poligoni regolari inscritti in poligoni regolari" della guida a MATEMATICA CON JAVASCRIPT, area Canvas.

Abbiamo preparato un documento che ha l'aspetto definito dalle righe di codice inserite nell'area di testo in basso a sinistra.
In particolare notate le due costanti

const num = 5 //se si vuole un pentagono e
const k = 0.25 //costante di proporzionalità fra i lati

potete variare num per ottenere un poligono regolare con un diverso numero di lati e k per variare la costante di proporzionalità fra i lati dei poligoni.

E' possibile osservare l'anteprima cliccando sul tasto:

A LATO per osservare il risultato nell' iframe a destra nella pagina;
POPUP per osservare il risultato in una finestra popup

NOTA BENE - Gli utenti google chrome possono solo visualizzare il risultato in una popup, a causa del malfunzionamento del browser con gli iframe.

Infine, cliccando sul tasto AGGIORNA, viene ricaricata la pagina corrente come è adesso:

IN EVIDENZA DAL SITO

www.tommasobientinesi.it

La passione per i viaggi e la natura nel nuovo sito di Tommaso Bientinesi

CODICE

<!DOCTYPE html> <html> <body> <canvas id="lavagna" width="400" height="400"> Your browser does not support the HTML5 canvas tag.</canvas> <script> var c = document.getElementById('lavagna'); var ctx=c.getContext("2d"); var Ox = c.width/2; var Oy = c.height/2; ctx.translate(Ox,Oy); const num = 5 //se si vuole un pentagono const u = 180 //unità di misura preferita const k = 0.25; var x = new Array(); //ascisse vertici var y = new Array(); //ordinate vertici const alfa = 2*Math.PI/num; x[0]=-Math.sin(alfa/2); //vedi PRIMA PARTE y[0]=Math.cos(alfa/2); for (i=1; i<=num-1; i+=1){ x[i]=x[i-1]*Math.cos(-alfa) - y[i-1]*Math.sin(-alfa); y[i]=x[i-1]*Math.sin(-alfa) + y[i-1]*Math.cos(-alfa); } ctx.beginPath(); ctx.moveTo(u*x[0],u*y[0]); for (i=1;i<=num-1;i+=1){ ctx.lineTo(u*x[i],u*y[i]) } ctx.closePath() ctx.stroke(); var appox=x[0]; var appoy=y[0] for (i=0; i<=num-2; i+=1){ x[i]=(1 - k) * x[i] + k * x[i+1]; y[i]=(1 - k) * y[i] + k * y[i+1]; } x[num-1]=(1 - k) * x[num-1] + k * appox; y[num-1]= (1 - k) * y[num-1] + k * appoy; ctx.beginPath(); ctx.moveTo(u*x[0],u*y[0]); for (i=1;i<=num-1;i+=1){ ctx.lineTo(u*x[i],u*y[i]) } ctx.closePath() ctx.stroke(); </script> </body> </html>

RISULTATO

Matematica con javascript, area Canvas: Indice - Inscrivere un poligono regolare Matematica con javascript Indice - Indice tutorials

MATEMATICA CON JAVASCRIPT - GUIDA CANVAS

TUTORIAL PER LA COSTRUZIONE DI UN POLIGONO REGOLARE INSCRITTO IN UN POLIGONO REGOLARE CON LO STESSO NUMERO DI LATI

CODICE

RISULTATO