La plupart des images ont trois canaux de données : rouge, vert et bleu, souvent appelés données RVB. Chaque pixel de l'image a une valeur pour chaque canal de couleur, et dans JMP (0,0,0) sera noir, (1,1,1) blanc, (1,0,0) rouge et (0,5,0,5 ,0.5) gris.
Les concepteurs de sites Web aiment un autre canal d'information pour la transparence ; les icônes ont souvent des zones transparentes qui laissent transparaître l'arrière-plan. Ce canal s'appelle le canal alpha et devient RGBA.
Le canal alpha, comme les canaux de couleur, peut avoir des valeurs fractionnaires ; alpha et 1 - alpha sont les fractions du premier plan et de l'arrière-plan utilisées pour créer le résultat. Les résultats sont plutôt sympas si vous ne regardez pas de trop près.
Alpha transparency around JMP's iconTransparence alpha autour de l'icône de JMP
Vous pouvez expérimenter cela en exécutant l'AlphaIcon.jmpapp ci-joint. Le dégradé derrière l'icône apparaît à travers les zones transparentes et les bords sont fondus entre le bleu et le vert ou le bleu et l'orange. Une valeur alpha de 0,0 laisse apparaître le dégradé ; 1.0 affiche l'icône et les valeurs fractionnaires indiquent le fondu enchaîné. (J'ai utilisé une application de loupe pour obtenir la grande image pixélisée. J'ai utilisé App Builder pour faire flotter la boîte à icônes sur un graphique avec un dégradé.)
L'exemple ci-dessus est la manière typique d'utiliser le canal alpha. L'exemple ci-dessous est une variante. Le JSL dessine la couleur avec les valeurs RVB et dessine les lignes blanches (ou noires) avec la valeur alpha. Il existe d'autres façons d'obtenir le même effet, mais cette méthode n'a pas nécessité de code supplémentaire pour fusionner les données. La couleur de la ligne est déterminée par la couleur d'arrière-plan de la zone de bordure qui contient la zone d'image. Lorsque la valeur alpha est 0, l'arrière-plan s'affiche. Dans la fonction de rendu, deux tableaux, bitcolor et bitcurve, sont combinés pour créer l'image. bitcurve est construit avec 1.0 où la ligne doit apparaître, donc 1-bitcurve crée le canal alpha nécessaire.
{red,green,blue} = colortorgb(bitcolor);
image=newimage("rgba",{red,green,blue,1-bitcurve});Changer les résultats d'une ligne blanche sur fond noir à une ligne noire sur fond blanc se fait en changeant la couleur de la bordure.
newwindow("curves",bb=borderbox(textbox("")));
bb<<SETBACKGROUNDCOLOR></SETBACKGROUNDCOLOR>La zone de bordure est créée avec un enfant de zone de texte factice qui est remplacé par la première image.
(bb<<CHILD></CHILD>
Bitcurve à gauche, bitcolor au centre, RGBA à droite. Dans cette image, les données RVB sont principalement noires et le fond blanc apparaît là où le canal alpha est > 0,0.
Border box with a white backgroundBoîte de bordure avec un fond blanc
Dans cette image, les données RVB sont principalement blanches et le fond noir apparaît à la place.
Border box with a black backgroundBoîte de bordure avec un fond noir
Dans les deux images ci-dessus, le côté droit montre le mélange alpha des couleurs sur la couleur d'arrière-plan de la zone de bordure.
Le curveyBlog.jsl joint construit l'image en incrémentant les lignes actives, en les ramifiant de manière aléatoire et en prenant une photo. La vidéo est ici et veut être maximisé.
Exemple précédent .
Merci! J'aime les algorithmes qui ont plusieurs paramètres réglables qui aident à diriger la façon dont les éléments aléatoires sont utilisés. Celui-ci a fonctionné jusqu'à ce que les vignes aient utilisé suffisamment d'espace pour empêcher toute croissance supplémentaire. Une fois les paramètres choisis, je l'ai exécuté plusieurs fois pour obtenir un ensemble d'images que j'aimais, à la bonne taille de pas pour faire une longueur de vidéo que j'aimais.
