温かいウェルカムシークレットハットを描く


56

Winter Bash 2014盛り上がりを見せており、私たち全員が帽子を愛していませんか?特に秘密の帽子!

それでは、秘密の帽子の1つを描いてみませんか?

挑戦

あなたの仕事は、選択した言語で、このページに表示されているとおりの正確な構造を持つ、ウォームウェルカムハットを比例して描くことです

いつものように、ベクターまたはラスターグラフィックスを使用して、帽子をファイルまたは画面にレンダリングできます。出力をラスタライズする場合、画像のサイズは400x400ピクセル以上である必要があります。

さらに、帽子の実際の内容(画像の色付き部分の境界矩形の領域)は、出力画像の40%以上をカバーする必要があります。

仕様書

以下の画像は、帽子のさまざまな寸法を示しています。ピクセルなど、すべての寸法は単位内にあります。画像内のすべての境界線の半径は、13単位の半径で描画されます。

ここに画像の説明を入力してください

  • 星と円形リングの赤-rgb(255、28、34)
  • 円の中の黄色-rgb(255、202、87)
  • 最軽量グレー-rgb(88、88、92)
  • 最も暗い灰色-rgb(31、26、26)
  • ミドルグレー-rgb(64、64、64)

得点

これはコードゴルフなので、最短の回答(バイト単位)が勝ちです。

警告の言葉として、既存の圧縮の使用(圧縮GIFの埋め込みなど)は、いくつかの標準的な抜け穴に該当します。


提案された編集について:拒否することにしました。画像はそのまま正しく表示されます。
mbomb007

回答:


15

GolfScript(376 373 364 350 または645 610 607バイト)

SVGの正確な構造を要求した元の仕様に従って、ゴルフSVGは607バイトで生成されます。

コードには多くの非印刷文字が含まれているため、xxdの出力を次に示します。

0000000: 221a c837 cde6 0c0c 4658 5786 cead ca66  "..7....FXW....f
0000010: 3507 d130 1577 4657 4067 df6b 97e7 510f  5..0.wFW@g.k..Q.
0000020: cbb0 e3e5 77c6 a91d d830 fa92 eea0 d447  ....w....0.....G
0000030: 7721 cc59 3f4c 230b e0bb fd3e ecf3 d4f7  w!.Y?L#....>....
0000040: 2c6b abd5 b1e5 939d 68b4 e89e 39ca a259  ,k......h...9..Y
0000050: b934 ef6f 203a 7abf 1a2c b468 3351 4c53  .4.o :z..,.h3QLS
0000060: c056 9a59 f38c a97e cf82 8840 ee7c 43e4  .V.Y...~...@.|C.
0000070: 123f df1a 00d4 542d a29c 0195 3ad5 4af4  .?....T-....:.J.
0000080: c644 57c7 0b6b 4d4f 908b 8cf7 c8e2 536d  .DW..kMO......Sm
0000090: 9d36 1139 1406 5c5c dcbc 3a11 1993 63a6  .6.9..\\..:...c.
00000a0: 4f8b 7b62 de77 5158 a485 dec1 87b4 1d11  O.{b.wQX........
00000b0: 01b1 e49d 8adb 0b29 ad44 93e4 7bbd 027e  .......).D..{..~
00000c0: 7a6f 60ca 99f4 6ab3 7bc0 63c3 ba70 1220  zo`...j.{.c..p. 
00000d0: 1aea 9206 da5a 95ce 6f70 67f8 856e 8807  .....Z..opg..n..
00000e0: adec e533 0c1e 3dc6 96e5 54d4 2837 4497  ...3..=...T.(7D.
00000f0: f5ea 2135 d261 9c02 fa61 c12a 7180 085a  ..!5.a...a.*q..Z
0000100: a5b8 e3d6 68cb 0659 f4ad d01d 5fc4 9e5b  ....h..Y...._..[
0000110: d030 46d5 96c4 439f da99 2cb1 52b9 5d53  .0F...C...,.R.]S
0000120: 098e 7598 2785 a962 a40d edbd 18cb e46c  ..u.'..b.......l
0000130: 6edb ba9f 17be 36ab ef23 0caf 3ce8 352d  n.....6..#..<.5-
0000140: fad5 762b a388 ca17 413f 7dac 6dd1 116e  ..v+....A?}.m..n
0000150: b2e8 9cd1 d00a dda1 716d a148 acc7 8749  ........qm.H...I
0000160: f2c3 a7a9 8128 02e9 d83c f350 7a02 74ec  .....(...<.Pz.t.
0000170: 6270 6089 a16d 7bfa b6dd e56a 366a d85b  bp`..m{....j6j.[
0000180: 33e5 b777 05c1 6f4e f06b ca95 3ffc 49f7  3..w..oN.k..?.I.
0000190: 1a08 6bc5 abb0 c745 e439 b87e b81c 52c8  ..k....E.9.~..R.
00001a0: a445 935e 5c5c 00d3 34de c002 721c b69d  .E.^\\..4...r...
00001b0: 16ee aab0 9562 4d44 44ed 0193 13a7 eed2  .....bMDD.......
00001c0: 99e4 6350 a756 c21a 980b 6bca 57f9 8443  ..cP.V....k.W..C
00001d0: eecc 9fd1 05ce 78c4 f95f dc90 8926 6eb4  ......x.._...&n.
00001e0: 88b8 7b90 44be 33c3 cc2a b032 d809 17d0  ..{.D.3..*.2....
00001f0: 7e32 c4c9 e37f ceb3 b1e0 b634 a690 8163  ~2.........4...c
0000200: cd34 e3d9 9768 3e13 ac10 5003 1cb7 af6b  .4...h>...P....k
0000210: 863f cba0 9896 e50a d029 8e2b 584c d86f  .?.......).+XL.o
0000220: 67a7 120e 318a cb22 3235 3662 6173 6520  g...1.."256base 
0000230: 3132 3462 6173 655b 305d 2f28 3332 2c7b  124base[0]/(32,{
0000240: 5c5b 3124 295d 2f5c 3224 3d2a 7d2f 5c2c  \[1$)]/\2$=*}/\,
0000250: 297b 2d2e 3634 3e33 322a 2b7d 2b25 2b    ){-.64>32*+}+%+

フォロワーがよく知っている建設的な文法エンジンのバリアントです。

'MAGIC STRING'256base 124base[0]/(40,{\[1$)]/\2$=*}/\,){-.64>32*+}+%+

ゴルフされたSVGを大文字にし、それを圧縮し、解凍後に小文字にする方がわずかに良いことが判明しました。

実行すると、840バイトのSVGが生成されます。

<svg width="192" height="192"><g transform="translate(-19.356 39.823) scale(.11435537421402706)"><path d="m873 126c-28-56-97-79-153-50l-361 182c-40 20-63 60-62 102v369c0 63 51 114 114 114h1198c63 0 114-51 114-114v-369c1-62-22-82-62-102l-361-182c-56-29-125-6-153 50c-28 56-6 124 49 152h-372c55-28 77-96 49-152z" fill="#231f20"/><path d="m1642 812c0 60-49 109-109 109h-1047c-60 0-109-49-109-109v-435c0-60 49-109 109-109h96.557636322653a530 274 0 0 1 854.884727354693 0h96.557636322653c60 0 109 49 109 109v435z" fill="#424143"/><path d="m1561 826c0 52-42 95-95 95h-912c-52 0-95-42-95-95v-463c0-52 42-95 95-95h912c52 0 95 42 95 95v463z" fill="#595a5c"/><circle cy="594" cx="1010" r="199" fill="#f9c960" stroke="#ec2227" stroke-width="42"/><path d="m1063 615l85-62-105 0-33-100-33 100-105 0 85 62-32 100 85-62 85 62z" fill="#ec2227"/></g></svg>

数ミリピクセルだけ位置を微調整し、最も暗い灰色の部分の1つの小さな非対称性を修正しました。


ただし、チャットでの質問とディスカッションの変更は、364バイトで実行できるSVGに適切な近似を作成することが実際に許容されることを示しています。解凍チェーンも同様であるため、GolfScriptファイルのxxd出力は次のとおりです。

0000000: 2710 9f1d b7bb 6ca9 ad60 1325 b869 45a6  '.....l..`.%.iE.
0000010: 9371 2eee 1271 1dac 0244 9ca3 2820 e6be  .q...q...D..( ..
0000020: b038 68e4 4e53 bbe9 7809 a67a 5f02 2f14  .8h.NS..x..z_./.
0000030: 66a1 0cb3 648c 76d4 0450 028d fd32 b81f  f...d.v..P...2..
0000040: 351a d449 bba8 e685 4de8 1fc0 abfd 8b9f  5..I....M.......
0000050: d9d9 33cd 16e9 5c27 b7a0 dc0f 4138 a2ca  ..3...\'....A8..
0000060: 2b45 a2c2 571e 7e1e 1030 dcfd b48e 377b  +E..W.~..0....7{
0000070: 112e 7762 d14c 1fed 0bcb 15b4 c383 f828  ..wb.L.........(
0000080: b317 8c9f 890b ce84 7782 4c10 fc8e 7602  ........w.L...v.
0000090: 9fef 9563 fe30 45b0 7144 30b3 f3c5 fa22  ...c.0E.qD0...."
00000a0: ccae 8a08 c506 466b 6b84 317e 62dd a558  ......Fkk.1~b..X
00000b0: 8423 d8ef 9d67 e807 0d23 847d 4dab 68ff  .#...g...#.}M.h.
00000c0: 952b ca20 14d3 0881 2880 6611 eb53 10c6  .+. ....(.f..S..
00000d0: 0058 573f 3c87 957c 8512 59ff 94f3 ae38  .XW?<..|..Y....8
00000e0: 4145 bf8d 4123 6e84 aa62 904d a878 0bca  AE..A#n..b.M.x..
00000f0: 854b deaa 32ae 70fc b31a 9578 676a df8a  .K..2.p....xgj..
0000100: 7310 ecfc 47d2 5dde 1a8c 3898 943b ede3  s...G.]...8..;..
0000110: d0a2 55a4 eb00 b623 0302 d79c a712 b616  ..U....#........
0000120: 5037 dc2d 0dad 2732 3536 6261 7365 2031  P7.-..'256base 1
0000130: 3133 6261 7365 5b30 5d2f 2832 312c 7b5c  13base[0]/(21,{\
0000140: 5b31 2429 5d2f 5c32 243d 2a7d 2f5c 2c29  [1$)]/\2$=*}/\,)
0000150: 7b2d 2e36 343e 3332 2a2b 7d2b 252b       {-.64>32*+}+%+

547バイトのSVGファイルを生成します。

<svg width="1426" height="858"><path d="m475 114-361.5 182v370h1199v-370l-361.5-182" stroke="#231f20" stroke-linecap="round" stroke-linejoin="round" stroke-width="227"/><ellipse cx="713" cy="367" rx="530" ry="274" fill="#424143"/><rect x="80" y="205" width="1266" height="653" rx="109" ry="109" fill="#424143"/><rect x="161" y="205" width="1103" height="653" rx="95" ry="95" fill="#595a5c"/><circle cx="713" cy="531" r="199" fill="#f9c960" stroke="#ec2227" stroke-width="42"/><path d="m713 390 85 262-223-162 276 0-223 162z" fill="#ec2227"/></svg>

GolfScriptで9バイトに変換されたSVGの7バイトの節約を指摘してくれたPaul LeBeauと、星を5ポイントだけで描画できることを示した彼の答えに感謝します。(彼の答えを使用すると、329バイト、または彼の答えを少し調整して323バイトになりますが、私はそれに満足していません)。

Inkscapeで50%でエクスポート:

PNGとしてレンダリングされた帽子画像

構造を確認するためにfill="none"、すべてでレンダリングされたSVG と、一部の塗りつぶしの色が線の色に変更されました。 アウトライン画像


@Optimizer、ただしJS 1とは異なり、ほぼピクセル完璧です。ゴルフをすること以外に、オリジナルのSVGとの唯一の違いは、非対称性を修正することです。Martinのマークアップされた画像のスタイルでリラックスすれば、おそらくかなり節約できます。
ピーターテイラー14

「<g>」と「</ g>」は不要なので、もう少し節約できるはずです。
ポール・ルボー

@PaulLeBeau、非常に真実、ありがとう。
ピーターテイラー

26

SVG(462460454429384365バイト)

私はそれがプログラミング言語ではないことを知っていますが、これは少なくともSVG出力を生成する誰にとっても役立つと思いました...

これは、Peter TaylorのSVGに基づいています。

元の座標を使用し、パスを少し最適化することで、SVGを小さくすることができました。色も修正しました。

<svg><g stroke-linecap=round stroke-linejoin=round stroke-width=26><path d=M54,13,13,36V75H151V36L110,13 stroke=#1f1a1a /><path d=M21,84V36H37A91,91,0,0,1,127,36h16V84z stroke=#404040 /><path d=M30,36v48h104V36z stroke=#58585c fill=#58585c /></g><circle cx=82 cy=60 r=23 fill=#ffca57 stroke=#ff1c22 stroke-width=5 /><path d=M82,43,92,74,66,55H98L72,74z fill=#ff1c22

更新:Peter Taylorが指摘した欠陥と四角形の位置を修正し、さらに2バイト節約しました。

更新2: Peterからの別の修正と提案を組み込みました(-6バイト)

更新3:命令がすべての半径を13に指定していることに気付いたので、それを利用し、パスをもう少し最適化して、さらに25バイト節約しました。ここでより読みやすいフィドル。

更新4: SVGはHTMLに埋め込まれていると既に想定しているため(スタンドアロンSVGには名前空間宣言が必要です)、実際にこれをさらに絞ることができます。(a)SVGのサイズは、ブラウザーがサイズが不確定(300x150)のオブジェクトに与えるデフォルトのサイズよりも小さいため、幅と高さの属性は必要ありません。(b)HTMLパーサーは、引用符がないため、それらの一部を削除できます(Squeamish Ossifrageのアイデア)。さらに45バイト節約します。

更新5:hslのトリックを使用して、色の引用を解除し、末尾の終了タグを削除します。さらに19バイトを節約しました。後者は最初は少し気味が悪いように見えましたが、すべてのブラウザで動作するため、気が変わりました。:) hslに感謝します!


いくつかの素晴らしいアイデアがありますが、1つのかなり悪い欠陥があります。ミッドグレーは、ダークグレーの塗りつぶしをカバーするのに十分な高さになりません。これをfill="none"グループに追加するか、カーブを調整することで修正するのが最善かどうかはわかりません。
ピーターテイラー14

よくわかりました、ありがとう。修正されました。ストローク幅の半分を引くのを忘れたため、正しい円弧半径を使用していませんでした。
ポールルボー14

<rect>高さ74はである必要があり78ます。そして、私はそれでそれを置き換えるために、5-char型の省作る<path>の両方を持つfillstrokestroke-width="18"、その後、内に移動<g>し、一般的にはstroke-width="18"には2本のパスから移動<g>。また<path>、aではなく別のもの<rect>を使用すると、圧縮率がわずかに向上します。
ピーターテイラー14

ありがとう。半径に違いがあるようです(8対9)。しかし、それは完全に明確ではないので、9として両方を持つことはとにかくほとんど目立ちません。
ポールルボー14

Radiiは13として指定されているため、SVGを更新しました。
ポールルボー

20

Mathematica 787612600514506バイト

驚くべき量のコードが必要です。きっとbeatられます。

非ゴルフ形式

red=RGBColor[1.,.11,.13]
yellow=RGBColor[1.,.79,.34]
lightGrey=RGBColor[.35,.35,.36]
midGrey=RGBColor[.25,.25,.25]
r=RoundingRadius->8;
pentagonalVertices[offset_]:=Table[{Cos[2π k/5+ offset],Sin[2π k/5+offset]},{k,0,5}];
x=63;x2=72;
y=37;
pts={{e=22,50},{h=72,30},{h,-17},{-h,-15},{-h,30},{-e,50}};
pts2={{-h,-15},{-h,30},{-e,50}}
Graphics[{
{Black,Thickness[.13],JoinForm["Round"],CapForm["Round"], Line[pts]},
midGrey,Rectangle[{-x2,-y},{x2,y},r],
Disk[{0,-55},104,{Pi/3,2Pi/3}],
White,Rectangle[{-40,-60},{40,0},r],
lightGrey,Rectangle[{-x,-y},{x,y},r],
red,Disk[{0,0},25],yellow,Disk[{0,0},19.5],red,
GraphicsComplex[16.7 pentagonalVertices[Pi/2],Polygon[{1,3,5,2,4}]],
GraphicsComplex[6.4 pentagonalVertices[3 Pi/2],Polygon[{1,2,3,4,5}]]}]

帽子

ゴルフ

g=GraphicsComplex;c=RGBColor;d=c[1.,.11,.13];o="Round";k=Rectangle;j=Disk;n=Polygon;r=RoundingRadius->8;w@s_:=Table[{Cos[2\[Pi]k/5+s],Sin[2\[Pi]k/5+s]},{k,0,5}];x=63;i=72;y=37;p={{e=22,50},{h=72,30},{h,-17},{-h,-15},{-h,30},{-e,50}};Graphics[{Thickness[.13],JoinForm@o,CapForm@o,Line@p,c[.25,.25,.25],k[{-i,-y},{i,y},r],j[{0,-55},104,{\[Pi]/3,2\[Pi]/3}],White,k[{-40,-60},{40,0},r],c[.35,.35,.36],k[{-x,-y},{x,y},r],d,j[{0,0},25],c[1.,.79,.34],j[{0,0},19.5],d,g[16.7w[\[Pi]/2],n[{1,3,5,2,4}]],g[6.4w[3\[Pi]/2],n[{1,2,3,4,5}]]}]

バイトのカウント方法を聞いてもいいですか?(私はここで新しい)このサイトであなたのゴルフバージョンをカウントすると651バイトを取得します:mothereff.in/byte-counter
ジャンポール14

1
Wolframが使用する自動カウンターアプリを使用して、1ライナーコンテストへの提出の長さを評価します(blog.wolfram.com/2014/11/10/…)。読みやすくするために含まれるオプションのスペースはカウントされません。実際には、バイトではなく、文字のnoを読み取りますが、1文字= 1バイトと想定しています。
DavidC 14

理にかなっています!残念ながら、提出に対して同じことができません:)答えてくれてありがとう。
ジャンポール

そのように見えると思います。しかし、これにより、1行に非常に読みにくい表示が残ります。読みやすくすることを好みます。
DavidC 14

18

HTML + ES6、533

<canvas id=D width=600 height=400><script>c=D.getContext('2d')
S=x=>c.strokeStyle=F(x)
F=x=>c.fillStyle=x
W=x=>c.lineWidth=x
B=x=>c.stroke()||c.fill()||c.beginPath()
G='s.charCodeAt(i++)*9-300,'
L=s=>B()||eval('for(i in s)i%2||c.lineTo('+G+G+'0)')&&B()
c.lineCap=c.lineJoin='round'
W(60)
S('#1F1A1A')
L(';,+3+BXBX3H,')
S('#404040')
L('.3.EUEU3.3')
c.arc(291,390,270,4,5.2,0)
B()
S('#58585C')
L('131ERER313')
S(R='#FF1C22')
F('#FFCA57')
W(30)
c.arc(291,240,69,0,7,0)
B()
c.font='105px serif'
S(R)
c.fillText('\u2605',239,276)</script>

スニペット(変更):

<canvas style="margin:-40px 0 0 100px;height:250px;" id=D width=600 height=400><script>stages=[function(){c=D.getContext('2d');S=function(x){return c.strokeStyle=F(x)};F=function(x){return c.fillStyle=x};W=function(x){return c.lineWidth=x};B=function(x){return c.stroke()||c.fill()||c.beginPath()};G='s.charCodeAt(i++)*9-300,';L=function(s){return B()||eval('for(i in s)i%2||c.lineTo('+G+G+'0)')&&B()}},function(){c.lineCap=c.lineJoin='round';W(60);S('#1F1A1A');L(';,+3+BXBX3H,')},function(){S('#404040');L('.3.EUEU3.3')},function(){c.arc(291,390,270,4,5.2,0);B()},function(){S('#58585C');L('131ERER313')},function(){S(R='#FF1C22');F('#FFCA57');W(30);c.arc(291,240,69,0,7,0);B()},function(){c.font='105px serif';S(R);c.fillText('\u2605',239,276)}];next=function(i){stages[i]();if(i<6)setTimeout(next,1000,i+1)};next(0)</script>

帽子!


@Optimizer FFとChromeの両方で見栄えが良いので、画像を追加しました。フォントは、Windowsなどで異なる必要があります。
GRC

@grc特定のフォントがすべてのシステムですぐに利用できることに頼ることはできないと思います。特にあなたが使用しない場合はserif...でも、特定のフォントではありませんこれは、
アレクサンダー

Arial Unicode MS(実際にコードポイントを持っているWindows Arialフォント)では、そのコードポイントは正しい形状さえ持っていません。ポイントのベースは狭くなります。
ピーターテイラー14

13

HTML + CSS、676 636 625バイト

これは、それらを取り除くことで、多くのことをgolfedすることができleft:XXXpxセンタリングのいくつかの並べ替え使用しての代わりに、すべてのものを中心にトランスフォームを使用して今すぐにleft:XXXpx

*{left:50%;transform:translate(-50%);position:absolute;border-radius:13px;height:75px}a,b,f{width:145px;background:#404040}b{width:126px;background:#58585C}c{width:163px;height:61px;top:50px}d,e{width:68px;height:40px;top:-15px}c,d,e{background:#1F1A1A}d{left:0;transform:skew(0deg,-26deg);border-radius:9px 24px}e{left:96px;transform:skew(0deg,26deg);border-radius:24px 9px}f{height:40px;width:99px;top:-13px;border-radius:150px/60px}g{height:34px;width:34px;background:#FFCA57;border:5px solid #FF1C22;border-radius:40px;top:13px;color:#FF1C22;font-size:1cm;line-height:31px;padding:3px}
<c><d></d><e></e><f></f><a><b><g>

注:これはWindows上のFirefoxで最適/期待どおりに機能します

最終結果は次のようになります。

ここに画像の説明を入力してください


ゴルフされたHTMLタグを見たことがありません。面白い。
アルトゥーロトーレスサンチェス14

1
@ArturoTorresSánchezその後、これを確認する必要があります
オプティマイザー14

星はFF 34.0 / Windowsで左と上に少しシフトしたように見える
n̴̖̋h̷͉̃a̷̭̿h̸̡̅ẗ̵̨́d̷̰̀ĥ̷̳ 14

8

ActionScript 3.0、491バイト

ゴルフフォーム:

var h=new Shape(),g=h.graphics,l=g.lineTo,m=g.moveTo,s=g.lineStyle,b=g.beginFill,e=g.endFill,r=g.drawRoundRect;s(23,0x231F20);m(77,18);l(41,36);l(41,73);m(125,18);l(161,36);l(161,73);s();b(0x424143);g.drawEllipse(48,16,106,55);e();b(0x424143);r(38,27,126,65,23,23);e();b(0x595A5C);r(46,27,110,65,17,17);e();s(4.2,0xEC2227);b(0xF9C960);g.drawCircle(101,59,20);e();s();b(0xEC2227);m(106,61);l(115,55);l(104,55);l(101,45);l(98,55);l(87,55);l(96,61);l(93,71);l(101,65);l(110,71);e();addChild(h);

出力:http : //megaswf.com/file/2708781.swf


1
または:var ww=new WarmWelcome(); stage.addChild(ww);とAS3リンケージとFlashでそれを描く:)
wchargin

7

MATLAB R2013a、551 541

これは私の最初のコードゴルフです。ルールに従っていない場合は、教えてください :)

ゴルフフォーム:

hold on
r=[1 .11 .13];h=[];b=2.4;q=-37;o='Curvature';p='Position'
x='FaceColor';z='EdgeColor';v=@rectangle;t=@repmat;s=@set
for i=1:19;h=[h v(p,[-82+b*i -32+i 22 73]) v(p,[60-b*i -32+i 22 73])];end
s(h,o,1,x,[.12 .1 .1])
c=.8:.01:2.2
h=[h fill(104*cos(c),104*sin(c)-52,t(.25,1,3))]
h=[h v(p,[-72 q 144 74],o,.1,x,t(.25,1,3))]
a=v(p,[-63 q 126 74])
a=[a v(p,[-63 q 126 74])]
s(a,o,.1,x,[t(.35,1,2) .36])
v(p,[-20 -20 40 40],o,1,x,[1 .79 .34],z,r,'LineWidth',10)
plot(0,0,'rp',['Marker' x],r,'MarkerSize',58.5)
s([a h],z,'none')
axis equal off

出力(ラスタライズ):

ここに画像の説明を入力してください


6

LaTeX / TikZ(613バイト)

\RequirePackage{xcolor,tikz}\RequirePackage[active,tightpage]{preview}\PreviewMacro[[!]\tikz\def~#1{\definecolor#1{HTML}}~1{EC2227}~2{F9C960}~3{595A5C}~4{231F20}~5{424143}\def\r{rounded
corners}\def\R{radius}\tikz[x=1pt,y=1pt]{\def~{\fill[}\draw[4,line
width=22.8,line
cap=round,line
join=round](-23.8,41.7)--(-59.9,23.5)--(-59.9,-13.3)--(59.9,-13.3)--(59.9,23.5)--(23.8,41.7);~5,x
\R=53,y
\R=27.4](0,16.4)circle;~5,\r=10.9](-63,-32.65)rectangle(63,32.65);~3,\r=9.5](-55.1,-32.65)rectangle(55.1,32.65);~1,\R=22](0,0)circle;~2,\R=17.8](0,0)circle;~1](90:14.1)\foreach\!in{0,...,4}{--(90+\!*144:14.1)}--cycle;}\stop

結果pdflatexは、ベクターグラフィックスとしての帽子とタイトな境界ボックスを持つPDFファイルです。

結果

非ゴルフ

\documentclass{minimal}
% Package xcolor provides color model HTML
% in order to take the exact same values, used in the SVG file 
\usepackage{xcolor}
\usepackage{tikz}

% Package preview is used to get a correct bounding
% box for the graphics
\usepackage[active,tightpage]{preview}
\PreviewEnvironment[{[]}]{tikzpicture}

% Color definitions. one digit instead of a name saves many bytes
\definecolor1{HTML}{EC2227}
\definecolor2{HTML}{F9C960}
\definecolor3{HTML}{595A5C}
\definecolor4{HTML}{231F20}
\definecolor5{HTML}{424143}

\begin{document}
  \begin{tikzpicture}[x=1pt,y=1pt]
    % Draws the dark lines in the background
    \draw[4,line width=22.8,line cap=round,line join=round]
    (-23.8,41.7)--(-59.9,23.5)--(-59.9,-13.3)
    --(59.9,-13.3)--(59.9,23.5)--(23.8,41.7);
    % Draws the ellipsis
    \fill[5,x radius=53,y radius=27.4](0,16.4)circle;
    % Draw the rear rectangle 
    \fill[5,rounded corners=10.9](-63,-32.65)rectangle(63,32.65);   
    % Draws the rectangle in the foreground
    \fill[3,rounded corners=9.5](-55.1,-32.65)rectangle(55.1,32.65);
    % Draws the red full circle
    \fill[1,radius=22](0,0)circle;  
    % Draws the inner yellow circle 
    \fill[2,radius=17.8](0,0)circle;
    % Draw the star
    \fill[1](90:14.1)\foreach\!in{0,...,4}{--(90+\!*144:14.1)}--cycle;
  \end{tikzpicture}%
\end{document}

値はSVGファイルから取得され、より正確でした(ただし、丸め誤差も含まれています)。最もトリッキーな部分は、背景の暗い斜めの線でした。これらは、丸い線のキャップと結合を持つ非常に太い線として描画されます。

アニメーション


なんて美しさ:)
ジャンポール14

2

Perl + TK:555

新しい行は読みやすくするためだけのものですが、非常に多くの変数が失われました。

use Tk;@w=(-width=>13);$c=tkinit->Canvas->pack;
$c->createPolygon($a=131,$b=163,168,150,$a,$b,$e=269,$b,232,150,$e,$b,$e,$d=225,$a,$d,-outline=>"#1f1a1a",@w);
$c->createPolygon(137,$f=169,263,$f,263,$g=231,137,$g,-outline=>$h="#".40x3,@w);
$c->createOval($a,147,$e,$g,-fill=>$h,-outline=>$h);
$c->createPolygon(143,$f,257,$f,257,$g,143,$g,-fill=>$l="#58585c",-outline=>$l,@w);
$c->createOval(175,175,$d,$d,-width=>5,-fill=>"#ffca57",-outline=>$r="#ff1c22");
$c->createPolygon((map{200+($_%2?17:6)*sin.628*$_,200+($_%2?17:6)*cos.628*$_}0..11),-fill=>$r);
MainLoop

これが写真です:

ここに画像の説明を入力してください

私はそれが完璧なピクセルに近いとは思わないが、それは十分に近い:)

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.