Logo Pertandingan Olimpiade - Edisi Gaya Bebas [ditutup]


30

Dengan semangat yang sama dengan pertanyaan ini , misi Anda adalah membuat logo yang paling cantik di paling banyak 1K kode.

Aturan:

  1. Paling banyak 1K kode (inklusif), tidak ada data eksternal.

  2. Jawaban dengan kemenangan terbanyak menang.

Selamat bersenang-senang!


6
Yah, dia menyatakan secara langsung "dengan semangat yang sama seperti pertanyaan ini ", jadi dia praktis berkata "hei, saya tahu ini adalah duplikat": D
Mike Koch

5
Kriteria kemenangan berbeda. Jadi itu adalah pertanyaan serupa, tetapi bukan duplikat.
Victor Stafusa

3
Saya sebenarnya senang ada orang lain yang membuat versi kontes-popularitas pertanyaan saya dengan kriteria lebih sedikit, karena saya bingung ke mana harus pergi ketika saya menulisnya.
Adam Maras

@AdamMaras Senang mendengarnya :)
chubakueno

Saya memulai diskusi dibuka kembali di Meta , karena pertanyaan ini seharusnya tidak tertutup.
Adam Maras

Jawaban:


44

SVG

1kB? Kemewahan. Saya bahkan dapat mencetak hasil cetakan dengan cantik daripada menghapus semua spasi yang tidak perlu. (Lekukan itu, tentu saja, menggunakan tab, yang dikonversi oleh Markdown menjadi spasi, jadi itu sebabnya jumlah char mungkin tampak lebih tinggi dari 977 yang sebenarnya. Menghapus spasi yang tidak perlu akan menurunkannya ke 861).

Tumpang tindih ditangani dengan benar dengan menggambar cincin di satu arah, kemudian menerapkan klip dan menggambar di arah lain. Warna dan rasio diekstraksi dari dokumen resmi yang karena alasan tertentu menggunakan kurva Bézier daripada lingkaran.

<?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>

PNG membuat file SVG


16
PS Jika ada yang ingin berpendapat bahwa SVG bukan bahasa pemrograman (dan saya akan sangat setuju untuk setuju), anggap ini program PHP dengan gaya banyak pengiriman PHP ke situs ini yang hanya menggemakan teks literal.
Peter Taylor

OMG terlihat luar biasa. SVG adalah orang baik

39

Javascript (inti) - 1000 pada titik. - WebKit (Chrome)

Bermain dengan kanvas.

Tidak yakin apakah ini 1024 atau 1000 Kuntuk, tetapi berhasil menurunkannya ke 1000 982 940: D

Hanya cocok untuk browser WebKit. Chrome OK. Firefox berantakan. Mungkin bisa membuatnya lintas browser.


Kode:

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: Menjatuhkan pembungkusnya onloaddan mengandalkan skrip yang dimasukkan di akhir bodytag + alignment bug dan perbaikan 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)

Biola:

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

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

Banyak di Firefox serta Chrome, tetapi agak berat pada sumber daya di FF. Menggunakan requestAnimationFrame()sedikit membantu, tetapi tidak cukup.

Perhatikan bahwa salju terletak di bagian bawah, sehingga gulir ke bawah untuk melihat pertumbuhan yang lambat. Awalnya ada beberapa overpainting di tanah, tetapi tidak bisa membuatnya masuk ke 1024 chr.

Hasil (screencast GIF'ed kualitas rendah):

masukkan deskripsi gambar di sini


2
Bagus! Ini juga berfungsi di IE11.
Danko Durbić

Bekerja dengan sangat baik di Firefox 27.0.1.
Nathan Osman

32

Mathematica

Dari jawaban saya di bagian Tanya Jawab Mathematica.SE :

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, ∞}
]

masukkan deskripsi gambar di sini

Sunting: Di versi 10 gaya pencahayaan default berubah; untuk membuat grafik di atas, Anda harus menambahkan Opsi Lighting -> "Classic"ke Graphics3D.

Bermain lebih jauh dengan pencahayaan untuk menghasilkan efek dua dimensi yang datar:

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
]

masukkan deskripsi gambar di sini


Untuk Oliver yang mengatakan hasil pertama saya adalah "terlalu 3D-ish" di sini adalah rendering 2D yang sebenarnya melalui kode jVincent dengan refactoring saya, juga dari utas terkait:

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}}
 ]

masukkan deskripsi gambar di sini


@Liver Diperbarui hanya untuk Anda.
Mr.Wizard

Wow! Bisakah Anda memberi tahu saya di mana Anda dapat mengunduh Mathmatica?
Oliver Ni

@Oliver Ini adalah produk komersial, dan agak mahal bahkan untuk penggunaan individu, nonkomersial, tetapi jika Anda masih tertarik, Anda bisa mendapatkan versi percobaan 15 hari dari: wolfram.com/mathematica/trial
Mr.Wizard

1
@Oliver, Anda sekarang dapat memperoleh versi gratis Mathematica jika Anda memiliki raspberry pi
trichoplax

@trichoplax Sekarang Terbuka Cloud memungkinkan satu program sederhana menjalankan bebas di antarmuka browser: develop.open.wolframcloud.com/app/view/newNotebook
Mr.Wizard

28

Ruby, 321

Sedihnya, kepala negara tertentu tampaknya menjadi subjek utama dari sebagian besar berita Olimpiade sejauh ini. Jadi, inilah logo freestyle saya (maskot?) Untuk Olimpiade 2014.

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

Output: (Cadangkan dan juling. Maaf untuk rendering primitif tapi dia tidak layak.)

Putin


6
$$$, sedih tapi benar: 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:

Output sampel:

logo permainan Olimpiade


23

FreePascal

Olimpiade Musim Dingin? Bagaimana dengan beberapa kepingan salju fraktal daripada cincin biasa.

Rekursi untuk cabang tengah cukup jelas: (dx, dy) = 0,5 (dx, dy). Cabang kiri dan kanan didasarkan pada rotasi dengan perkalian matriks:

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

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

1/4 = 0,5 cos (60) dan 7/16 adalah perkiraan yang baik dari 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.

. .

gambar


Bagus. Jika Anda dapat menambahkan jumlah acak ke dalam algoritma, Anda dapat menggunakannya kembali di Mari mensimulasikan kepingan salju acak .
manatwork

16

Jawa

Mirip dengan jawaban SVG saya, tetapi

  • Gunakan dua klip, untuk menghindari sedikit perbedaan karena menggambar dua kali dengan anti-alias.
  • Karena Java memiliki loop yang sebenarnya, strukturnya sedikit lebih bagus.

Perhatikan bahwa saya belum mencoba untuk bermain golf, meskipun ada kemungkinan beberapa trik menarik (seperti -57*~dirbukannya 57*(1+dir). Ada di 923 karakter, tetapi golf turun ke 624 dengan mudah.

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 diberikan oleh program Java


16

Commodore 64 BASIC

Sekali lagi, jawaban C64, tapi kali ini saya diizinkan menggunakan sprite ! Yay!

Saya ingat jika Anda ingin menggunakan sprite, Anda akan memulai program Anda dengan banyak DATApernyataan yang membosankan . Untuk menentukan pola sprite monokromatik "resolusi tinggi" (24x21 piksel), Anda memerlukan 63 byte. Sebenarnya ada editor sprite online yang menghitung DATA untuk Anda, jadi:

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

Saya juga membutuhkan DATA lagi untuk warna dan posisi. Saya hanya menyalinnya dari jawaban saya terhadap pertanyaan Logo Olimpiade asli :

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

Kemudian, Anda biasanya mengatur V=53248. Ini 53248pasti nomor penting, karena saya masih mengingatnya 25 tahun kemudian :) Ternyata itu adalah alamat dasar VIC-II (Pengendali Antarmuka Video):

50 V=53248

Lalu saya membaca pola sprite ke dalam memori mulai dari alamat 832. Rasanya aneh hanya menulis ke lokasi memori, tidak mengalokasikan, tidak new, tidak seperti itu :) Alamat awal harus kelipatan 64.

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

Saya akan menggunakan pola yang sama untuk semua sprite.

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

Cadalah kode warna, XdanY posisi horizontal dan vertikal dari lingkaran.

Diperlukan beberapa lagi POKE:

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

V+0, V+2, V+4, Dll ... adalah lokasi horisontal masing-masing sprite, sementara V+1, V+3, V+5... vertikal. Warna sprite mulai dari register V+39:

130 POKE V+39+I,C

Pointer data sprite dimulai pada 2040, dan sejak data dimulai 832, kita mendapatkan 832/64= 13, jadi:

140 POKE 2040+I,13
150 NEXT I

Untuk menghidupkan sprite, saya mengatur bit 0-4register V+21. Saya juga mengubah latar belakang menjadi putih, sehingga kita bisa melihat lingkaran biru.

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

Itu dia!

Sprite Olimpiade


Besar! Tidak tahu apakah saya ingat dengan benar, tetapi mungkin Anda dapat menggandakan (dalam perangkat keras) ukuran x / y dari sprite. Saya yakin Anda bisa melakukan ini pada C128.
Gabriele D'Antona

Yup, Anda dapat mengatur bit V+23untuk tinggi ganda, dan V+29untuk lebar ganda. (bit #x untuk sprite #x).
Danko Durbić

11

LaTeX / TikZ

Ukuran: 876 byte (12 baris, baris dengan 72 karakter dan ujung baris)

\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}

masukkan deskripsi gambar di sini

Ukuran: 817 byte dalam satu baris dan dengan dua optimasi:

  • Opsi tikzkelas standalone, lihat komentar Wheat Wizard.
  • Penggunaan ganda soft=blankdapat disingkat dengan mendefinisikan gaya 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 (versi dapat dibaca)

Versi yang lebih panjang berikut ini mungkin lebih mudah dimengerti.

  • Tumpang tindih cincin ditangani dengan menggambar cincin dengan segmen kosong terlebih dahulu. Kemudian pada tahap selanjutnya, cincin-cincin itu digambar lagi, tetapi kali ini bagian-bagian yang kosong terisi dan bagian-bagian cincin yang sudah ditarik lainnya tetap tidak tersentuh. Karena itu kliping tidak digunakan sama sekali.

  • Cincin dengan margin putih digambar lingkaran dengan garis ganda. Daerah antara garis diisi dengan warna cincin dan garis ganda tipis membentuk margin putih luar dan dalam.

  • Warna dan dimensi diambil dari deskripsi halaman PDF dari halaman 5 dokumen resmi (lihat jawaban 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}

Untuk menyimpan beberapa byte, Anda dapat menggunakan \documentclass[tikz]{standalone}berkat tip ini .
Wheat Wizard

@WheatWizard Terima kasih, jawaban diperbarui dan lebih pendek dengan mendefinisikan gaya buntuk menghindari panjang blank=softyang digunakan empat kali.
Heiko Oberdiek

10

C ++ 1024 byte

Diperbarui: Sekarang dengan antialiasing. Kode telah agak dihapus dari golf sementara masih pas dengan (tepatnya) 1K.

Tidak menggunakan fungsi pustaka apa pun kecuali fungsi ostream untuk menulis file output.

#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);;
}

Menghasilkan file .ppm:

masukkan deskripsi gambar di sini


1
Ini bukan kode-golf : Anda bisa merasa bebas membuat kode Anda dapat dibaca, asalkan sesuai dengan 1kB.
Peter Taylor

+1 bahkan untuk belum termasuk <cmath>
epidemi

10

R, 70 karakter

Menggunakan statistik 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)

R plot


9

GLSL

Saya merasa agak terlambat ke pesta, tapi mungkin saya bisa menebusnya dengan pengiriman GLSL pertama di situs ini. Ini dimaksudkan untuk digunakan sebagai shader fragmen untuk primitif pengisian layar, dan mengharapkan resolusi viewport diiResolution seragam.

Warna dan posisi "dipinjam" dari pengajuan Peter Taylor . Saya harus mempersingkat beberapa nama variabel untuk mendapatkan di bawah 1024 karakter, tetapi saya harap itu masih dapat dibaca.

Lihat di Shadertoy (jika browser Anda mendukung 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));
    }
}

Resulting rendering


5

Mathematica

Saya telah mengganti jawaban asli saya dengan yang menarik pada daerah dan persimpangan mereka. Ukuran kode adalah 973 byte, tidak ditandai.

Wilayah 1-5 adalah cincinnya. Cincin memiliki jari-jari dalam 2,5 unit; radius luar adalah 3 unit. Rasio rasio dalam ke luar, dan logika umum dari pendekatan dapat ditemukan di sini .

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}];

Mengapa kita tidak bisa begitu saja mencetak 5 cincin tanpa memperhitungkan lapisan.

Jika kita memplot cincin ini secara langsung, mereka tidak saling terkait. Perhatikan bahwa cincin kuning terletak di atas cincin biru dan hitam; cincin hijau terletak di atas cincin hitam dan merah.

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]

atop


Membalik warna di 4 persimpangan cincin.

Wilayah 6, 8, 10 dan 12 adalah persegi panjang yang berfungsi untuk menentukan persimpangan dua cincin mana yang menjadi fokus.

Wilayah 7, 9, 11, dan 13 adalah "ring overlaps" di mana cincin di bagian bawah harus di atas.

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]

rings


Persimpangan mana yang warnanya terbalik?

Berikut ini menyoroti wilayah persimpangan di mana warna "terbalik". Ini dicapai dengan mengubah BoundaryStyledaerah 7, 9, 11, dan 13 menjadi White.

highlights


4
Tidak bisakah Anda melakukan sesuatu yang estetis lebih baik dalam 1k? persimpangan itu jelek!
Gabriele D'Antona

1
@Friol, saya meningkatkan persimpangan dengan menggunakan daerah.
DavidC

1
Butuh satu setengah tahun, tetapi Anda akhirnya menemukan cara membuat persimpangan yang cantik: D
Beta Decay

Kemarin saya melihat beberapa cincin Olimpiade dan menyadari bahwa saya bisa menggunakan daerah untuk menyelesaikan masalah persimpangan. Yang sebelumnya terlalu jelek untuk pergi seperti mereka.
DavidC

3

Javascript (three.js) - 910 byte

Diberikan elemen html, fungsi ini akan membuat cincin sebagai objek 3D dan kemudian membuat gambar diam ke elemen. Bekerja di browser yang mendukung WebGL. BIOLA

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

C ++ w / SFML (1003 termasuk spasi putih)

Tidak kecil oleh imajinasi, tetapi tetap sese-belum-terbaca mungkin dan masih di bawah 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;
}

Sunting: Warna yang diperbarui berdasarkan pada pengajuan SVG @Peter Taylor.


1

Delphi

  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);

Hasil

enter image description here


0

membuat solusi berdasarkan Java Swing GUI UltraGolfed edition (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);}}

Semi-terkompresi: (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);
    }
}

Bisakah Anda menambahkan tangkapan layar?
Paŭlo Ebermann


0

SpecBAS

Setiap cincin terdiri dari lingkaran dalam / luar, kemudian diisi banjir.

Harus menemukan persimpangan secara manual dan mengisinya secara individual (sehingga Anda masih dapat melihat beberapa garis di antara mereka).

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

enter image description here

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.