La maggior parte delle immagini ha tre canali di dati: rosso, verde e blu, spesso chiamati dati RGB. Ogni pixel nell'immagine ha un valore per ogni canale di colore e in JMP (0,0,0) sarà nero, (1,1,1) bianco, (1,0,0) rosso e (0,5,0,5 ,0.5) grigio.
Ai web designer piace un altro canale di informazioni per la trasparenza; le icone hanno spesso aree trasparenti che lasciano trasparire lo sfondo. Quel canale è chiamato canale alfa e diventa RGBA.
Il canale alfa, come i canali colore, può avere valori frazionari; alpha e 1 - alpha sono le frazioni del primo piano e dello sfondo utilizzate per creare il risultato. I risultati sono abbastanza buoni se non guardi troppo da vicino.
Alpha transparency around JMP's iconTrasparenza alfa attorno all'icona di JMP
Puoi sperimentare questo eseguendo AlphaIcon.jmpapp allegato. Il gradiente dietro l'icona è visibile attraverso le aree trasparenti e i bordi sono in dissolvenza incrociata tra blu e verde o blu e arancione. Un valore alfa di 0,0 mostra il gradiente; 1.0 mostra l'icona e i valori frazionari mostrano la dissolvenza incrociata. (Ho usato un'app di ingrandimento per ottenere la grande immagine pixelata. Ho usato il generatore di app per far fluttuare la casella dell'icona su un grafico con un gradiente.)
L'esempio sopra è il modo tipico in cui viene utilizzato il canale alfa. L'esempio seguente è una variante. JSL sta disegnando il colore con i valori RGB e disegnando le linee bianche (o nere) con il valore alfa. Esistono altri modi per ottenere lo stesso effetto, ma in questo modo non è necessario un codice aggiuntivo per unire i dati. Il colore della linea è determinato dal colore di sfondo del riquadro del bordo che contiene il riquadro dell'immagine. Quando il valore alfa è 0, viene visualizzato lo sfondo. Nella funzione render, due array, bitcolor e bitcurve, vengono combinati per creare l'immagine. bitcurve è costruito con 1.0 dove dovrebbe apparire la linea, quindi 1-bitcurve crea il canale alfa necessario.
{red,green,blue} = colortorgb(bitcolor);
image=newimage("rgba",{red,green,blue,1-bitcurve});La modifica dei risultati dalla linea bianca su sfondo nero alla linea nera su sfondo bianco viene eseguita modificando il colore del riquadro del bordo.
newwindow("curves",bb=borderbox(textbox("")));
bb<<SETBACKGROUNDCOLOR></SETBACKGROUNDCOLOR>La casella di confine viene creata con una casella di testo fittizia figlia che viene sostituita dalla prima immagine.
(bb<<CHILD></CHILD>
Bitcurve a sinistra, bitcolor al centro, RGBA a destra. In questa immagine, i dati RGB sono per lo più neri e lo sfondo bianco mostra dove il canale alfa è > 0.0.
Border box with a white backgroundCasella di confine con uno sfondo bianco
In questa immagine, i dati RGB sono per lo più bianchi e lo sfondo nero è invece visibile.
Border box with a black backgroundCasella di confine con uno sfondo nero
In entrambe le immagini sopra, il lato destro mostra la fusione alfa dei colori sul colore di sfondo del riquadro del bordo.
Il file curveyBlog.jsl allegato crea l'immagine incrementando le linee attive, ramificandole in modo casuale e scattando una foto. Il video è Qui e vuole essere massimizzato.
Esempio precedente .
Grazie! Mi piacciono gli algoritmi che hanno diversi parametri sintonizzabili che aiutano a dirigere il modo in cui vengono utilizzati gli elementi casuali. Questo ha funzionato fino a quando le viti hanno esaurito abbastanza spazio per impedire un'ulteriore crescita. Una volta scelti i parametri, l'ho eseguito più volte per ottenere una serie di immagini che mi piacevano, con la giusta dimensione del passo per realizzare una lunghezza del video che mi piaceva.
