Logo des Jeux Olympiques - Free Style Edition [fermé]


30

Dans un esprit similaire à cette question , votre mission est de créer le logo le plus beau dans au plus 1K de code.

Règles:

  1. Au plus 1K de code (inclus), pas de données externes.

  2. La réponse avec le plus de votes positifs l'emporte.

S'amuser!


6
Eh bien, il a déclaré directement "dans un esprit similaire à cette question ", alors il a pratiquement dit "hé, je sais que c'est un doublon": D
Mike Koch

5
Différents critères gagnants. C'est donc une question similaire, mais ce n'est pas un double.
Victor Stafusa

3
En fait, je suis content que quelqu'un d'autre ait créé une version de ma question pour un concours de popularité avec moins de critères, car j'étais déchiré sur la direction à suivre quand je l'ai écrite.
Adam Maras

@AdamMaras Heureux d'entendre cela :)
chubakueno

J'ai entamé une nouvelle discussion sur Meta , car cette question n'aurait pas dû faire l'objet d'un vote serré.
Adam Maras

Réponses:


44

SVG

1 Ko? Luxe. Je peux même imprimer la sortie plutôt que de supprimer tous les espaces inutiles. (L'indentation utilise, bien sûr, des tabulations, que Markdown convertit en espaces, c'est pourquoi le nombre de caractères peut sembler supérieur au 977. La suppression des espaces inutiles le fait tomber à 861).

Les chevauchements sont gérés correctement en dessinant les anneaux dans une direction, puis en appliquant un clip et en les dessinant dans l'autre direction. Les couleurs et les rapports sont extraits d'un document officiel qui, pour une raison quelconque, utilise des courbes de Bézier plutôt que des cercles.

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="504" height="228">
    <defs>
        <clipPath id="t">
            <rect width="504" height="114" />
        </clipPath>
    </defs>
    <g fill="none" stroke-width="12">
        <g id="u" transform="translate(82,82)" stroke="#0b8ed8">
            <g id="O">
                <circle r="72" stroke="#fff" stroke-width="20" />
                <circle r="72" />
            </g>
        </g>
        <g id="y" transform="translate(167,146)" stroke="#f9a91f">
            <use xlink:href="#O" />
        </g>
        <g id="k" transform="translate(252,82)" stroke="#231f20">
            <use xlink:href="#O" />
        </g>
        <g id="g" transform="translate(337,146)" stroke="#009e59">
            <use xlink:href="#O" />
        </g>
        <g transform="translate(422,82)" stroke="#ee2049">
            <use xlink:href="#O" />
        </g>
        <g clip-path="url(#t)">
            <use xlink:href="#g" />
            <use xlink:href="#k" />
            <use xlink:href="#y" />
            <use xlink:href="#u" />
        </g>
    </g>
</svg>

Rendu PNG du fichier SVG


16
PS Si quelqu'un veut faire valoir que SVG n'est pas un langage de programmation (et je serais très enclin à être d'accord), considérez-le comme un programme PHP dans le style de nombreuses soumissions PHP à ce site qui fait simplement écho au texte littéral.
Peter Taylor

omg ça a l'air incroyable cependant. SVG is niceee

39

Javascript (noyau) - 1000 sur le point. - WebKit (Chrome)

Jouer avec la toile.

Je ne sais pas si c'est 1024 ou 1000 Kc'est pour, mais j'ai réussi à le faire descendre à 1000 982 940: D

Convient uniquement aux navigateurs WebKit. Chrome OK. Firefox un gâchis. Pourrait en faire un navigateur croisé.


Code:

var w=window;w.onload=function(){function e(e,t){return r()*(t-e+1)+e}function d(e,t){function r(e,t,r,i){c.beginPath();c[u]="xor";c.strokeStyle="#"+e;c.arc(t,r,66,n*i[0],n*i[1]);c.stroke();c[u]="destination-atop";c.arc(t,r,66,n*i[1],n*i[0]);c.stroke()}var i=79+e,s=66+t,o=158,a=[2,1.2],f=[1.8,.8];c.lineWidth=13;r("007a9c",e,t,f);r("ffa100",i,s,a);r("000",e+=o,t,f);r("009b3a",i+=o,s,a);r("e10e49",e+=o,t,f)}var t=Math,n=t.PI,r=t.random,i,s,o=0,u="globalCompositeOperation",a=document.getElementById("c"),f=w.innerWidth,l=w.innerHeight,c=a.getContext("2d"),h=9,p=[];a.width=f;a.height=l;for(i=0;i<l;++i){p.push({x:r()*f,y:r()*l,r:e(1,3),d:e(1,l)})}setInterval(function(){c.clearRect(0,0,f,l-h);d(f/2-200,l-200);c[u]="xor";c.fillStyle="#fff";c.beginPath();o+=e(0,7)?.01:-.01;for(i=0;i<l-h;++i){s=p[i];c.moveTo(s.x,s.y);c.arc(s.x,s.y,s.r,0,n*2);s.y+=t.cos(o+s.d)+1+s.r/9;s.x+=(i%2?1:-1)*t.sin(o)*.4;if(s.x>f+7||s.x<-7||s.y>l-(h-1.2)){p[i]={x:r()*f,y:-9,r:s.r,d:s.d}}}c.fill();if(h<l/1.7)h+=l/9e3},32)}

940: Suppression de l'enveloppement onloadet reposant sur l'insertion du script à la fin du bodytag + bug d'alignement et correction de Firefox

function e(e,t){return r()*(t-e+1)+e}function d(e,t){function r(e,t,r,i){c.beginPath();c[u]="xor";c.strokeStyle="#"+e;c.arc(t,r,66,n*i[0],n*i[1]);c.stroke();c[u]="destination-over";c.arc(t,r,66,n*i[1],n*i[0]);c.stroke()}var i=79+e,s=66+t,o=158,a=[2,1.2],f=[1.8,.8];c.lineWidth=13;r("007a9c",e,t,f);r("ffa100",i,s,a);r("000",e+=o,t,f);r("009b3a",i+=o,s,a);r("e10e49",e+=o,t,f)}var w=window,t=Math,n=t.PI,r=t.random,i,s,o=0,u="globalCompositeOperation",a=document.getElementById("c"),f=w.innerWidth,l=w.innerHeight,c=a.getContext("2d"),h=9,p=[];a.width=f;a.height=l;for(i=0;i<l;++i,p.push({x:r()*f,y:r()*l,r:e(1,3),d:e(1,l)}));setInterval(function(){c.clearRect(0,0,f,l-h);d(f/2-158,l-200);c[u]="xor";c.fillStyle="#fff";c.beginPath();o+=e(0,7)?.01:-.01;for(i=0;i<l-h;++i){s=p[i];c.moveTo(s.x,s.y);c.arc(s.x+=(i%2?.4:-.4)*t.sin(o),s.y+=t.cos(o+s.d)+1+s.r/9,s.r,0,n*2);if(s.y>l-(h-1.2)){p[i].x=r()*f;p[i].y=-9}}c.fill();if(h<l/1.7)h+=l/9e3},32)

Violon:

http://jsfiddle.net/Ifnak/XSBLg/embedded/result/

http://jsfiddle.net/Ifnak/4fSWm/5/embedded/result/

Charge dans Firefox ainsi que Chrome, mais est plutôt lourd en ressources dans FF. En utilisantrequestAnimationFrame() aidé un peu, mais pas assez.

Notez que la neige repose en bas, faites donc défiler vers le bas pour voir la croissance lente. Au départ, il y avait une certaine peinture au sol, mais ne pouvait pas l'adapter à 1024 chr.

Résultat (screencast GIF de faible qualité):

entrez la description de l'image ici


2
Agréable! Il fonctionne également dans IE11.
Danko Durbić

Fonctionne parfaitement sur Firefox 27.0.1.
Nathan Osman

32

Mathematica

De ma réponse dans le Mathematica.SE Q&A :

ring[x_, y_, v_, t_] := 
  Table[
    {1.2 y, -v x, 0} + {Cos@i, Sin@i}.{{0, -1, 0}, {1, 0, 1/4 - v/2}},
    {i, 0, 2 π, π/200}
  ] ~Tube~ t

Graphics3D[
  Riffle[
    {Cyan, Yellow, Darker @ Gray, Green, Red},
    Array[ring[Sqrt@3/2, #, # ~Mod~ 2, 0.17] &, 5, 0] ],
  Boxed -> False,
  ViewPoint -> {0, 0, ∞}
]

entrez la description de l'image ici

Modifier: dans la version 10, le style d'éclairage par défaut a changé; pour rendre le graphique ci-dessus, il faudra ajouter l'option Lighting -> "Classic"à Graphics3D.

Jouer davantage avec l'éclairage pour produire un effet plat à deux dimensions:

Graphics3D[
  Riffle[
    Glow /@ {Hue[.59], Hue[.13], Black, Hue[.3, 1, .7], Hue[0, 1, .85]},
    Array[ring[Sqrt@3/2, #, # ~Mod~ 2, 0.13] &, 5, 0] ],
  Boxed -> False,
  ViewPoint -> {0, 0, ∞},
  Lighting -> None
]

entrez la description de l'image ici


Pour Oliver qui a dit que mon premier résultat était "trop ​​en 3D", voici un rendu 2D réel via le code de jVincent avec mon refactoring, également à partir du fil lié:

ringSegment[mid_, deg_, color_] := {CapForm["Butt"],
  Thickness[0.042], White,                   Circle[mid, 1, deg],
  Thickness[0.03],  RGBColor @@ (color/255), Circle[mid, 1, deg + {-0.1, 0.1}]}

blue   = {  0, 129, 188};
yellow = {255, 177,  49};
black  = { 35,  34,  35};
green  = {  0, 157,  87};
red    = {238,  50,  78};

Graphics @ GraphicsComplex[
  {{2.5, 0}, {1.3, -1}, {0, 0}, {5, 0}, {3.8, -1}},
  ringSegment @@@
   {{1, {0, 5/4 π},      black},
    {2, {0, π},          yellow},
    {3, {0, 2 π},        blue},
    {2, {-π 9/8, 1/4 π}, yellow},
    {4, {0, 5/4 π},      red},
    {5, {0, 7/8 π},      green},
    {1, {5/4 π, 5/2 π},  black},
    {5, {7/8 π, 2 π},    green},
    {4, {-3/4 π, 1/4 π}, red}}
 ]

entrez la description de l'image ici


@Oliver Mis à jour juste pour vous.
Mr.Wizard

Hou la la! Pouvez-vous me dire où vous pouvez télécharger Mathmatica?
Oliver Ni

@Oliver C'est un produit commercial, et assez cher même pour une utilisation individuelle et non commerciale, mais si vous êtes toujours intéressé, vous pouvez obtenir une version d'essai de 15 jours sur: wolfram.com/mathematica/trial
Mr.Wizard

1
@Oliver, vous pouvez maintenant obtenir une version gratuite de Mathematica si vous avez une pi framboise
trichoplax

Maintenant @trichoplax Open Cloud permet un des programmes modestes librement gérés dans une interface de navigateur: develop.open.wolframcloud.com/app/view/newNotebook
Mr.Wizard

28

Rubis, 321

Malheureusement, un certain chef d'État semble être le sujet principal de la plupart des nouvelles olympiques jusqu'à présent. Voici donc mon logo freestyle (mascotte?) Pour les Jeux de 2014.

w=?$;"UW[NASY_LAQVgKAPSlKAOKGLnHAOIHMnHAOHILpHANHJLqFAOFLKAVMAVMAWKAWLAWKAMIHFGK
NFMLAMGOFFGAGJPGFIAHGFFOWPPAIGFFKQFOKMJHAIJJQGNLGFMAJIJNFIGHFHSGASMMFHHASHGGPK
MFJHTKARJSKAMGFOPJAPPOJAPRKLAQRJLAQTHLAR^LFARaARaAR]HFASZAS[FFRGAT_QGAUZGFFG
U]AQGITAPHKPANKKSALMNSGGAJPOP".codepoints{|r|r-=69;$><<(r<0??\n:(w=w==?$?' ':?$)*r)}

Sortie: (Sauvegarder et plisser les yeux. Désolé pour le rendu primitif mais il ne mérite pas mieux.)

Poutine


6
$$$, triste mais vrai: D
ybeltukov

25

Bash + ImageMagick

convert \
  -size 330x150 xc:white -strokewidth 10 -fill none \
  -stroke \#0885c2 -draw 'arc 100,100 10,10 0,360' \
  -stroke black -draw 'arc 210,100 120,10 0,360' \
  -stroke \#ed334e -draw 'arc 320,100 230,10 0,360' \
  -stroke \#fbb132 -draw 'arc 155,140 65,50 0,360' \
  -stroke \#1c8b3c -draw 'arc 265,140 175,50 0,360' \
  -stroke \#0885c2 -draw 'arc 100,100 10,10 -20,10' \
  -stroke black -draw 'arc 210,100 120,10 -20,10' -draw 'arc 210,100 120,10 90,120' \
  -stroke \#ed334e -draw 'arc 320,100 230,10 90,120' \
  x:

Exemple de sortie:

logo des jeux olympiques


23

FreePascal

Jeux olympiques d'hiver? Que diriez-vous de quelques flocons de neige fractaux au lieu d'anneaux réguliers.

La récursivité de la branche centrale est assez évidente: (dx, dy) = 0,5 (dx, dy). Les branches gauche et droite sont basées sur la rotation par multiplication matricielle:

x = x cos (a) - y sin (a)

y = x sin (a) + y cos (a)

1/4 = 0,5 cos (60) et 7/16 est une bonne approximation de 0,5 sin (60).

uses graph;
var gd, gm : integer;
var n:integer;

Procedure tree(x,y,dx,dy: integer);
begin
  if dx*dx+dy*dy>0 then begin
    line(x, y, x+dx, y+dy);
    tree(x+dx, y+dy, dx div 2, dy div 2);
    tree(x+dx, y+dy, dx div 4 + dy*7 div 16, dy div 4 - dx*7 div 16);
    tree(x+dx, y+dy, dx div 4 - dy*7 div 16, dy div 4 + dx*7 div 16);
  end;
end;

begin
  gd := D4bit;
  gm := m640x480;
  initgraph(gd,gm,'');
  setbkcolor(white); clearviewport;
  setbkcolor(black); setlinestyle(0,0,3);

  For n:=-1 to 1  do  begin
    setColor(yellow);
    tree(215,240-120*n,0,120*n);
    setColor(lightgreen);
    tree(425,240-120*n,0,120*n);
    setColor(black);
    tree(320,120-120*n,0,120*n);
    setColor(lightred);
    tree(530,120-120*n,0,120*n);
    setColor(lightblue);
    tree(110,120-120*n,0,120*n);
  end;
  readln;
  closegraph;
end.

. .

image


Agréable. Si vous pouvez ajouter une bonne quantité de caractère aléatoire à l'algorithme, vous pouvez le réutiliser dans Simulons un flocon de neige aléatoire .
manatwork

16

Java

Similaire à ma réponse SVG, mais

  • Utilise deux clips, pour éviter de légères différences dues au double dessin avec anti-alias.
  • Parce que Java a de véritables boucles, la structure est un peu plus agréable.

Notez que je n'ai pas essayé de jouer au golf, malgré la possibilité de quelques astuces intéressantes (comme -57*~dirau lieu de 57*(1+dir). Il est à 923 caractères, mais les golfs à 624 assez facilement.

import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.File;
import javax.imageio.ImageIO;

public class Rings {
    public static void main(String[] args) throws Exception {
        int[] pal = new int[] {0x0b8ed8, 0xf9a91f, 0x231f20, 0x009e59, 0xee2049};
        BufferedImage img = new BufferedImage(505, 229, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g = img.createGraphics();
        g.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        for (int dir = -1; dir < 2; dir += 2) {
            g.setClip(0, 57 * (1 + dir), 520, 114);
            for (int ring = 2 - 2 * dir; ring != 2 + 3 * dir; ring += dir) {
                for (int subring = 0; subring < 2; subring++) {
                    g.setColor(new Color(pal[ring] | (subring - 1)));
                    g.setStroke(new BasicStroke(20 - 8 * subring));
                    g.drawOval(10 + 85 * ring, 10 + 64 * (ring & 1), 144, 144);
                }
            }
        }
        ImageIO.write(img, "PNG", new File("rings.png"));
    }
}

PNG rendu par le programme Java


16

Commodore 64 BASIC

Encore une fois, une réponse C64, mais cette fois, je suis autorisé à utiliser des sprites ! Yay!

Je me souviens que si vous vouliez utiliser des sprites, vous commenceriez votre programme avec beaucoup de DATAdéclarations ennuyeuses . Pour définir un motif de sprite monochromatique "haute résolution" (24x21 pixels), vous avez besoin de 63 octets. Il existe en fait un éditeur de sprites en ligne qui calcule les données pour vous, donc:

10 DATA 0,254,0,3,255,128,7,255,192,15,131,224,30,0,240,60,0,120,56,0,56,120,0
20 DATA 60,112,0,28,112,0,28,112,0,28,112,0,28,112,0,28,120,0,60,56,0,56,60,0
30 DATA 120,30,0,240,15,131,224,7,255,192,3,255,128,0,254,0

J'aurai également besoin de plus de DONNÉES pour les couleurs et les positions. Je viens de copier cela de ma réponse à la question originale du logo des Jeux Olympiques :

40 DATA 6,0,0,0,2,0,2,4,0,7,1,1,5,3,1 

Ensuite, vous auriez l'habitude de régler V=53248. Ce 53248doit être un chiffre important, car je m'en souviens encore 25 ans plus tard :) Il s'avère que c'est l'adresse de base du VIC-II (Video Interface Controller):

50 V=53248

Ensuite, j'ai lu le motif de sprite dans la mémoire en commençant à l'adresse 832. Cela semble bizarre d'écrire simplement dans un emplacement de mémoire, pas d'allocation, non new, rien de tel :) L'adresse de début doit être un multiple de 64.

60 FOR I=0 TO 62
70 READ D:POKE 832+I,D
80 NEXT I

Je vais utiliser le même modèle pour tous les sprites.

90 FOR I=0 TO 4
100 READ C,X,Y

Cest le code couleur, Xet Ysont des positions horizontales et verticales des cercles.

Quelques autres POKEsont nécessaires:

110 POKE V+I*2,150+X*11
120 POKE V+I*2+1,130+Y*10

V+0, V+2, V+4, Etc ... sont les emplacements horizontaux de chaque image - objet, tandis que V+1, V+3, V+5... sont verticales. Les couleurs des sprites commencent au registre V+39:

130 POKE V+39+I,C

Les pointeurs de données de sprite commencent à 2040, et puisque les données commencent à 832, nous obtenons 832/64= 13, donc:

140 POKE 2040+I,13
150 NEXT I

Pour activer les sprites, je mets des bits 0-4du registre V+21. J'ai également changé l'arrière-plan en blanc, afin que nous puissions voir le cercle bleu.

160 POKE 53281,1
170 POKE V+21,31

C'est ça!

Sprites olympiques


Génial! Je ne sais pas si je me souviens bien, mais vous pouvez peut-être doubler (dans le matériel) la taille x / y des sprites. Je suis sûr que vous pourriez le faire sur un C128.
Gabriele D'Antona

Oui, vous pouvez définir des bits de V+23double hauteur et V+29double largeur. (bit #x pour sprite #x).
Danko Durbić,

11

LaTeX / TikZ

Taille: 876 octets (12 lignes, ligne avec 72 caractères et fin de ligne)

\documentclass{standalone}\usepackage{tikz}\def\W{3.762bp}\def\R{71.682
bp}\def\D{12.9041bp}\usetikzlibrary{calc,hobby}\def\Y{-71.7013bp}\def\X
{169.5538bp}\begin{document}\tikz[use Hobby shortcut,every path/.style=
{line width=\W,double distance=\D, white}]{\def\Z{coordinate}\path(0,0)
\Z(A)++(\X,0)\Z(C)++(\X,0)\Z(E)($(A)!.5!(C)$)++(0,\Y)\Z(B)++(\X,0)\Z(D)
;\def~#1#2{\definecolor{#1}{cmyk}{#2}} ~A{1,.25,0,0}~B{0,.342,.91,0}~C{
0,0,0,1}~D{1,0,.91,.06}~E{0,.94,.65,0}\def~#1#2#3#4{\draw[save Hobby p%
ath={#1},double=#1,overlay](#1)+([closed] 225:\R)..+([#2]315:\R)..+([#3
]45:\R)..+([#4]135:\R); \path let\n!={\R+\D/2}in(#1)+(-\n!,0)+(\n!,0)+(
0,-\n!)+(0,\n!);}\def\0#1{\draw[double=#1,restore and use Hobby path={%
#1}{disjoint,invert soft blanks}];}~A{}{blank=soft}{}~B{}{}{blank=soft}
~C{}{blank=soft}{}\0B\0A~E{blank=soft}{}{}~D{}{}{}\0C\0E}\end{document}

entrez la description de l'image ici

Taille: 817 octets sur une ligne et avec deux optimisations:

  • Option tikzde classe standalone, voir commentaire de Wheat Wizard.
  • Les multiples utilisations de soft=blankpeuvent être raccourcies en définissant un style b.
\documentclass[tikz]{standalone}\def\W{3.762bp}\def\R{71.682bp}\def\D{12.9041bp}\usetikzlibrary{calc,hobby}\def\Y{-71.7013bp}\def\X{169.5538bp}\begin{document}\tikz[use Hobby shortcut,every path/.style={line width=\W,double distance=\D,white},b/.style={blank=soft}]{\def\Z{coordinate}\path(0,0)\Z(A)++(\X,0)\Z(C)++(\X,0)\Z(E)($(A)!.5!(C)$)++(0,\Y)\Z(B)++(\X,0)\Z(D);\def~#1#2{\definecolor{#1}{cmyk}{#2}} ~A{1,.25,0,0}~B{0,.342,.91,0}~C{0,0,0,1}~D{1,0,.91,.06}~E{0,.94,.65,0}\def~#1#2#3#4{\draw[save Hobby path={#1},double=#1,overlay](#1)+([closed]225:\R)..+([#2]315:\R)..+([#3]45:\R)..+([#4]135:\R); \path let\n!={\R+\D/2}in(#1)+(-\n!,0)+(\n!,0)+(0,-\n!)+(0,\n!);}\def\0#1{\draw[double=#1,restore and use Hobby path={#1}{disjoint,invert soft blanks}];}~A{}b{}~B{}{}b~C{}b{}\0B\0A~E b{}{}~D{}{}{}\0C\0E}\end{document}

LaTeX / TikZ (version lisible)

La version plus longue suivante est probablement plus facile à comprendre.

  • Le chevauchement des anneaux est géré en dessinant d'abord les anneaux avec des segments vierges. Ensuite, à un stade ultérieur, les anneaux sont à nouveau dessinés, mais cette fois les segments vides sont remplis et les autres segments déjà dessinés des anneaux restent intacts. Par conséquent, l'écrêtage n'est pas utilisé du tout.

  • L'anneau avec les marges blanches est dessiné par un cercle avec une double ligne. La zone entre les lignes est remplie de la couleur de l'anneau et les lignes doubles plus minces forment la marge blanche extérieure et intérieure.

  • Les couleurs et dimensions sont extraites de la description de la page PDF de la page 5 du document officiel (voir la réponse de Peter Tayler).

\nofiles % .aux file is not needed
\documentclass[tikz]{standalone}
\usetikzlibrary{calc}
\usetikzlibrary{hobby}

\newcommand*{\xshift}{169.5538bp}
\newcommand*{\yshift}{-71.7013bp}
\newcommand*{\radius}{71.6821bp}
\newcommand*{\whitelinewidth}{3.762bp}
\newcommand*{\colorlinewidth}{12.9041bp}

\definecolor{color@A}{cmyk}{1, .25, 0, 0}
\definecolor{color@B}{cmyk}{0, .342, .91, 0}
\definecolor{color@C}{cmyk}{0, 0, 0, 1}
\definecolor{color@D}{cmyk}{1, 0, .91, .06}
\definecolor{color@E}{cmyk}{0, .94, .65, 0}

\begin{document}
  \begin{tikzpicture}[
    use Hobby shortcut,
    every path/.style = {
      line width      = \whitelinewidth,
      double distance = \colorlinewidth,
      white,
    },
  ]
    % define center coordinates for the five rings
    \path
      (0,0) coordinate (center@A)
      ++(\xshift, 0) coordinate (center@C)
      ++(\xshift, 0) coordinate (center@E)
      ($(center@A)!.5!(center@C)$) ++(0, \yshift) coordinate (center@B)
      ++(\xshift, 0) coordinate (center@D)
    ;
    % \drawring draws the first part of the ring with blank parts
    \newcommand*{\drawring}[4]{%
      \draw[
        save Hobby path = {path@#1},
        double          = {color@#1},
        overlay,
      ]
        (center@#1)
        +([closed] 225:\radius) .. +([#2] 315:\radius) ..
        +([#3] 45:\radius) .. +([#4] 135:\radius)
      ;
    }
    % \finishring draws the blank parts of the rings
    \newcommand*{\finishring}[1]{%
      \draw[
        double                     = {color@#1},
        restore and use Hobby path = {path@#1}{
          disjoint, 
          invert soft blanks
        },
      ];
    }
    \drawring{A}{}{blank=soft}{}
    \drawring{B}{}{}{blank=soft}
    \drawring{C}{}{blank=soft}{}
    \finishring{B}
    \finishring{A}
    \drawring{E}{blank=soft}{}{}
    \drawring{D}{}{}{}
    \finishring{C}
    \finishring{E}
    % set calculated bounding box
    \useasboundingbox
      let \n{r} = {\radius + \colorlinewidth/2}
      in
        (center@A) +(-\n{r}, \n{r}) % upper left corner
        (center@B -| center@E) +(\n{r}, -\n{r}) % lower right corner
    ;
  \end{tikzpicture}
\end{document}

Pour économiser quelques octets, vous pouvez utiliser \documentclass[tikz]{standalone}grâce à cette astuce .
Wheat Wizard

@WheatWizard Merci, la réponse est mise à jour et encore raccourcie en définissant le style bpour éviter le long blank=softqui est utilisé quatre fois.
Heiko Oberdiek

10

C ++ 1024 octets

Mise à jour: maintenant avec l'anticrénelage. Le code a été quelque peu déréglé tout en restant dans (exactement) 1K.

N'utilise aucune fonction de bibliothèque à l'exception des fonctions ostream pour écrire le fichier de sortie.

#include <fstream>

namespace {
typedef double d;

int w=512;
d a=1./6,g=1./w,h=1./72,j=h+g,k=h-g,r=5./36;

struct p{d x,y;}ps[]={{5*a,a},{4*a,2*a},{3*a,a},{2*a,2*a},{a,a}};
struct c{unsigned char r,g,b;}cs[]={{237,51,78},{28,139,60},{0,0,0},{251,177,50},{8,133,194}};

d abs(d x) {return x<0?-x:x;}

d sqrt(d x) {
    d e=1e-6,y=1;
    for(;abs(y*y-x)>e;y=.5*(y+x/y));
    return y;
}

d dist(p c,p z) {
    d u=z.x-c.x,v=z.y-c.y; 
    return abs(r-sqrt(u*u+v*v));
}

c lerp(c a,c b,d t) {
    auto l=[=](d a,d b){return a+(b-a)*t;}; 
    return {l(a.r,b.r),l(a.g,b.g),l(a.b,b.b)};
}

d smoothstep(d z) {
    z=(z-j)/(k-j);
    z=z<0?0:z>1?1:z;
    return z*z*(3-2*z);
}

c color(p z) {
    c o{255,255,255};
    for(int i=0,j;i<5;++i){
        j=z.y<.25?i:4-i;
        o=lerp(o,cs[j],smoothstep(dist(ps[j],z)));
    }
    return o;
}
}

int main() {
    std::ofstream o("r.ppm",std::ofstream::binary);
    o<<"P6 "<<w<<" "<<w/2<<" 255\n";
    for(int y=0;y<w/2;++y)
        for(int x=0;x<w;++x)
            o.write((char*)&color(p{x*g,y*g}),3);;
}

Génère un fichier .ppm:

entrez la description de l'image ici


1
Ce n'est pas du golf de code : vous pouvez vous sentir libre de rendre votre code lisible, à condition qu'il tienne dans 1 Ko.
Peter Taylor

+1 pour ne pas même inclure <cmath>
épidémie du

10

R, 70 caractères

Utilisation des statistiques CRAN-R.

l=c(1,9);plot(3:7,c(6,4,6,4,6),col=c(4,7,1,3,2),cex=10,ylim=l,xlim=l)

Tracé R


9

GLSL

J'ai l'impression d'être un peu en retard à la fête, mais je peux peut-être me rattraper avec la première soumission GLSL sur ce site. Il est destiné à être utilisé comme ombrage de fragment pour une primitive de remplissage d'écran et attend la résolution de la fenêtre d'affichage dans leiResolution uniforme.

Les couleurs et les positions sont «empruntées» à la soumission de Peter Taylor . J'ai dû raccourcir certains noms de variables pour descendre en dessous de 1024 caractères, mais j'espère que c'est toujours lisible.

Voyez-le sur Shadertoy (si votre navigateur prend en charge WebGL).

uniform vec3 iResolution;

float circle(vec2 pos, float r) {
    return clamp(r - distance(gl_FragCoord.xy, pos), 0., 1.);
}

float ring(vec2 pos, float r, float d) {
    return circle(pos, r + d) * (1. - circle(pos, r - d));
}

void paint(vec3 color, float a) {
    gl_FragColor.rgb = mix(gl_FragColor.rgb, color, a);
}

void main() {
    struct r_t {
        vec2 pos;
        vec3 col;
    } rs[5];
    rs[0] = r_t(vec2( 82, 146), vec3(.04, .56, .85));
    rs[1] = r_t(vec2(167,  82), vec3(.98, .66, .12));
    rs[2] = r_t(vec2(252, 146), vec3(.14, .12, .13));
    rs[3] = r_t(vec2(337,  82), vec3(.00, .62, .35));
    rs[4] = r_t(vec2(422, 146), vec3(.93, .13, .29));

    float s = min(iResolution.x / 504., iResolution.y / 228.);
    vec2 b = (iResolution.xy - vec2(504, 228) * s) * .5;
    bool rev = gl_FragCoord.y > iResolution.y * .5;

    gl_FragColor.rgb = vec3(1);

    for (int i = 0; i < 5; ++i) {
        r_t r = rev ? rs[4 - i] : rs[i];
        paint(vec3(1), ring(r.pos * s + b, 72. * s, 11. * s));
        paint(r.col,   ring(r.pos * s + b, 72. * s,  6. * s));
    }
}

Rendu résultant


5

Mathematica

J'ai remplacé ma réponse d'origine par une réponse qui s'appuie sur les régions et leurs intersections. La taille du code est de 973 octets, non golfée.

Les régions 1-5 sont les anneaux. Les anneaux ont un rayon intérieur de 2,5 unités; le rayon extérieur est de 3 unités. Le rapport du rapport intérieur / extérieur et la logique générale de l'approche se trouvent ici .

i = Implicit Region;
R1 = i[6.25 <= (x + 6.4)^2 + y^2 <= 9 , {x, y}];
R2 = i[6.25 <= x^2 + y^2 <= 9 , {x, y}];
R3 = i[6.25 <= (x - 6.4)^2 + y^2 <= 9 , {x, y}];
R4 = i[6.25 <= (x + 3.2)^2 + (y + 3)^2 <= 9 , {x, y}];
R5 = i[6.25 <= (x - 3.2)^2 + (y + 3)^2 <= 9 , {x, y}];

Pourquoi nous ne pouvons pas simplement imprimer les 5 anneaux sans prendre en compte les couches.

Si nous traçons ces anneaux immédiatement, ils ne se verrouillent pas. Notez que l'anneau jaune se trouve au sommet des anneaux bleu et noir; l'anneau vert se trouve au sommet des anneaux noir et rouge.

Show[{RegionPlot[R1, PlotStyle -> Blue, BoundaryStyle -> Blue],
  RegionPlot[R2, PlotStyle -> Black, BoundaryStyle -> Black],
  RegionPlot[R3, PlotStyle -> Red, BoundaryStyle -> Red],
  RegionPlot[R4, PlotStyle -> Yellow, BoundaryStyle -> Yellow],
  RegionPlot[R5, PlotStyle -> Green, BoundaryStyle -> Green]
  }, PlotRange -> All, PerformanceGoal -> "Quality", 
 ImageSize -> Large, AspectRatio -> 1/2,
 Frame -> False]

un haut


Couleurs inversées à 4 intersections d'anneaux.

Les régions 6, 8, 10 et 12 sont des rectangles qui servent à spécifier sur quelle intersection de deux anneaux se concentrer.

Les régions 7, 9, 11 et 13 sont les «chevauchements d'anneaux» où l'anneau en bas doit être en haut.

R6 = Rectangle[{-5, -1}, {-2, 1}];
R7 = RegionIntersection[R1, R4, R6];    
R8 = Rectangle[{2, -1}, {4, 1}];
R9 = RegionIntersection[R2, R5, R8]; 
R10 = Rectangle[{-2, -3}, {2, -2}];
R11 = RegionIntersection[R2, R4, R10];  
R12 = Rectangle[{5, -3}, {7, -2}];
R13 = RegionIntersection[R3, R5, R12];

Show[{RegionPlot[R1, PlotStyle -> Blue, BoundaryStyle -> Blue],
  RegionPlot[R2, PlotStyle -> Black, BoundaryStyle -> Black],
  RegionPlot[R3, PlotStyle -> Red, BoundaryStyle -> Red],
  RegionPlot[R4, PlotStyle -> Yellow, BoundaryStyle -> Yellow],
  RegionPlot[R5, PlotStyle -> Green, BoundaryStyle -> Green],
  RegionPlot[R7, PlotStyle -> Blue, BoundaryStyle -> Blue],
  RegionPlot[R9, PlotStyle -> Black, BoundaryStyle -> Black],
  RegionPlot[R11, PlotStyle -> Black, BoundaryStyle -> Black],
  RegionPlot[R13, PlotStyle -> Red, BoundaryStyle -> Red]}, 
PlotRange -> All, PerformanceGoal -> "Quality", 
 ImageSize -> Large, AspectRatio -> 1/2,
 Frame -> False]

anneaux


Quelles intersections ont eu leurs couleurs inversées?

Ce qui suit met en évidence les régions d'intersection où les couleurs ont été "inversées". Cela a été accompli en changeant les BoundaryStylerégions 7, 9, 11 et 13 en White.

points forts


4
Ne pouvez-vous pas faire quelque chose d'esthétique mieux en 1k? ces intersections sont moches!
Gabriele D'Antona

1
@friol, j'ai amélioré les intersections en utilisant des régions.
DavidC

1
Cela a pris un an et demi, mais vous avez enfin trouvé comment faire de jolies intersections: D
Beta Decay

Hier, j'ai vu des anneaux olympiques et j'ai réalisé que je pouvais utiliser des régions pour résoudre le problème des intersections. Les précédents étaient trop laids pour partir tels quels.
DavidC

3

Javascript (three.js) - 910 octets

Étant donné un élément html, cette fonction créera les anneaux en tant qu'objets 3D, puis rendra une image fixe à l'élément. Fonctionne dans les navigateurs qui prennent en charge WebGL. VIOLON

function Logo(l){
    var s, c, r;
    s = new THREE.Scene();
    c = new THREE.PerspectiveCamera(45, 4/3, 1, 500);
    c.position.set(75,0,300);
    c.lookAt(new THREE.Vector3(0,0,0));
    var rings = [
        new THREE.Mesh(ring(), mat(0x0885c2)),
        new THREE.Mesh(ring(), mat(0xfbb132)),
        new THREE.Mesh(ring(), mat(0x000000)),
        new THREE.Mesh(ring(), mat(0x1c8b3c)),
        new THREE.Mesh(ring(), mat(0xed334e))
    ];
    for(var i = 0; i < rings.length; i++){
        s.add(rings[i]);
        rings[i].position.set(i*55-125,-(i%2)*50,0);
        rings[i].rotation.set(0,(i%2*2-1)*.18,0,'xyz');
    }
    r = new THREE.WebGLRenderer();
    r.setSize(400, 300);
    l.appendChild(r.domElement);
    r.render(s, c);
}
function ring(){ return new THREE.TorusGeometry(50, 8, 16, 32); }
function mat(color){ return new THREE.MeshBasicMaterial({color: color}); }

2

chat (10 octets)

Il était si court que le site Web a refusé de le télécharger jusqu'à ce que j'ajoute cette description. Le logo représente les Jeux Olympiques.

$ $ $
 $ $

Fondamentalement, un ajustement de la réponse
Peter Taylor

2

C ++ avec SFML (1003 y compris les espaces blancs)

Pas petit par n'importe quel effort d'imagination, mais gardé aussi concis et pourtant lisible que possible et toujours inférieur à 1k.

#include <SFML/Graphics.hpp>

using namespace sf;

int main() {
    CircleShape circles[5];
    Color backcolor(255,255,255);
    Color colors[5] = {
        Color(0x0b,0x8e,0xd8),
        Color(0xf9,0xa9,0x1f),
        Color(0x23,0x1f,0x20),
        Color(0x00,0x9e,0x59),
        Color(0xee,0x20,0x49),
    };

    for (int i = 0; i < 5; i++) {
        circles[i] = CircleShape(144, 60);
        circles[i].setPosition(15+160*i, 46+160*(i&1));
        circles[i].setFillColor(Color::Transparent);
        circles[i].setOutlineColor(colors[i]);
        circles[i].setOutlineThickness(-16);
    }

    RenderWindow window(VideoMode(960, 540), L"Olympic Logo", Style::Close);

    while (window.isOpen()) {
        Event event;

        while (window.pollEvent(event))
            if (event.type == Event::Closed)
                window.close();

        window.clear(backcolor);

        for (int i = 0; i < 5; i++)
            window.draw(circles[i]);

        window.display();
    }

    return 0;
}

Edit: couleurs mises à jour basées sur la soumission SVG de @Peter Taylor.


1

Delphes

  Canvas.Pen.Width := 10;
  Canvas.Brush.Style:=bsClear;//To prevent solid background
  Canvas.Pen.Color:=clBlue; Canvas.Ellipse(20,30,220,230);
  Canvas.Pen.Color:=clBlack; Canvas.Ellipse(240,30,440,230);
  Canvas.Pen.Color:=clRed; Canvas.Ellipse(460,30,660,230);
  Canvas.Pen.Color:=clYellow; Canvas.Ellipse(130,130,330,330);
  Canvas.Pen.Color:=clGreen; Canvas.Ellipse(350,130,550,330);

Résultat

entrez la description de l'image ici


0

fait une solution basée sur une édition Java Swing GUI UltraGolfed (696 charas)

import java.awt.Color;import java.awt.Graphics;import javax.swing.JFrame;import javax.swing.JPanel;class A extends JFrame{public A(){JPanel j=new JPanel(){protected void paintComponent(Graphics g){;((java.awt.Graphics2D)g).setStroke(new java.awt.BasicStroke(3));g.setColor(new Color(0xb,0x8e,0xd8));g.drawOval(10, 10, 80, 80);g.setColor(new Color(0xf9,0xa9,0x1f));g.drawOval(50,40,80,80);g.setColor(new Color(0x23,0x1f,0x20));g.drawOval(90, 10, 80, 80);g.setColor(new Color(0,0x9e,0x59));g.drawOval(130,40,80,80);g.setColor(new Color(0xee,0x20,0x49));g.drawOval(170, 10, 80, 80);}};j.setBounds(0,0,600,400);setSize(600,400);add(j);}public static void main(String[]a){new A().setVisible(true);}}

Un semi-compressé: (971)

import java.awt.Color;
import java.awt.Graphics;
import javax.swing.JFrame;
import javax.swing.JPanel;
class A extends JFrame
{
    public A()
    {
        JPanel j = new JPanel(){
        protected void paintComponent(Graphics g)
        {;
            ((java.awt.Graphics2D)g).setStroke(new  java.awt.BasicStroke(3));
            g.setColor(new Color(0xb,0x8e,0xd8));
            g.drawOval(10, 10, 80, 80);
            g.setColor(new Color(0xf9,0xa9,0x1f));
            g.drawOval(50,40,80,80);
            g.setColor(new Color(0x23,0x1f,0x20));
            g.drawOval(90, 10, 80, 80);
            g.setColor(new Color(0,0x9e,0x59));
            g.drawOval(130,40,80,80);
            g.setColor(new Color(0xee,0x20,0x49));
            g.drawOval(170, 10, 80, 80);}};
        j.setBounds(0,0,600,400);
        setSize(600,400);
        add(j);
    }
    public static void main(String[]a)
    {
        new A().setVisible(true);
    }
}

Pourriez-vous ajouter une capture d'écran?
Paŭlo Ebermann

0

POWERSHELL,
code 869 et sortie en capture d'écran Logo olympique PowerShell


0

SpecBAS

Chaque anneau est composé d'un cercle intérieur / extérieur, puis rempli d'inondations.

J'ai dû trouver les intersections manuellement et les remplir individuellement (de sorte que vous pouvez toujours voir certaines des lignes entre elles).

1 INK 0: PAPER 15: CLS: LET r=50
2 FOR x=1 TO 3
3 CIRCLE x*100,100,r: CIRCLE x*100,100,r-10
4 IF x<3 THEN CIRCLE (x*100)+50,150,r: CIRCLE (x*100)+50,150,r-10
5 NEXT x
6 INK 0: FILL 165,130: FILL 195,145: FILL 200,55: FILL 215,145: FILL 245,105
7 INK 9: FILL 100,55: FILL 130,130: FILL 145,105
8 INK 10: FILL 270,135: FILL 295,145: FILL 300,55
9 INK 12: FILL 205,145: FILL 215,120: FILL 250,195: FILL 255,105: FILL 280,120
10 INK 14: FILL 105,145: FILL 110,125: FILL 150,195: FILL 155,105: FILL 190,130

entrez la description de l'image ici

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.