Завдання проста: намалюйте веселку в якомога менше байтах

Характеристики для веселки наступні:

• Цифра повинна бути рівно 400 пікселів у ширину та 200 пікселів у висоту (необов'язково 401x201, якщо ви хочете отримати один центральний піксель)
• Червоне кільце повинно торкатися всіх меж фігури (зовнішній радіус = 200 пікселів)
• Усі кільця мають однакову ширину (10 пікселів)
  • Фіолетове кільце має внутрішній радіус 130 пікселів
• Лук повинен бути верхньою половиною ідеального кола
• Фон повинен бути білим (також приймається прозорий)
• На рисунку не повинно бути меж (виняток робиться, якщо кордон не можна придушити)
• Вбудовані функції виготовлення веселки не дозволяються!

У веселці використовуються такі кольори:

Це кодовий гольф, тому найкоротший код у байтах виграє!

Приклад:

Пов’язані, але різні!

MATL , 107 95 92 87 84 83 байт

-200:200 0:200!PYyq10/k12-t8<*t0>*Q7B.561FTh.295Oh.51h4BPFTF6Bl.5hOh4B8$v255*k5M/YG

Це працює в поточному випуску (14.0.0) мови / компілятора.

EDIT (6 липня 2017 р.) : Ви можете спробувати це в MATL Online! .

Щоб перевірити правильність кольорів, видаліть останні п’ять символів (потрібно почекати кілька секунд і прокрутити вниз до кінця виводу).

Пояснення

Код має три основні етапи:

Крок 1 : Створіть матрицю 201x401 з числами від 1до 8. Пікселі зі значенням1 - фон (білий), пікселі зі значеннями 2, ..., 8представляють кожну смугу веселки.

Горизонтальні координати варіюються від -200до200 зліва направо, а вертикальні координати в межах від 0до 200дна до вершини. Отже, початок (0,0) - нижній центр, лівий верхній кут (-200,200) тощо.

Різні смуги веселки генеруються обчисленням відстані від кожного пікселя до початку та квантуванням з кроком у 10 пікселів.

Крок 2 : Створіть 8x3 матрицю, що визначає кольорову карту. Кожен ряд є одним з необхідних кольорів (білий і сім кольорів веселки). Кожне значення попередньої матриці 201x401 буде інтерпретуватися як індекс до рядка цієї кольорової карти.

Ми генеруємо матрицю кольорової карти, використовуючи значення від 0 до 1 для кожного компонента кольору, а потім множимо на 255 і округлюємо вниз. Таким чином, більшість значень спочатку становлять 0 і 1, які згодом стануть 0 і 255. Проміжні значення кодуються як значення між 0 і 1 з 2 або 3 десятичними знаками, вибрані так, що при множенні та округленні дають точне бажане значення.

Крок 3 : Показуйте зображення за допомогою цієї кольорової карти.

               % STEP 1: CREATE MATRIX DEFINING THE RAINBOW BANDS
-200:200       % row vector [-200, -199, ..., 200]
0:200          % row vector [0, 1, ..., 200]
!P             % transpose and flip: convert into column vector [200; 199; ...; 0]
Yy             % hypotenuse function with broadcast: distance from each point to (0,0)
q10/k          % subtract 1, divide by 10, floor (round down). Gives 20 circular bands
               % 10 pixels wide, with values from 0 to 19
12-            % subtract 12
t8<*           % values larger than 7 are set to 0
t0>*           % values less than 0 are set to 0. We now have 7 bands with values
               % 1, ..., 7, and the white background with value 0
Q              % add 1: white becomes 1, bands become 2, ..., 8

               % STEP 2: CREATE MATRIX DEFINING THE COLORMAP
7B             % first row: [1 1 1] (7 converted to binary: color white)
.561FTh        % second row (light purple)
.295Oh.51h     % third row (dark purple)
4BP            % fourth row: [0 0 1] (4 converted to binary and flipped: blue)
FTF            % fifth row (green)
6B             % sixth row: [1 1 0] (6 converted to binary: yellow)
l.5hOh         % seventh row: orange
4B             % eigth row: [1 0 0] (4 converted to binary: red)
8$v            % vertically concatenate the 8 eight rows
255*k          % multiply by 255 and round down. Gives exact color values 
5M/            % push 255 again and divide. This is needed because colors in MATL are
               % defined between 0 and 1, not between 0 and 255

               % STEP 3: DISPLAY
YG             % display image with that colormap

Піт , 838 коделів, кілька тисяч пікселів

Хтось повинен був це зробити:

Якщо ви збережете це зображення, ви можете спробувати його в Інтернеті !

Фактична програма Piet - це лише топ-125 пікселів, які я створив за допомогою програми Python, яку я написав.

Редагування цього згодом дійсно зашкодило моєму зору, я буду судитись цілими днями!

Це виводить зображення у форматі SVG, тому що SVG насправді є (на мою думку) найпростішим способом це зробити. Я безсоромно викрав SVG-код Doorknob. Виходи:

ну, це справді:

<svg viewBox='0 0 400 200'><circle cx='200' cy='200' r='200' fill='red'/><circle cx='200' cy='200' r='190' fill='#ff7f00'/><circle cx='200' cy='200' r='180' fill='yellow'/><circle cx='200' cy='200' r='170' fill='lime'/><circle cx='200' cy='200' r='160' fill='blue'/><circle cx='200' cy='200' r='150' fill='indigo'/><circle cx='200' cy='200' r='140' fill='#8f00ff'/><circle cx='200' cy='200' r='130' fill='white'/></svg>

Удачі, обійшовши цю відповідь, не користувачі Esolang!

Pyth, 150 149 128 байт

"<svg viewBox=0,0,400,200>"V8s["<circle cx=200 cy=200 r="-200*TN" fill="@c"red #ff7f00 #ff0 #0f0 #00f indigo #8f00ff #fff"dN" />

Виходи у SVG:

<svg viewBox=0,0,400,200>
<circle cx=200 cy=200 r=200 fill=red />
<circle cx=200 cy=200 r=190 fill=#ff7f00 />
<circle cx=200 cy=200 r=180 fill=#ff0 />
<circle cx=200 cy=200 r=170 fill=#0f0 />
<circle cx=200 cy=200 r=160 fill=#00f />
<circle cx=200 cy=200 r=150 fill=indigo />
<circle cx=200 cy=200 r=140 fill=#8f00ff />
<circle cx=200 cy=200 r=130 fill=#fff />

Дякуємо @MamaFunRoll за 16 байт та @PatrickRoberts ще 6!

Minecraft 1,10 (майже), 2677 символів з однією командою, 868 біліт

Ну я впевнено вибрав багатослівну мову.

summon FallingSand ~ ~1 ~ {Block:log,Time:1,Passengers:[{id:FallingSand,Block:redstone_block,Time:1,Passengers:[{id:FallingSand,Block:activator_rail,Time:1,Passengers:[{id:MinecartCommandBlock,Command:"summon ArmorStand ~ ~ ~ {Tags:[\"b\"]}"},{id:MinecartCommandBlock,Command:"summon Pig ~ ~ ~ {NoAI:1b}"},{id:MinecartCommandBlock,Command:setblock ~-1 ~-2 ~6 chain_command_block 3 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=200] ~ ~ ~ tp @e[c=1] ~ -99 ~"}},{id:MinecartCommandBlock,Command:setblock ~-1 ~-2 ~5 chain_command_block 3 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=190,r=200] ~ ~ ~ setblock ~ ~ ~ wool 14"}},{id:MinecartCommandBlock,Command:setblock ~-1 ~-2 ~4 chain_command_block 3 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=180,r=190] ~ ~ ~ setblock ~ ~ ~ wool 1"}},{id:MinecartCommandBlock,Command:setblock ~ ~-2 ~4 chain_command_block 4 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=170,r=180] ~ ~ ~ setblock ~ ~ ~ wool 4"}},{id:MinecartCommandBlock,Command:setblock ~ ~-2 ~5 chain_command_block 2 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=160,r=170] ~ ~ ~ setblock ~ ~ ~ wool 13"}},{id:MinecartCommandBlock,Command:setblock ~ ~-2 ~6 chain_command_block 2 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=150,r=160] ~ ~ ~ setblock ~ ~ ~ wool 11"}},{id:MinecartCommandBlock,Command:setblock ~ ~-2 ~7 chain_command_block 2 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=140,r=150] ~ ~ ~ setblock ~ ~ ~ wool 10"}},{id:MinecartCommandBlock,Command:setblock ~ ~-2 ~8 chain_command_block 2 replace {auto:1,Command:"execute @e[tag=b] ~ ~ ~ execute @e[rm=130,r=140] ~ ~ ~ setblock ~ ~ ~ wool 2"}},{id:MinecartCommandBlock,Command:setblock ~1 ~-2 ~8 chain_command_block 4 replace {auto:1,Command:"tp @e[type=Cow] ~1 ~ ~"}},{id:MinecartCommandBlock,Command:setblock ~1 ~-2 ~7 chain_command_block 3 replace {auto:1,Command:"tp @e[type=Bat] ~-1 ~ ~"}},{id:MinecartCommandBlock,Command:setblock ~1 ~-2 ~6 chain_command_block 3 replace {auto:1,Command:"execute @e[type=Pig] ~ ~ ~ summon Bat ~ ~ ~ {NoAI:1b}"}},{id:MinecartCommandBlock,Command:setblock ~1 ~-2 ~5 chain_command_block 3 replace {auto:1,Command:"execute @e[type=Pig] ~ ~ ~ summon Cow ~ ~ ~ {NoAI:1b}"}},{id:MinecartCommandBlock,Command:setblock ~1 ~-2 ~4 repeating_command_block 3 replace {auto:1,Command:"tp @e[type=Pig] ~ ~1 ~"}},{id:MinecartCommandBlock,Command:setblock ~ ~ ~1 command_block 0 replace {Command:fill ~ ~-3 ~-1 ~ ~ ~ air}},{id:MinecartCommandBlock,Command:setblock ~ ~-1 ~1 redstone_block},{id:MinecartCommandBlock,Command:kill @e[type=MinecartCommandBlock,r=1]}]}]}]}

Створіть новий світ Superflat, вставте цей безлад у блок команд Impulse, встановіть відстань візуалізації досить високою та запустіть його. Зламайте стійку броні, коли комп'ютер перестане відставати.

Результат - 400 блоків поперек і 200 блоків заввишки, як вимагається.

Я використав один генератор команд MrGarretto, щоб запакувати все разом, а потім трохи змінив результат цього, щоб зберегти ще пару байтів. Ось вхід до нього:

INIT:summon ArmorStand ~ ~ ~ {Tags:["b"]}
INIT:summon Pig ~ ~ ~ {NoAI:1b}
tp @e[type=Pig] ~ ~1 ~
execute @e[type=Pig] ~ ~ ~ summon Cow ~ ~ ~ {NoAI:1b}
execute @e[type=Pig] ~ ~ ~ summon Bat ~ ~ ~ {NoAI:1b}
tp @e[type=Bat] ~-1 ~ ~
tp @e[type=Cow] ~1 ~ ~
execute @e[tag=b] ~ ~ ~ execute @e[rm=130,r=140] ~ ~ ~ setblock ~ ~ ~ wool 2
execute @e[tag=b] ~ ~ ~ execute @e[rm=140,r=150] ~ ~ ~ setblock ~ ~ ~ wool 10
execute @e[tag=b] ~ ~ ~ execute @e[rm=150,r=160] ~ ~ ~ setblock ~ ~ ~ wool 11
execute @e[tag=b] ~ ~ ~ execute @e[rm=160,r=170] ~ ~ ~ setblock ~ ~ ~ wool 13
execute @e[tag=b] ~ ~ ~ execute @e[rm=170,r=180] ~ ~ ~ setblock ~ ~ ~ wool 4
execute @e[tag=b] ~ ~ ~ execute @e[rm=180,r=190] ~ ~ ~ setblock ~ ~ ~ wool 1
execute @e[tag=b] ~ ~ ~ execute @e[rm=190,r=200] ~ ~ ~ setblock ~ ~ ~ wool 14
execute @e[tag=b] ~ ~ ~ execute @e[rm=200] ~ ~ ~ tp @e[c=1] ~ -99 ~

Це загалом 15 1.9+ командних блоків та 838 байт, тобто 15 * 2 + 838 = 868 біт .

Ось (майже) частина, в ньому відсутні кут і край. Логічно це не повинно - помилка Minecraft? Було б рівно 400x200 блоків, якби не це. Не так багато я можу зробити.

Mathematica 152 144 126 байт

Graphics@MapIndexed[{#,Disk[{0,0},4-#/5&@@#2,{Pi,0}]}&,RGBColor/@TextWords@"#f00 #ff7f00 #ff0 #0f0 #00f #4b0082 #8f00ff #fff"]

Дякую @CatsAreFluffy за гоління 8 байт & @njpipeorgan ще 18 :)

vim, 165 142 139

i<svg viewBox=0,0,400,200><cr><circle cx=2<C-n> cy=2<C-n> r=2<C-n> fill=red<cr>#ff7f00<cr>#ff0<cr>#0f0<cr>#00f<cr>indigo<cr>#8f00ff<cr>#fff<esc>2Gqq0y4f=jPBB10<C-x>@qq@qV2G:norm A /><cr>

Так, це незграбно. Треба вдосконалити якісь покращення.

Виходи SVG, як моя відповідь Pyth .

Дякуємо @MyHamDJ за бриття 3-х байт!

HTML + SVG + ES6, 169

<svg width=400 viewBox=0,0,40,20 onload="this.innerHTML=`f00
ff7f00
ff0
0f0
00f
4b0082
8f00ff
fff`.replace(/.+/g,c=>`<circle cx=20 cy=20 r=${--r} fill=#${c} />`,r=21)"/>

Рубін з взуттям, 155 байт

Shoes.app(width:400,height:200){background'fff'
8.times{|i|stroke fill %w{f00 ff7f00 ff0 0f0 00f 4b0082 8f00ff fff}[i]
oval left:i*=10,top:i,radius:200-i}}

Вибірка зразка:

JavaScript (ES6), 171 158 байт

document.write`<svg width=400 height=200>${`f00
ff7f00
ff0
0f0
00f
4b0082
8f00ff
fff`.replace(/.+/g,c=>`<circle cx=200 cy=200 r=${i--}0 fill=#${c} />`,i=20)}`

Подяка @ edc65 за ідею перетворення

`[...].map((c,i)=>...)`

до

`...`.replace(/.+/g,c=>...,i=20)

Це може виглядати довше, але кількість байтів, збережених при стисненні масиву в рядок, цілком вартує перетворення. (У цьому випадку це економить 13 байт)

Демо

document.write`<svg width=400 height=200>${`f00
ff7f00
ff0
0f0
00f
4b0082
8f00ff
fff`.replace(/.+/g,c=>`<circle cx=200 cy=200 r=${i--}0 fill=#${c} />`,i=20)}`

HTML (162) + CSS (146)

body{height:200px;width:400px}div{height:100%;box-sizing:border-box;border-radius:50% 50% 0 0/100% 100% 0 0;border:solid;border-width:10px 10px 0}

<div style=color:red><div style=color:#FF7F00><div style=color:#FF0><div style=color:#0F0><div style=color:#00F><div style=color:#4B0082><div style=color:#8F00FF>

HTML (224) + CSS (128)

body{height:200px;width:400px}div{height:100%;box-sizing:border-box;border-radius:50% 50% 0 0/100% 100% 0 0;padding:10px 10px 0}

<div style=background:red><div style=background:#FF7F00><div style=background:#FF0><div style=background:#0F0><div style=background:#00F><div style=background:#4B0082><div style=background:#8F00FF><div style=background:#FFF>

SpecBAS - 318 254 байт

Якщо ми малюємо веселки, то, здається, вдале місце для використання наступника ZX Spectrum BASIC.

1 p,k=20,x1=0,x2=400,y=200
2 FOR EACH s IN [16711680,16744192,16776960,65280,255,4915330,9371903]: PALETTE p,s: INC p: NEXT s
3 CLS 15: DRAW 0,200 TO 70,200: DRAW 330,200 TO 400,200
4 FOR i=1 TO 7
5 INK k: DRAW x1,y TO x2,y,-PI: DRAW x1+10,y TO x2-10,y,-PI: FILL x1+5,190
6 x1+=10,x2-=10,k+=1
7 NEXT i

Рядок 2 налаштовує палітру для потрібних значень RGB (і, мабуть, не допомагає підрахунку байтів), оскільки стандартні кольори спектру не збігаються.

DRAWКоманда може приймати додатковий параметр , який робить його повернути через кілька градусів радіанах між x1, y1 і x2, y2. Нарешті він знаходить проміжок у щойно накреслених півколах і заливається поточним кольором.

Tcl / Tk , 263 байт

canvas .c -bg #FFF -bo 0 -highlightt 0;pack .c -e 1 -f both;wm ge . 400x200;foreach {r c} {200 #FF0000 190 #FF7F00 180 #FFFF00 170 #00FF00 160 #0000FF 150 #4B0082 140 #8F00FF 130 #FFF} {.c cr o -$r -$r $r $r -outline $c -f $c};after 100 {.c x s -5 u;.c y s -10 u}

На жаль, подібне питання завжди надає перевагу деяким езотеричним мовам ... Тим не менш, Tcl / Tk дійсно робить усі графічні операції: легкими, короткими та читабельними .

Це означає, що я пожертвував читальністю, щоб скоротити параметри до якомога менше символів. Я не думаю, що скорочення списку кольорів допоможе в порівнянні з кодом розпакувати його ...

Для порівняння, ось незроблений код (380 байт):

canvas .c -bg #FFF -borderwidth 0 -highlightthickness 0
pack .c -expand yes -fill both
wm geometry . 400x200
foreach {r c} {
  200 #FF0000 
  190 #FF7F00 
  180 #FFFF00 
  170 #00FF00 
  160 #0000FF 
  150 #4B0082 
  140 #8F00FF 
  130 #FFFFFF
} {
  .c create arc -$r -$r $r $r -extent 180 -outline $c -fill $c
}
after 100 {
  .c xview scroll -5 units
  .c yview scroll -10 units
}

The afterКоманда була , до жаль , необхідно , тому що не скролінг (від координат канви) не може бути зроблено до того , як вікно відображається на екрані.

Також розчавлений код насправді набирає повну веселку (використовуючи коло замість дуги) і просто покладається на відсікання вікон ...

У будь-якому випадку, я сподіваюся, вам сподобається. : O)

LaTeX, 290 байт

\documentclass{proc}\input tikz\begin{document}\def\z#1!#2!#3!#4!{\definecolor{t}{rgb}{#1,#2,#3}\fill[color=t](200pt,0)circle(#4pt);}\tikz{\clip(0,0)rectangle(400pt,200pt);\z1!0!0!200!\z1!.5!0!190!\z1!1!0!180!\z0!1!0!170!\z0!0!1!160!\z.29!0!.51!150!\z.56!0!1!140!\z1!1!1!130!}\end{document}

Спробуйте тут .

Пояснення

\documentclass{proc}
\input tikz
\begin{document}

    %Define macro "\z" with 4 arguments.         
    % The first 3 arguments are rgb values for the color
    % Last argument is the radius in pt that we draw a full circle with

    \def\z#1!#2!#3!#4!
        {\definecolor{t}{rgb}{#1,#2,#3}
         \fill[color=t](200pt,0)circle(#4pt);}

    % Start a Tikz figure

    \tikz{

        % We only draw the top half of the circle

        \clip(0,0)rectangle(400pt,200pt);

        % Draw each circle from biggest to smallest

        \z1!0!0!200!
        \z1!.5!0!190!
        \z1!1!0!180!
        \z0!1!0!170!
        \z0!0!1!160!
        \z.29!0!.51!150!
        \z.56!0!1!140!

        % Draw a white circle last

        \z1!1!1!130!
    }
\end{document}

Java, 354 байти

public void r() throws IOException{BufferedImage i=new BufferedImage(400,200,2);Graphics2D g=i.createGraphics();g.setStroke(new BasicStroke(10));int[]c={0xFF0000,0xFF7F00,0xFFFF00,0xFF00,255,0x4B0082,0x8F00FF};for(int v=0;v<7;v ++){g.setColor(new Color(c[v]));g.drawArc(v*10+5,v*10+5,390-v*20,390-v*20,0,360);}ImageIO.write(i,"PNG",new File("a.png"));}}

Просто використовує Graphics2Dклас для малювання 7 дуг, з масивом для зберігання кольорів. Я впевнений, що це може бути вдосконалено далі.

Невикористаний код:

public void ungolfed() throws IOException {
        BufferedImage i = new BufferedImage(400, 200, 2); // 2 is TYPE_INT_ARGB
        Graphics2D g = i.createGraphics();
        g.setStroke(new BasicStroke(10));
        int[] c = {0xFF0000, 0xFF7F00, 0xFFFF00, 0x00FF00, 0x0000FF, 0x4B0082, 0x8F00FF};
        for(int v = 0; v < 7; v ++) {
            g.setColor(new Color(c[v]));
            g.drawArc(v * 10 + 5, v * 10 + 5, 390 - v * 20, 390 - v * 20, 0, 360);
        }
        ImageIO.write(i, "PNG", new File("a.png"));
    }

Bubblegum , 139 119 байт

Hexdump:

00000000: b329 2e4b 5728 cb4c 2d77 caaf b035 d031  .).KW(.L-w...5.1
00000010: d031 3130 d031 3230 b0e3 b249 ce2c 4ace  .110.120...I.,J.
00000020: 4955 48ae b005 f215 922b c154 1198 4ccb  IUH......+.T..L.
00000030: ccc9 b12d 4a4d 51d0 c7ad ced0 12aa 4e39  ...-JMQ.......N9
00000040: 2dcd 3c0d 2884 4fad 0542 2d7e 85e6 3085  -.<.(.O..B-~..0.
00000050: 0604 149a c115 1aa4 e155 680a 5598 9997  .........Uh.U...
00000060: 9299 9e8f 57a9 09cc 4c0b a07f d2f0 1b6b  ....W...L......k
00000070: 8cf0 1148 2100 0a                        ...H!..

На жаль, це коротше моєї відповіді Піта . :(

Створює той самий файл SVG.

CSS, 244 242 240 байт

body{width:400px;height:200px;background-image:radial-gradient(500px at bottom,#FFF 26%,#8F00FF 26%,#8F00FF 28%,#4B0082 28%,#4B0082 30%,#00F 30%,#00F 32%,#0F0 32%,#0F0 34%,#FF0 34%,#FF0 36%,#FF7F00 36%,#FF7F00 38%,red 38%,red 40%,#FFF 40%)}

Редагувати. Збережено 2 байти, обробляючи помилку в Chrome. Збережено ще 2 байти завдяки @TrangOul.

Примітка: фрагмент використовується <div>через обмеження фрагментів стека.

div {
    width: 400px;
    height: 200px;
    background-image: radial-gradient(500px at bottom,
        #FFF 26%,
        #8F00FF 26%, #8F00FF 28%,
        #4B0082 28%, #4B0082 30%,
        #00F 30%, #00F 32%,
        #0F0 32%, #0F0 34%,
        #FF0 34%, #FF0 36%,
        #FF7F00 36%, #FF7F00 38%,
        red 38%, red 40%,
        #FFF 40%);
}

<div>

JavaScript 271 251

c=document.body.appendChild(document.createElement('canvas'))
x=c.getContext('2d')
c.width=400
r=c.height=200
for(i=0;i<8;x.beginPath(),x.arc(r,r,r-i*10,0,7),x.fillStyle="#"+"FF0000FF7F00FFFF0000FF000000FF4B00828F00FFFFFFFF".substr(i++*6,6),x.fill());

C, 220 217 213 байт

#define X printf("%c",s<169|s/401?y:s
i=8e4,t,y=255;main(s){for(puts("P6 400 200 255");i--;X/288?y:s<195?143:s<225?75:0),X<256|s/360?0:s/323?127:y),X<225&s/195?130:s<256?y:0))s=i/400,t=i%400-200,s=(s*s+t*t)/100;}

Вихід - PPM (двійковий вид).

Редагувати: збережено пару байтів завдяки @tucuxi.

Редагувати 2: Переупорядкований код для економії ще більше.

Google Blockly , 48 блоків, 75 байт

Клацніть на зображенні нижче, щоб перейти до рішення, де ви зможете детальніше ознайомитись з тим, як це працює.
Що стосується пояснення, я думаю, що зображення вартує тисячі слів, а отже, gif - це тисяча зображень.

посилання на великий читабельний gif

Примітка: я не знаю, як рахувати в Blockly, тому я рахував кожен блок як 1 байт, а кожну змінну регулярним шляхом, так що 0== 1 байт, 530== 3 байти, Arial== 5 байт і bold== 4 байти.
Я порахував особливого персонажа, який я використовував, щоб відрізати веселку як 2 байти. Будь ласка, повідомте про будь-які помилки чи пропозиції щодо кількості байтів у коментарях

Постскрипт (87 байт)

Шістнадцятковий дамп:

00000000: 3188 0131 2030 2e35 3631 8800 3120 302e  1..1 0.561..1 0.
00000010: 3237 3888 0030 2e35 3188 0030 8801 3088  278..0.51..0..0.
00000020: 0130 8801 3188 0031 2030 2e35 8800 3188  .0..1..1 0.5..1.
00000030: 0030 87c8 0038 7b34 2031 9287 929d 87c8  .0...8{4 1......
00000040: 0030 2032 9258 3087 b400 9205 9216 9242  .0 2.X0........B
00000050: 880a 92a9 7d92 83                        ....}..

Вихід:

HTML + CSS, 310 307 байт

<b style=background:red><b style=background:#ff7f00><b style=background:#ff0><b style=background:lime><b style=background:blue><b style=background:indigo><b style=background:#8f00ff><b style=background:#fff;width:260px;height:130px><style>b{float:left;padding:10px 10px 0 10px;border-radius:300px 300px 0 0}

Супердоцільна недійсна розмітка (може виглядати чи не виглядати правильно у вашому браузері). Просто хотів подивитися, чи це можливо.

PHP, 285 байт

<?php $a=imagecreate(400,200);define("b",255);$c=array(b,b,b,b,0,0,b,127,0,b,b,0,0,b,0,0,0,b,75,0,130,143,0,b,b,b,b);for($i=0;$i<9;$i++){imagefilledellipse($a,200,200,420-$i*20,420-$i*20,imagecolorallocate($a,$c[$i*3],$c[$i*3+1],$c[$i*3+2]));}header("Content-type:png");imagepng($a);?>

Виходи:

Bash + ImageMagick, 159 125 characters

eval convert -size 401x201 xc: '-fill \#'{f00,ff7f00,ff0,0f0,00f,4b0082,8f00ff,fff}' -draw "circle 200,200 200,$[i++*10]"' x:

Sample output:

Processing, 196 186 181 179 169 163 bytes

int d=400,i=0;size(d,d/2);background(-1);int[]c={-65536,-33024,-256,#00ff00,#0000ff,#4b0082,#8f00ff,-1};for(noStroke();i<8;ellipse(200,200,d,d),d-=20)fill(c[i++]);

Saved 10 bytes thanks to Kritixi Lithos
... and another 6 bytes thanks to dzaima

R, 184 170 bytes

Making an image with fixed pixel dimensions turns out to be surprisingly tricky with R, whose plotting functions are mostly intended for statisticians. In particular R leaves extra space for labels and coordinate axes unless you explicitly set margins as zero-width by calling par.

On the other hand some of the required colours (specifically red, yellow and blue) are found in the default palette, and can be referenced simply by integer indices.

png(,400,200)
par(mar=0*1:4)
plot(as.raster(outer(199:0,-199.5:200,function(y,x)c(rep("white",13),"#8F00FF","#4B0082",4,"green",7,"#FF7F00",2)[1+(x^2+y^2)^.5%%200/10])))

Forth Salon Haiku (184 bytes)

I can't satisfy the dimension constraints with this format, but I thought it worth sharing anyway.

: ^ 2 ** ;
: b 0.9 * dup x .5 - ^ y 2.01 / ^
+ sqrt dup rot > swap rot .045
+ < * * + ;
0 .56 .2 b .29 .25 b 1 .4 b
1 .45 b 1 .5 b 0 1 .35 b 1 .4 b
0.5 .45 b 0 1 .2 b .51 .25 b
1 .3 b

Excel VBA, _{213 202 196 192} 172 Bytes

Code

Anonymous VBE immediate window function that takes no input and outputs a rainbow, as a vector image, to the sheets(1) object

For i=0To 7:j=400-20*i:Set s=Sheet1.Shapes.AddShape(20,10*i,10*i,j,j):s.Fill.ForeColor.RGB=Array(255,32767,65535,65280,-31*4^8,8519755,&HE1008F,-1)(i):s.Line.Visible=0:Next

Subroutine Version

Sub a
For i=0To 7
j=400-20*i
set s=Sheet1.Shapes.AddShape(20,10*i,10*i,j,j)
s.Fill.ForeColor.RGB=Array(255,32767,65535,65280,-31*4^8,8519755,&HE1008F,-1)(i)
s.Line.Visible=0
Next
End Sub

-11 bytes for removing .Adjustments(3)=3/80 call and adding a 8th, white arc

-6 bytes for using -1 over &HFFFFFF

-3 bytes for using Sheet1 over Sheets(1)

-6 bytes for converting with statement to set statement

-14 bytes for converting from Sub to anonymous VBE function

Output

DIV Games Studio (184 bytes)

Not the shortest but quite simple. Uses the DIV default palette

PROGRAM r;
local
c[]=22,26,235,41,54,82,249,15,15;
BEGIN
set_mode(400200);
for(x=-80;x<80;x+=10)
y=399-x;
draw(5,c[abs(x)/10],15,0,x,x,y,y);
x+=70*(x<0);END
LOOP;FRAME;END
END

Explanation

Define program start (named "r" to save space)

PROGRAM r;

setup palette lookup

local
c[]=22,26,235,41,54,82,249,15,15;

BEGIN program code

BEGIN

Set video mode to 400,200

set_mode(400200);

loop x (predefined variable) from -80 (which bg hack) to 80 ( 7 colours + white centre)

for(x=-80;x<80;x+=10)

define elipse constraints

y=399-x;

draw elipse - on the first iteration this draws a circle larger than the screen in full white (index -8)

draw(type (5=filled elipse), colour, opacity, x0,y0,x1,y1)

draw(5,c[abs(x)/10],15,0,x,x,y,y);

once first is done, bump x up to zero to start drawing red band

x+=70*(x<0);

end for loop

END

infinite loop, drawing screen.

LOOP;FRAME;END

end (matches BEGIN at top of program)

END

Perl, 175 + 1 = 176 bytes

perl -MSVG -E '$z=SVG->new(width=>4e2,height=>2e2);@x=qw/#fff #8f00ff indigo #00f #0f0 #ff0 #ff7f00 red/;$z->circle(cx=>200,cy=>200,r=>200-10*$a++,style=>{fill=>pop@x})for 1..8;say$z->xmlify'

PHP, 190 bytes

imagefill($a=imagecreatetruecolor($r=400,200),0,0,$w=0xffffff);foreach([255<<16,0xff7f00,$w-255,65280,255,4915330,9371903,$w]as$i)imagefilledellipse($a,200,200,$r,20+$r-=20,$i);imagepng($a);

Run it like this:

php -r 'imagefill($a=imagecreatetruecolor($r=400,200),0,0,$w=0xffffff);foreach([255<<16,0xff7f00,$w-255,65280,255,4915330,9371903,$w]as$i)imagefilledellipse($a,200,200,$r,20+$r-=20,$i);imagepng($a);' | display

Also working in theory at 179 bytes (but the image looks a tad messed up, bad GD):

php -r '$r=410;imagesetthickness($a=imagecreatetruecolor(400,200),10);foreach([255<<16,0xff7f00,0xffff00,65280,255,4915330,9371903]as$i)imagearc($a,200,200,$r-=20,$r,1,0,$i);imagepng($a);' | display

Also not a perfect image, but much better than the above (and @166 bytes):

php -d error_reporting=30709 -r '$a=imagecreatetruecolor($r=400,200);foreach([255<<16,0xff7f00,0xffff00,65280,255,4915330,9371903]as$i)for(;++$$i<21;)imageellipse($a,200,200,$r,$r--,$i);imagepng($a);' | display