Risolviamo alcuni esercizi sui multipli con Algobuild, al fine di esercitarci ancora con la selezione.
Esercizio 1 sui multipli con Algobuild
Dati in input due numeri A e B, controllare se A è multiplo di B.
Per verificare che A é un multiplo di B, basta controllare che il resto della divisione di A per B sia uguale a zero.
Per lo sviluppo dell’algoritmo mi serviranno queste forme:
Ellisseper l’inizio e per la fine;
Parallelogramma per inserire l’input, ovvero in questo caso per prendere i due numeri A e B e per visualizzare in output il risultato;
Romboper effettuare un test che può essere vero o falso.
Quindi chiedo in input i due numeri e controllo semplicemente se A%B==0, cioè se il resto della divisione di A per B è uguale a zero. Se è vero allora A è multiplo di B, altrimenti A non è un multiplo. In entrambi i casi visualizzo in output il messaggio opportuno.
Ecco il diagramma di flusso che rappresenta la risoluzione dell’algoritmo sui multipli con Algobuild.
Esercizio 2
Vediamo un altro semplice esercizio sui multipli con Algobuild.
Dati in input due numeri A e B controllare se A è multiplo di B, oppure B è multiplo di A.
L’esercizio è molto simile a quello di prima. Dobbiamo aggiungere nel ramo del falso un’altra condizione, cioè che B%A==0. Se questa condizione è vera allora B è multiplo di A. Altrimenti B non è multiplo di A.
Allego il diagramma di flusso realizzato con Algobuild.
Chiaramente questi sono solo alcuni semplici algoritmi che risolvono quesiti sui multipli con Algobuild.
Oggi impareremo a creare un algoritmo per trovare i divisori di un numero con Algobuild.
Quindi mi serviranno queste forme:
Ellisseper l’inizio e per la fine;
Rettangolo per effettuare le operazioni e per l’assegnamento;
Parallelogramma per inserire l’input, ovvero in questo caso per prendere il numero e per visualizzare in output il risultato;
Romboper effettuare un test che può essere vero o falso.
Algoritmo per trovare i divisori di un numero con Algobuild
Per trovare i divisori di un numero posso dividere per tutti i numeri fino ad arrivare al numero stesso.
Ma ci sono delle operazioni che potrei risparmiare per guadagnare velocità di calcolo. Infatti potrei dividere partendo da 1 fino ad arrivare alla metà del numero stesso.
Se ad esempio consideriamo 10 i suoi divisori sono 1,2,5,10.
Quindi tra il 5 e il 10 ci sono i numeri 6,7,8,9. Bene se divido 10 per questi numeri sicuramente ottengono un numero non intero.
Allora posso tralasciarli.
Iniziamo a costruire il nostro algoritmo per calcolare i divisori di un numero preso in input.
Prendo in input il numero e lo memorizzo in una variabile. Dopo calcolo il divisore con la seguente formula:
divisore=floor(numero/2);
In questo modo arrotondo per difetto il numero diviso due.
Ad esempio se come numero metto 10 allora divisore sarà uguale a 5; se inserisco 11 il divisore sarà sempre uguale a 5.
Dopo, con un ciclo while, finché il divisore è maggiore di 1, partendo da divisore=floor(numero/2) vado a trovare i resti della divisione.
Se il resto della divisione è uguale a zero allora è un divisore. Per calcolare il resto uso l’operatore modulo ( % ).
Ecco il diagramma di flusso per trovare i divisori di un numero con Algobuild.
Si poteva anche partire al contrario, dividendo per 1 fino ad arrivare a numero/2.
Chiaramente questo è solo una possibile soluzione all’algoritmo per trovare i divisori di un numero con Algobuild.
In questo articolo parleremo ancora dei canvas con JavaScript.
Faremo un esempio molto semplice graficamente. Più avanti infatti vedremo come implementare i grafici utilizzando la libreria Chart.js, oggi vi indico per il momento solo il link alla libreria: chartjs.org.
Ipotizziamo quindi di prendere dei dati dalle caselle di input e realizzare un grafico a torta utilizzando proprio questi dati.
Inserite dunque i dati nelle caselle di input e dopo cliccate sul pulsante crea. Subito sotto vedrete il grafico a torta che si è generato.
Ecco come dovrebbe risultare l’esempio di utilizzo dei canvas con javascript:
Procedimento – uso di canvas con JavaScript per creare grafici
Innanzitutto inseriamo le caselle di input di tipo number, specificando l’id e aggiungiamo il button dove all’evento onclick() richiamiamo la funzione creaGrafico().
Dopo inseriamo l’area dove generare il nostro grafico:
<canvas id="disegno" width="400" height="200">
Spiacente non supporto i canvas di HTML5 </canvas>
Infine creiamo la nostra funzione JavaScript.
Per crearla iniziamo a rendere disponibile l’oggetto come nell’esempio precedente:
var disegno=document.getElementById('disegno');
var context=disegno.getContext('2d');
Poi leggiamo i dati dalla casella di testo, utilizzando il metodo getElementById() come abbiamo spiegato negli articoli precedenti.
Adesso dobbiamo calcolare le ampiezze degli angoli dal valore immesso in input. Utilizziamo questa semplice proporzione:
angolo=valore * 2 PiGreco/totale.
Quindi calcoliamo il totale dei valori immessi in input e dopo ricaviamo gli angoli.
Infine iniziamo a creare le nostre porzioni di torta utilizzando il metodo beginPath() e closePath() per ogni porzione.
Allego lo script completo che utilizza i canvas con JavaScript per creare grafici a torta.
<script type="text/javascript">
function creaGrafico(){
var disegno=document.getElementById('disegno');
var context=disegno.getContext('2d');
var input1=eval(document.getElementById('dato1').value);
var input2=eval(document.getElementById('dato2').value);
var input3=eval(document.getElementById('dato3').value);
var input4=eval(document.getElementById('dato4').value);
var total=input1+input2+input3+input4;
var angle1=2*Math.PI*input1/total;
var angle2=2*Math.PI*input2/total;
var angle3=2*Math.PI*input3/total;
var angle4=2*Math.PI*input4/total;
context.beginPath();
context.arc(100,100,50,0,angle1, false);
context.lineWidth=2;
context.lineTo(100,100);
context.fillStyle="rgba(255,255,0,1)";
context.fill();
context.closePath();
context.beginPath();
context.arc(100,100,50,angle1,angle2+angle1,false);
context.lineWidth=2;
context.lineTo(100,100);
context.fillStyle="rgba(0,240,255,1)";
context.fill();
context.closePath();
context.beginPath();
context.arc(100,100,50,angle2+angle1,angle3+angle2+angle1,false);
context.lineWidth=2;
context.lineTo(100,100);
context.fillStyle="rgba(255,0,255,1)";
context.fill();
context.closePath();
context.beginPath();
context.arc(100,100,50,angle3+angle2+angle1,angle4+angle3+angle2+angle1,false);
context.lineWidth=2;
context.lineTo(100,100);
context.fillStyle="rgba(200,155,255,1)";
context.fill();
context.closePath();
}
</script>
In maniera simile si potrebbero ad esempio creare degli istogrammi, mi servirà in questo caso ad esempio il metodo fillRect().
Chiaramente questi sono solo dei semplici esempi di come realizzare grafici utilizzando i canvas con JavaScript.
In questo articolo parleremo di come trovare i divisori di un numero con Scratch.
Chiediamo quindi un numero in input e il programma trova i divisori in automatico.
Ad esempio se prendiamo in input il numero 6 i divisori sono 6, 3, 2, 1.
Quindi realizziamo con Scratch questo semplice programma.
Procedimento per il calcolo dei divisori di un numero con Scratch
Partiamo da alcune considerazioni.
Ogni numero è divisibile per se stesso e per 1, quindi facciamo senza a controllare se il resto della divisione è zero.
Inoltre possiamo restringere il campo delle divisioni ad n/2 in quanto ciascun numero diviso un numero maggiore della sua metà dà sempre resto diverso da zero.
Quindi potremmo dividere da 2 fino ad n/2. Nel caso in cui il numero sia dispari arrotondiamo il valore con la funzione arrotonda di Scratch.
Ecco quindi lo sfondo e lo sprite che ho scelto.
Creiamo poi le variabili numero e divisore:
Ecco il codice a blocchi completo per il calcolo dei divisori di un numero con Scratch.
Ho comunque diviso il numero per uno ma come spiegato prima potevo anche farne a meno.
Potevamo procedere anche iniziando a dividere da numero/2 fino ad 1, cioè al contrario.
Chiaramente questa è una possibile soluzione per trovare i divisori di un numero con Scratch, dunque proponete pure la vostra nei commenti sotto.
Abbiamo già visto degli esempi con la libreria jsPDF continuiamo ancora a vedere come generare un pdf da una pagina web.
Inserire immagini in un pdf con la libreria jsPDF
In questo esempio vediamo come inserire delle immagini in un documento pdf che andremo a creare facendo clic sul link dell’immagine.
L’operazione da fare è molto semplice, ma dobbiamo convertire la nostra immagine in base64.
Ma che cos’è la codifica base64? E’ una tecnica di conversione che consente la traduzione di dati binari (0,1) in stringhe di testo ASCII sulla base di 64 caratteri diversi.
Vi elenco alcuni convertitori di immagini a base64, che potete utilizzare per convertire le vostre immagini da inserire nel documento pdf.
Funzionano tutti allo stesso modo: si carica l’immagine e dopo si genera il codice base64. Questo codice ci servirà quindi per caricare la nostra immagine nel file pdf.
Ecco il nostro esempio, se cliccate su crea immagine, si genera un file pdf con l’immagine che ho codificato in precedenza a base64.
