เขียนโปรแกรมหรือฟังก์ชั่นที่ใช้จำนวนเต็มบวก N และส่งออกภาพพิกเซล N × N ของโลโก้ "G"ของ Google ตามโครงสร้าง * นี้:

ตัวอย่างเช่นถ้า N คือ 400 โลโก้ควรมีขนาด 400 × 400 พิกเซลพร้อมขนาดและสีที่ถูกต้อง:

มันควรดูแม่นยำโดยไม่คำนึงว่า N หรือเล็กใหญ่ เช่นที่นี่คือ N = 13:

รหัสของคุณไม่จำเป็นต้องเชื่อมต่อกับอินเทอร์เน็ต ตัวอย่างเช่นไม่อนุญาตให้ปรับขนาด svg ที่โฮสต์ภายนอก (การปรับขนาด svg ที่เข้ารหัสในรหัสของคุณน่าจะใช้ได้)

อาจใช้ Anti-aliasing หรือไม่ก็ได้ มันขึ้นอยู่กับคุณ.

โปรดสังเกตว่าแถบแนวนอนของ "G" จะไม่ขยายไปจนถึงขอบด้านขวาของภาพ โดยปกติแล้วส่วนโค้งของวงกลมจะเข้ามาที่ขอบด้านขวาก่อนที่จะถูกตัดออก

รหัสที่สั้นที่สุดในหน่วยไบต์ชนะ

^{* การสร้างโลโก้นั้นง่ายขึ้นสำหรับความท้าทายนี้ การก่อสร้างที่ถูกต้องสามารถมองเห็นได้ที่นี่และที่นี่}

Mathematica, 229 226 225 224 221 206 169 ไบต์

ขอบคุณ @MartinEnder 1 ไบต์, @ChipHurst 37 ไบต์!

Graphics[{RGBColor@{"#EA4335","#FBBC05","#34A853","#4285F4"}[[#]],{0,-1}~Cuboid~{√24,1},Annulus[0{,},{3,5},{(2#-9)Pi/4,ArcCsc@5}]}&~Array~4,ImageSize->#,PlotRange->5]&

ช่างเป็นอะไรที่ท้าทาย!

คำอธิบาย

...&~Array~4

ทำซ้ำตั้งแต่ 1 ถึง 4 ...

RGBColor@{"#EA4335","#FBBC05","#34A853","#4285F4"}[[#]]

แปลงรหัสฐานสิบหกสีเป็นRGBColorวัตถุเพื่อให้สามารถนำไปใช้กับกราฟิกโลโก้ของ Google เปลี่ยนจานสีเป็น<input>สีที่

{0,-1}~Cuboid~{√24,1}

สร้างสี่เหลี่ยมผืนผ้าที่เต็มไปด้วย (ลูกบาศก์สองมิติ) ซึ่งมีมุมทแยง (0, -1) และ (sqrt (24), 1)

Annulus[0{,},{3,5},{(2#-9)Pi/4,ArcCsc@5}]}

สร้างสี่ส่วนที่เติมเต็มAnnulusโดยจัดกึ่งกลางที่จุดกำเนิดด้วยรัศมีภายใน 3 และรัศมีด้านนอก 5 อย่าวาดที่ผ่านมาArcCsc@5(ที่ส่วนสีฟ้าสิ้นสุด)

Graphics[ ... , ImageSize->#,PlotRange->5]

สร้างกราฟิกที่มีขนาด N x N จาก x = -5 ถึง x = 5 (ลบการขยาย)

เอาท์พุท

N = 10

N = 100

N = 200

N = 10,000 (คลิกที่ภาพเพื่อความละเอียดเต็ม)

C (Windows) 311 ไบต์

#include <windows.h>
main(int c,char**v){float x,y,a,b,N=atoi(*++v);HDC d=GetDC(GetDesktopWindow());for(x=0;x<N;x+=1)for(y=0;y<N;y+=1){a=2*x/N-1;b=2*y/N-1;SetPixel(d,x,y,(a>0&&a<.8&&b*b<.04)?0xF48542:(a*a+b*b>1||a*a+b*b<.36)?0xFFFFFF:(a*a<b*b)?((b<0)?3490794:5482548):(a<0)?376059:(b<-.2)?0xFFFFFF:0xF48542);}}

ใช้ "N" เป็นอาร์กิวเมนต์บรรทัดคำสั่งและดึงบนหน้าจอโดยตรง

ยกเลิกแข็งแรงเล่นกอล์ฟ:

#include <windows.h>
// atoi() will work fine without any #include file!
// -> don't #include it!

main(int c,char **v)
{
    float x,y,a,b,N=atoi(*++v);

    /* Access the screen for directly drawing! */
    HDC d=GetDC(GetDesktopWindow());

    /* Iterate over the pixels */
    for(x=0;x<N;x+=1)
        for(y=0;y<N;y+=1)
    {
        /* Convert x,y into "relative" coordinates: The image
         * is 2.0x2.0 in size with (0.0,0.0) in the center */
        a=2*x/N-1;
        b=2*y/N-1;

        /* Draw each pixel */
        SetPixel(d,x,y,
            (a>0 && a<.8 && b*b<.04)?0xF48542: /* The bar of the "G" in the middle */
            (a*a+b*b>1 || a*a+b*b<.36)?0xFFFFFF: /* Not on one of the circle segments */
            (a*a<b*b)?((b<0)?0x3543EA:0x53A834): /* Top and bottom segments */
            (a<0)?0x5BCFB: /* Left segment */
            (b<-.2)?0xFFFFFF:0xF48542); /* Right segment: A bit more complicated... */
    }

    /* Note: Under good old Windows 3.x we would require to
     * call "ReleaseDC" here; otherwise the system would
     * "crash" (however the image would have been drawn!)
     * No need for this in modern Windows versions! */
}

Python 2, 244 220 ไบต์

ใช้การแปลงของ Martin Rosenau บนเครื่องบิน [-1,1] ^ 2 และการเล่นกอล์ฟเล็ก ๆ น้อย ๆ เช่นการเอาออก0.หรือวงเล็บ

N=input()
R=[2*z/(N-1.)-1for z in range(N)]
B="\xFF"*3,"B\x85\xF4"
print"P6 %d %d 255 "%(N,N)+"".join([B[0<x<.8and.04>y*y],["4\xA8S",B[y>-.2],"\xFB\xBC\x05","\xEAC5"][(x>y)+2*(-x>y)]][.36<x*x+y*y<1]for y in R for x in R)

คำอธิบาย:

N=input()
R=[2*z/(N-1.)-1for z in range(N)]
#N*N points on the [-1,1]^2 plane

B="\xFF"*3,"B\x85\xF4"
#white and blue

print"P6 %d %d 255 "%(N,N) + "".join(
#binary PPM header
 [
  B[0<x<.8and.04>y*y],
  #blue rectangle part of the G, or white
  ["4\xA8S",B[y>-.2],"\xFB\xBC\x05","\xEAC5"][(x>y)+2*(-x>y)]
  #[green, [white,blue], yellow, red]-arcs with 4 way selector
 ]
 [.36<x*x+y*y<1]
 #radius checker, outside=0 blue rectangle or white, inside=1 colored arcs
  for y in R for x in R
  #for all points
 )

เอาต์พุตเป็นไบนารี PPM, การใช้งาน:

python golf_google.py > google.ppm

ตัวอย่าง

• 13

• 50

• 100

• 1337

โซลูชันขนาด 244 ไบต์ก่อนหน้า

N=input()
S="P6 %d %d 255 "%(N,N)
R=range(N)
B=["\xFF"*3,"B\x85\xF4"]
for Y in R:
 for X in R:y=Y-N/2;x=X-N/2;S+=[B[0<x<0.4*N and abs(y)<0.1*N],["4\xA8S",B[y>-0.1*N],"\xFB\xBC\x05","\xEAC5"][(x>y)+2*(-x>y)]][0.3*N<(y**2+x**2)**.5<0.5*N]
print S

Ungolfed beta Version ก่อนหน้าหากการคัดออก / อื่น ๆ :

N=input()
print"P3 %d %d 255 "%(N,N)
R=range
M=N/2
r="255 0 0 "
g="0 255 0 "
b="0 0 255 "
c="255 255 0 "
w="255 255 255 "
for Y in R(N):
 for X in R(N):
  y=Y-M
  x=X-M
  d=(y**2+x**2)**.5 #radius
  if 0.3*N<d<0.5*N: #inside circle
   if x>y:          #diagonal cut bottom-left to top right
    if -x>y:        #other diagonal cut
     print r
    else:
     if y>-0.1*N:print b #leave some whitespace at blue
     else: print w
   else:
     if -x>y:
      print c
     else:
      print g
  else:
   if 0<x<0.4*N and -0.1*N<y<0.1*N: #the straight part of G
    print b
   else:
    print w

JavaScript (ES6), 408 ... 321 317 ไบต์

384 383 371 367 359 327 316 308 304 ไบต์ของ JavaScript + 24 13 ไบต์สำหรับองค์ประกอบผ้าใบ

(f=d.style).width=f.height=(d.width=d.height=n=prompt(f.background='#FFF'))+'px';q=n/2;with(d.getContext`2d`)['#EA4335','#FBBC05','#34A853','#4285F4'].map((c,i)=>beginPath(lineWidth=y=n/5,strokeStyle=fillStyle=c,arc(q,q,z=q-y/2,(j=2*i+1)*(r=-.7854),(j+(i-3?2:1.256))*r,1),stroke(),fillRect(q,z,q*.98,y)))

<canvas id=d>

บันทึก 1 ไบต์โดยการวาดทวนเข็มนาฬิกา
บันทึก 11 ไบต์บน HTML ด้วย Conor O'Brien
บันทึก 12 ไบต์โดยใช้withบล็อกต้องขอบคุณ Prinzhorn
4 z=q-y/2ไบต์บันทึกด้วยการใช้งานที่ดีขึ้นของ
บันทึก 8 ไบต์โดยใช้parentNodeและbackgroundขอบคุณ Alexis Tyler
บันทึก 32 ไบต์โดยใช้การวาดเส้นโค้ง / แถบสีฟ้าที่แม่นยำยิ่งขึ้นดังนั้นฉันไม่จำเป็นต้องลบส่วนหนึ่งของมันอีกต่อไป
บันทึก 11 ไบต์ด้วยการตั้งค่า canvas css แทน parentNode ขอบคุณ Tejas Kale
8 ไบต์บันทึกไว้โดยใช้withและmapมีคำสั่งเดียว `2d` แทน('2d'), n/5แทนและเริ่มต้นพื้นหลังในการที่.2*n 4 ไบต์ถูกบันทึกแทนที่โดยprompt(...)
Math.PI/4.7854 ซึ่งดูเหมือนแม่นยำพอขอบคุณ RobAu

คำอธิบาย:

(f=d.style).width=f.height=(d.width=d.height=n=prompt(f.background='#FFF'))+'px';q=n/2 

ขนาดผ้าใบจะเริ่มต้นด้วยการป้อนข้อมูลของผู้ใช้และพื้นหลังถูกตั้งค่าเป็นสีขาว qถูกเริ่มต้น

with(d.getContext`2d`)['#EA4335','#FBBC05','#34A853','#4285F4'].map((c,i)=>beginPath(lineWidth=y=n/5,strokeStyle=fillStyle=c,arc(q,q,z=q-y/2,(j=2*i+1)*(r=-.7854),(j+(i-3?2:1.256))*r,1),stroke(),fillRect(q,z,q*.98,y)))

สำหรับแต่ละสีจะวาดส่วนวงกลมโดยมีการปรับบางอย่างสำหรับสีสุดท้าย (สีน้ำเงิน) แถบถูกวาดสำหรับแต่ละสีในสถานที่เดียวกันที่มีขนาดเท่ากันดังนั้นจึงสามารถมองเห็นได้เฉพาะแถบสุดท้าย (สีน้ำเงิน)

BBC BASIC, 177 ไบต์

ดาวน์โหลดล่ามได้ที่http://www.bbcbasic.co.uk/bbcwin/download.html

I.n
V.19;16,234,67,53,275;64272;1468;531;16,43060;83,787;16,34114;7668;n;n;
F.t=1TO8.256S.1/n
a=t*PI/4y=n*SIN(a)x=n*COS(a)V.18;t-1>>1,25,85,x*.6;y*.6;25,85,x;y;
N.PLOT101,0,-n/5

บีบีซี BASIC ใช้ 2 หน่วย = 1 พิกเซลเพื่อให้เราพล็อต G รัศมีnหน่วย (n = / 2 พิกเซล) n,nที่ศูนย์

แนวคิดคือการพล็อตชุดของเส้นเรเดียลเปลี่ยนสีตามความเหมาะสม พบว่ามีช่องว่างเล็ก ๆ ระหว่างบรรทัดเนื่องจากการตัดทอนหมายเลขเมื่อแปลงเป็นพิกเซลดังนั้นสามเหลี่ยมบาง ๆ จึงถูกพล็อตจริงแทน

เมื่อการกวาดเส้นเสร็จสิ้นเคอร์เซอร์จะอยู่ที่มุมขวาบนของพื้นที่สีน้ำเงิน พิกัดเดียวสำหรับมุมตรงข้ามในแนวทแยงมุมจะถูกกำหนดให้วาดสี่เหลี่ยมเพื่อทำให้รูปร่างสมบูรณ์

Ungolfed

INPUTn
REM reprogram pallette
VDU19;16,&EA,&43,&35,275;16,&FB,&BC,5,531;16,&34,&A8,&53,787;16,&42,&85,&F4
ORIGINn,n               :REM move origin to position n,n on screen.
FORt=1TO8.256STEP1/n    :REM from 1/8 turn to 8.56 turns in small steps
  GCOL0,t-1>>1          :REM set the colours, 0=red, 1=yellow, 2=green, 3=blue
  a=t*PI/4              :REM convert angle from 1/8 turns into radians
  y=n*SIN(a)            :REM find position of outer end of ray
  x=n*COS(a)            :REM plot to coordinates of inner and outer ends of ray
  PLOT85,x*.6,y*.6      :REM PLOT85 actually draws a triangle between the specified point              
  PLOT85,x,y            :REM and the last two points visited.
NEXT                    
PLOT101,0,-n/5          :REM once all is over, cursor is at top right corner of blue rectangle. Draw a rectangle to the bottom left corner as specified.

HTML / JS, 680 624 ไบต์

ในการรับ 624 ไบต์ให้ลบล่าสุด;นี่เป็นสิ่งจำเป็นสำหรับตัวอย่างด้านล่างเนื่องจากวิธีการนำเข้า HTML นอกจากนี้ Firefox ดูเหมือนจะไม่รองรับimage-rendering: pixelatedและต้องการ-moz-crisp-edgesแทน (ขอบคุณ@alldayremix !) ซึ่งทำให้โซลูชัน Firefox +7 ทำงานได้ใน Chrome ตามที่คาดไว้

ใช้ JavaScript เพื่อขอNและ<style>บล็อกเพื่อวางตำแหน่ง / สีองค์ประกอบ ใช้องค์ประกอบ HTML พื้นฐานแทนที่จะใช้สไตล์กับผืนผ้าใบ (ซึ่งปรากฏเป็นวิธีที่สั้นกว่ามาก!) นี่เป็นวิธีการปรับปรุงใหม่โดยใช้data:ภาพพื้นหลัง URI แทนองค์ประกอบที่มีสี ฉันได้รักษาแนวทางก่อนหน้าไว้ด้านล่างในกรณีที่วิธีการใหม่นี้ใช้ได้กับเบราว์เซอร์น้อย

ฉันคิดว่ามันจะเล็กกว่านี้อีกแล้ว แต่มันก็เป็นการออกกำลังกายที่น่าสนใจอย่างไรก็ตาม

<body id=x onload=x.style.fontSize=prompt()+'px'><u><a></a><b></b><i></i><s><style>u,a,b,i,s{position:relative;display:block}b,i,s{position:absolute}a,u{width:1em;height:1em}a,b{border-radius:50%}a{image-rendering:pixelated;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAFklEQVQI12N45Wzq1PqF4fceVpMVwQAsHQYJ1N3MAQAAAABJRU5ErkJggg)no-repeat;background-size:100%;transform:rotate(45deg)}b{top:.2em;left:.2em;width:.6em;height:.6em;background:#fff}i{border-top:.4em solid transparent;border-right:.4em solid#fff;top:0;right:0}s{top:.4em;right:.1em;width:.4em;height:.2em;background:#4285f4;

รุ่นก่อนหน้า:

<body id=x onload=x.style.fontSize=prompt()+'px'><a b><b l style=padding-left:.5em></b><b y></b><b g></b></a><i style=height:.4em></i><i style="background:#ea4335;border-radius:0 1em 0 0;transform-origin:0%100%;transform:rotate(-45deg)"></i><i b z style=top:.2em;left:.2em;width:.6em;height:.6em></i><i l z style="top:.4em;height:.2em;border-radius:0 2%10%0/0 50%50%0;width:.4em"><style>*{position:relative;background:#fff}a,b,i{display:block;float:left;width:.5em;height:.5em}a{height:1em;width:1em;transform:rotate(45deg);overflow:hidden}i{position:absolute;top:0;left:.5em}[b]{border-radius:50%}[g]{background:#34a853}[l]{background:#4285f4}[y]{background:#fbbc05}[z]{z-index:1

Bash with Imagemagick (แต่จริงๆแล้ว Postscript), 268 255 249 bytes

C=' setrgbcolor 2.5 2.5 2'
A=' arc stroke '
echo "%!PS
122.4 dup scale
.92 .26 .21$C 45 136$A.98 .74 .02$C 135 226$A.20 .66 .33$C 225 316$A.26 .52 .96$C 315 371$A
4.95 2.5 moveto
2.5 2.5 lineto
stroke"|convert - -crop 612x612+0+180 -scale "$1" o.png

สองเท่าปรับเพื่อลบsetlinewidthแทนที่ปัจจัยระดับหนึ่งdupและรวมพื้นที่เข้าไปในAตัวแปร (ไม่สามารถด้วยCเพราะ$C45จะแยกเป็น "ตัวแปรC45")

ขอบคุณ joojaa ที่แนะนำการแก้ไขเหล่านี้!

สเกลเก่า 255 ไบต์

C=' setrgbcolor 5 5 4'
A=' arc stroke'
echo "%!PS
61.2 61.2 scale
2 setlinewidth
.92 .26 .21$C 45 136$A
.98 .74 .02$C 135 226$A
.20 .66 .33$C 225 316$A
.26 .52 .96$C 315 371$A
9.9 5 moveto
5 5 lineto
stroke"|convert - -crop 612x612+0+180 -scale "$1" o.png

ใช้Nเป็นอาร์กิวเมนต์ lone และส่งออกไปยัง o.png

Postscript Ungolfed สำหรับระดับเก่า

%!PS
% Scale so default page has width of 10
61.2 61.2 scale
2 setlinewidth
% Red arc
.92 .26 .21 setrgbcolor
5 5 4 45 136 arc
stroke
% Yellow arc
.98 .74 .02 setrgbcolor
5 5 4 135 226 arc
stroke
% Green arc
.20 .66 .33 setrgbcolor
5 5 4 225 316 arc
stroke
% Blue arc
.26 .52 .96 setrgbcolor
5 5 4 315 371 arc
% Blue in-tick
9.9 5 moveto
5 5 lineto
stroke

MATLAB, 189 184 ไบต์

[X,Y]=meshgrid(-5:10/(input("")-1):5);[A,R]=cart2pol(-X,Y);I=round(A*2/pi+3);I(R<3)=1;I(X>0&Y.^2<1)=5;I(R>5)=1;image(I)
colormap([1,1,1;[234,67,53;251,188,5;52,168,83;66,133,244]/255])

ungolfed

[X,Y]=meshgrid(-5:10/(input("")-1):5);    % coordinates in 10th of image width
[A,R]=cart2pol(-X,Y);                     % angle and radius
I=round(A*2/pi+3); % map [0-45,45-135,135-225,225-315,315-360] to [1,2,3,4,5]
I(R<3)=1;                                 % clear inner pixels
I(X>0&Y.^2<1)=5;                          % draw horizontal line
I(R>5)=1;                                 % clear outer pixels
image(I)
colormap([1,1,1;[234,67,53;251,188,5;52,168,83;66,133,244]/255])

Perl 5, 486 477 476 450 (+7 สำหรับการ-MImagerตั้งค่าสถานะ) = 457 bytes

ฉันบันทึกไม่กี่ไบต์ด้วย Dada โดยใช้การnewโทรแบบใช้งานได้และกำจัด parens และใช้popแทน$ARGV[0]semicolon สุดท้าย ฉันบันทึกบางมากขึ้นโดยการวางที่$n=popที่มันใช้เป็นครั้งแรกและโดยใช้ Perl 4 สัญกรณ์ namespace กับแทน'::

$i=new Imager xsize=>$n=pop,ysize=>$n;$h=$n/2;$s=$n*.6;$f=$n*.4;$c='color';($b,$r,$y,$g,$w)=map{new Imager'Color"#$_"}qw(4285f4 ea4335 fbbc05 34a853 fff);$i->box(filled=>1,$c,$w);$i->arc($c,$$_[0],r=>$h,d1=>$$_[1],d2=>$$_[2])for[$b,315,45],[$r,225,315],[$y,135,225],[$g,45,135];$i->circle($c,$w,r=>$n*.3,filled=>1);$i->box($c,$b,ymin=>$f,ymax=>$s,xmin=>$h,xmax=>$n*.9,filled=>1);$i->polygon($c,$w,x=>[$n,$n,$s],y=>[0,$f,$f]);$i->write(file=>'g.png')

มันต้องการโมดูลImagerซึ่งจะต้องมีการติดตั้งจาก CPAN รับจำนวนเต็มหนึ่งตัวเป็นอาร์กิวเมนต์บรรทัดคำสั่ง ภาพไม่ได้ต่อต้านนามแฝงดังนั้นมันจึงน่าเกลียดเล็กน้อย

คัดลอกรหัสด้านล่างลงในไฟล์ g.pl เราจำเป็นต้องเพิ่มอีก 7 ไบต์สำหรับ-MImagerธง use Imager;แต่ประหยัดไม่กี่ไบต์เพราะเราไม่จำเป็นต้อง

$ perl -MImager g.pl 200

นี่คือขนาดต่างๆ:

N = 10

N = 100

N = 200

รหัส ungolfed สมบูรณ์ตรงไปข้างหน้า

use Imager;
my $n = $ARGV[0];
my $i = Imager->new( xsize => $n, ysize => $n );

my $blue   = Imager::Color->new('#4285f4');
my $red    = Imager::Color->new('#ea4335');
my $yellow = Imager::Color->new('#fbbc05');
my $green  = Imager::Color->new('#34a853');
my $white  = Imager::Color->new('white');

$i->box( filled => 1, color => 'white' );
$i->arc( color => $blue,   r => $n / 2, d1 => 315, d2 => 45 );     # b
$i->arc( color => $red,    r => $n / 2, d1 => 225, d2 => 315 );    # r
$i->arc( color => $yellow, r => $n / 2, d1 => 135, d2 => 225 );    # y
$i->arc( color => $green,  r => $n / 2, d1 => 45,  d2 => 135 );    # g
$i->circle( color => $white, r => $n * .3, filled => 1 );
$i->box(
    color  => $blue,
    ymin   => $n * .4,
    ymax   => $n * .6,
    xmin   => $n / 2,
    xmax   => $n * .9,
    filled => 1
);
$i->polygon( color => $white, x => [ $n, $n, $n * .6 ], y => [ 0, $n * .4, $n * .4 ] );
$i->write( file => 'g.png' );

โพสต์ก่อนหน้านี้มีรหัสรูปร่างเหมือนภาพที่ส่งออก เนื่องจากผิดกฎสำหรับรหัสกอล์ฟฉันต้องลบมัน ดูประวัติการแก้ไขหากคุณต้องการดู ฉันใช้Acme :: EyeDropsเพื่อสร้างด้วยรูปร่างที่ฉันสร้างขึ้นจากภาพที่สร้างขึ้นด้วยโปรแกรมที่ฉันแปลงเป็นศิลปะ ASCII รหัสผมที่ยุ่งเหยิงถูกแข็งแรงเล่นกอล์ฟอยู่แล้วซึ่งสามารถมองเห็นได้โดยการเปลี่ยนครั้งแรกด้วยevalprint

PHP + SVG, 300 ไบต์

<svg width=<?=$_GET["w"]?> viewBox=0,0,10,10><def><path id=c d=M0,5A5,5,0,0,1,5,0V2A3,3,0,0,0,2,5 /></def><?foreach(["fbbc05"=>-45,"ea4335"=>45,"4285f4"=>168.5,"34a853"=>225]as$k=>$v)echo"<use xlink:href=#c fill=#$k transform=rotate($v,5,5) />"?><rect x=5 y=4 fill=#4285f4 width=4.9 height=2 /></svg>

ส่วนที่ปรับคือ width=<?=$_GET[w]?>

เอาต์พุตสำหรับค่า 333

<svg width="333" viewBox="0 0 10 10">
<def><path id="c" d="M 0,5 A 5 5 0 0 1 5,0 V 2 A 3,3 0 0 0 2,5"/></def>
<use xlink:href="#c" fill="#fbbc05" transform="rotate(-45,5,5)"/><use xlink:href="#c" fill="#ea4335" transform="rotate(45,5,5)"/><use xlink:href="#c" fill="#4285f4" transform="rotate(168.5,5,5)"/><use xlink:href="#c" fill="#34a853" transform="rotate(225,5,5)"/>
<rect x="5" y="4" fill="#4285f4" width="4.9" height="2"/>
</svg>

โลโก้ขนาด 258 ไบต์

... เพราะฉันคิดว่าโลโก้ที่ควรจะทำโดยใช้รูปแบบ สิ่งนี้ถูกนำไปใช้เป็นฟังก์ชั่น ฉันพัฒนามันโดยใช้ล่ามโลโก้ออนไลน์ของ Calormen.com

ตอนแรกฉันพยายามวาดแต่ละเซ็กเมนต์และทาสีให้เต็ม แต่กลับกลายเป็นว่าใหญ่กว่าที่คาดไว้ มีการย้อนรอยการเคลื่อนไหวที่สูญเปล่าไปมากและเช่นนั้น แต่ฉันตัดสินใจทำการกวาดกราฟขั้วโลกโดยปรับสีตามหัวเรื่อง ส่วนที่ยากขึ้นของคณิตศาสตร์กำลังทำรูปทรงเรขาคณิตสำหรับส่วนโค้งที่ด้านบนของรูปสี่เหลี่ยมผืนผ้าของ G คุณสามารถตัดทอนทศนิยมบางส่วนและมีความแม่นยำน้อยลง แต่ฉันต้องการให้มันถูกต้องถึง 3 หลักเพื่อรองรับขนาดหน้าจอทั่วไป

แข็งแรงเล่นกอล์ฟ

to g:n
ht
make"a arctan 1/:n
seth 78.46
repeat 326.54/:a[make"h heading
pu fd:n/2 pd
setpc"#4285f4
if:h>135[setpc"#34a853]if:h>225[setpc"#fbbc05]if:h>315[setpc"#ea4335]bk:n*.2 pu bk:n*.3
rt:a]home bk:n*.1
filled"#4285f4[fd:n/5 rt 90 fd:n*.49 rt 90 fd:n/5]end

ตัวอย่าง

g 200

Ungolfed

to g :n ; Draw a G of width/height n

hideturtle ; Hide the turtle, since she's not part of the Google logo

;Determine the proper size of the angle to rotate so that the circle stays smooth within 1 px at this size
make "a arctan 1/:n 

setheading 78.46 ; Point toward the top corner of the upcoming rectangle

repeat 326.54 / :a [ ; Scoot around most of the circle, :a degrees at a time

  make"h heading ; Store heading into a variable for golfing purposes

  ; Position pen at the next stroke
  penup 
  forward :n / 2
  pendown

  ; Set the pen color depending on the heading
  setpencolor "#4285f4
  if :h > 135 [ setpencolor "#34a853]
  if :h > 225 [ setpencolor "#fbbc05]
  if :h > 315 [ setpencolor "#ea4335]

  ; Draw the stroke and return to center
  back :n * .2
  penup
  back :n * .3

  right :a ; Rotate to the next sweep heading
]

; Draw the rectangle
home
back :n * .1
filled "#4285f4 [
  forward :n/5
  right 90
  forward :n * .49 ;This is just begging to be :n / 2 but I couldn't bring myself to do it.  Proper math is more like :n * (sqrt 6) / 5
  right 90 
  forward :n / 5
]

end

JavaScript (ES7), 285 258 254 252 251 ไบต์

แสดงความกว้างของโลโก้ (สูงสุด 999) และวาดลงบนผืนผ้าใบ, พิกเซลต่อพิกเซล

แก้ไข : เวอร์ชันเริ่มต้นกำลังแปลงพิกัดคาร์ทีเซียนเป็นพิกัด(x,y)โพลาร์(r,a)แต่เราไม่ต้องการมุม มันง่ายกว่า (และสั้นกว่าอย่างมาก) เพียงเปรียบเทียบระหว่างxและyเพื่อค้นหาว่าเราอยู่ย่านไหน

แก้ไข : บันทึก 1 ไบต์ขอบคุณ ETHproductions

JS, 251 224 220 218 217 ไบต์

for(w=x=y=prompt(c=c.getContext`2d`)/2;r=(x*x+y*y)**.5,q=(x<y)+2*(x<-y),c.fillStyle='#'+'4285F434A853EA4335FBBC05FFF'.substr(x>0&r<w&y*y<w*w/25?0:r<w*.6|r>w|!q&y<0?24:q*6,6),x-->-w||y-->-(x=w);)c.fillRect(x+w,y+w,1,1)

HTML, 34 ไบต์

<canvas id=c width=999 height=999>

รุ่น ES6: 258 231 227 225 224 + 34 = 258 ไบต์

ความกว้างสูงสุดที่แนะนำสำหรับตัวอย่าง: 190

for(w=x=y=prompt(c=c.getContext`2d`)/2;r=Math.pow(x*x+y*y,.5),q=(x<y)+2*(x<-y),c.fillStyle='#'+'4285F434A853EA4335FBBC05FFF'.substr(x>0&r<w&y*y<w*w/25?0:r<w*.6|r>w|!q&y<0?24:q*6,6),x-->-w||y-->-(x=w);)c.fillRect(x+w,y+w,1,1)

<canvas id=c width=999 height=999>

C #, 276 + 21 = 297 ไบต์

276 ไบต์สำหรับวิธีการ + 21 ไบต์สำหรับการนำเข้า System.Drawing

using System.Drawing;n=>{var q=new Bitmap(n,n);uint W=0xFFFFFFFF,B=0xFF4285F4;for(int y=0,x=0;x<n;y=++y<n?y:x-x++){float a=2f*x/n-1,b=2f*y/n-1,c=b*b;q.SetPixel(x,y,Color.FromArgb((int)(a>0&&a<.8&&c<.04?B:a*a+c>1||a*a+c<.36?W:a*a<c?b<0?0xFFEA4335:0xFF34A853:a<0?0xFFFBBC05:b<-.2?W:B)));}return q;};

ขึ้นอยู่กับอัลกอริทึมของ Martin Rosenau ขอบคุณที่ทำส่วนที่ยากขึ้นมาเพื่อสร้างภาพ!

using System.Drawing;             // Import System.Drawing
/*Func<int, Bitmap>*/ n =>
{
    var q = new Bitmap(n, n);     // Create nxn output bitmap
    uint W=0xFFFFFFFF,            // White, color used more than once
         B=0xFF4285F4;            // Blue, color used more than once
    for(int y = 0, x = 0; x < n;  // Loops for(x=0;x<N;x+=1) for(y=0;y<N;y+=1) combined
        y = ++y < n               // Increment y first until it reaches n
            ? y           
            : x - x++)            // Then increment x, resetting y
    {
        float a = 2f * x / n - 1, // Relative coords. Refer to Martin Rosenau's
              b = 2f * y / n - 1, // for what this magic is.
              c = b * b;          // b*b is used more than 3 times

        q.SetPixel(x, y,          // Set pixel (x,y) to the appropriate color
            Color.FromArgb((int)  // Cast uint to int :(
            ( // Here lies magic
                a > 0 && a < .8 && c < .04 
                    ? B
                    : a * a + c > 1 || a * a + c < .36
                        ? W
                        : a * a < c 
                            ? b < 0 
                                ? 0xFFEA4335
                                : 0xFF34A853
                            : a < 0
                                ? 0xFFFBBC05
                                : b < -.2
                                    ? W
                                    : B
            )));
    }
    return q;
};

26:

400:

JS / CSS / HTML (+ JS), 40 0 + 701 644 617 593 + 173 90 97 121 = 914 774 754 730 714 ไบต์

*{position:absolute}a,h{height:100%;background:#4285F4}a,g{width:100%;border-radius:100%}h{width:30%;height:20%;top:40%}b,c,d,e,f{width:50%;height:50%}b,d,f,h{left:50%}e,f{top:50%}c{border-radius:100% 0 0;background:linear-gradient(45deg,#FBBC05 50%,#EA4335 50%)}d{border-radius:0 100% 0 0;background:linear-gradient(-45deg,transparent 50%,#EA4335 50%)}e{border-radius:0 0 0 100%;background:linear-gradient(-45deg,#34A853 50%,#FBBC05 50%)}f{border-radius:0 0 100%;background:linear-gradient(45deg,#34A853 50%,#4285F4 50%)}b,g{height:40%;background:#FFF}g{width:60%;height:60%;top:20%;left:20%}

<input oninput=with(o.style)height=width=value+"px"><o id=o><a></a><b></b><c></c><d></d><e></e><f></f><g></g><h></h></o>

ใช้การไล่ระดับสีเชิงเส้นมากกว่าการแปลง แก้ไข: บันทึกแล้ว 140 ไบต์ด้วย @darrylyeo บันทึก 20 ไบต์โดยใช้องค์ประกอบพิเศษแทนการไล่ระดับสี บันทึก 24 ไบต์ด้วย @DBS บันทึกแล้ว 16 ไบต์ขอบคุณ @Hedi จากด้านหลังไปข้างหน้าเลเยอร์ต่างๆ ได้แก่ :

• a วงกลมสีน้ำเงิน
• b สี่เหลี่ยมสีขาวเพื่อปิดบังส่วนบนแถบ
• c มุมบนซ้ายสีแดง / เหลือง
• d octant สีแดงด้านบนขวา
• e ด้านล่างซ้ายสีเหลือง / เขียว
• f ไตรมาสล่างขวาสีเขียว / น้ำเงิน
• g วงกลมสีขาวด้านใน
• h แถบสีน้ำเงินแนวนอน

Ruby 2.3.1, 376 359 bytes

ใช้อัญมณี RMagick

d,f=$*[0].to_i,2.5;g,h,e,c=d-1,d/2,Magick::ImageList.new,Magick::Draw.new;e.new_image(d,d);c.stroke('#EA4335').fill_opacity(0).stroke_width(d*0.2).ellipse(h,h,g/f,g/f,225,315).stroke('#FBBC05').ellipse(h,h,g/f,g/f,135,225).stroke('#34A853').ellipse(h,h,g/f,g/f,45,135).stroke('#4285F4').ellipse(h,h,g/f,g/f,348.5,45).line(h,h,d*0.989,h).draw(e);e.write($*[1])

ตัวอย่าง

50x50

250x250

500x500

1000x1000

ไฟล์ใช้พารามิเตอร์สองตัวอันแรกคือมิติข้อมูลและตัวที่สองเป็นชื่อไฟล์เพื่อบันทึกเอาต์พุต

Ungolfed

require "RMagick"

# Take the user's input for dimension
d = $*[0].to_i

e = Magick::ImageList.new
e.new_image(d, d)

c = Magick::Draw.new

# Start by setting the color to red
c.stroke('#EA4335')

  # set opacity to nothing so that we don't get extra color.
  .fill_opacity(0)

  # set thickness of line.
  .stroke_width(d*0.2)

  # #ellipse creates an ellipse taking
  # x, y of center
  # width, height,
  # arc start, arc end
  .ellipse(d / 2, d / 2, (d - 1) / 2.5, (d - 1) / 2.5, 225, 315)

  # change to yellow and draw its portion
  .stroke('#FBBC05')
  .ellipse(d / 2, d / 2, (d - 1) / 2.5, (d - 1) / 2.5, 135, 225)

  # change to green and draw its portion
  .stroke('#34A853')
  .ellipse(d / 2, d / 2, (d - 1) / 2.5, (d - 1) / 2.5, 45, 135)

  # change to blue and draw its portion
  .stroke('#4285F4')
  .ellipse(d / 2, d / 2, (d-1)/2.5, (d - 1)/2.5, 348.5, 45)

  # creates the chin for the G
  .line(d/2, d/2, d*0.99, d/2)

  # draws to the created canvas
  .draw(e)

# save out the file
# taking the filename as a variable saves a byte over
# "a.png"
e.write($*[1])

ตอนแรกฉันเริ่มแก้ปัญหานี้โดยใช้ oily_png / chunky_png แต่นั่นอาจจะซับซ้อนเกินไปเมื่อเทียบกับ RMagick ฟังก์ชั่น. วงรีของ RMagick ทำให้เป็นเรื่องง่ายและงานหลักคือการปรับแต่งรูปร่าง / ขนาดของทุกสิ่ง

นี่คือการส่งรหัสกอล์ฟครั้งแรกของฉัน (คำตอบ SE แรกเช่นกัน) และฉันคิดว่าตัวเองค่อนข้างปานกลางกับทับทิม หากคุณมีข้อมูลเกี่ยวกับการปรับปรุง / เคล็ดลับโปรดแบ่งปัน!

Python 2, 378 373 ไบต์

turtleผมอยากที่จะทำเช่นนี้โดยใช้ ฉันต้องปัดความรู้เรื่องเรขาคณิตออกไปเพื่อคำนวณมุมและความยาวที่ไม่ได้ระบุไว้ในคำอธิบายการท้าทาย

แก้ไข: ลบออกup()เนื่องจากการทำเช่นนั้นจะลบเศษสีขาวเล็กน้อยระหว่างสีเขียวและสีน้ำเงินและทำให้วงในดูดีขึ้น สิ่งนี้ทำให้โปรแกรมช้าลงมากยิ่งขึ้น

แก้ไข: แทนที่9*nด้วย2*nเพื่อให้เร็วขึ้น ฉันตัดสินใจแล้วว่ามันจะยังคงสร้างวงกลมที่ราบรื่น

from turtle import*
n=input()
C=circle
F=fill
K=color
q=90
w="white"
t=n*.3
lt(45)
def P(c,x,A):K(c);F(1);fd(x);lt(q);C(x,A,2*n);F(0);goto(0,0);rt(q)
for c in"#EA4335","#FBBC05","#34A853":P(c,n/2,q)
P(w,t,360)
K("#4285F4")
F(1)
fd(n/2)
lt(q)
a=11.537
C(n/2,45+a,2*n)
seth(0)
bk(.489*n)
rt(q)
fd(n/5)
lt(q)
fd(t)
F(0)
bk(t)
K(w)
F(1)
fd(.283*n)
lt(94-2*a)
C(t,a-45,2*n)
F(0)

หมายเหตุ:

1. เครื่องประดับเล็ก ๆ ใช้ Python 3 ดังนั้นอินพุตจะต้องถูกส่งไปยัง int
2. เล็กไปจริงๆช้าขนาดใหญ่nหากคุณลบspeed(0)ซึ่งผมเพิ่มเฉพาะสำหรับความเร็ว
3. ความเชื่องช้าของรหัสส่วนใหญ่เกิดจากพารามิเตอร์ที่สามของการcircleเติบโตO(n)เนื่องจากมันกำหนดจำนวนของรูปหลายเหลี่ยมที่ถูกจารึกไว้สำหรับการวาดวงกลม

ลองออนไลน์

Ungolfed: ลองออนไลน์

สนุกจริง: Trinketเป็นแอนนาแกรมของTkinterแพคเกจ GUI turtleหลามและมูลนิธิเพื่อการ

PHP + GD, 529 449 ไบต์

ใช้พารามิเตอร์สตริงแบบสอบถามnและส่งออกโลโก้ PNG รุ่นที่มีขนาดที่ระบุ

<?php $n=$_GET['n'];$h=$n/2;$c='imagecolorallocate';$a='imagefilledarc';$i=imagecreatetruecolor($n,$n);$m=[$c($i,66,133,244),$c($i,52,168,83),$c($i,251,188,5),$c($i,234,67,53),$c($i,255,255,255)];imagefill($i,0,0,$m[4]);$j=-11.6;foreach([45,135,225,315]as$k=>$e){$a($i,$h,$h,$n,$n,$j,$e,$m[$k],0);$j=$e;}$a($i,$h,$h,$n*.6,$n*.6,0,0,$m[4],0);imagefilledrectangle($i,$h,$h-$n*.1,$h+$h*.98,$h+$h*.2,$m[0]);header('Content-Type:image/png');imagepng($i);

Ungolfed:

<?php

$n = $_GET['n'];$h=$n/2;
$c = 'imagecolorallocate';$a='imagefilledarc';
$i = imagecreatetruecolor($n,$n);

// Create array of colors
$m=[$c($i,66,133,244),$c($i,52,168,83),$c($i,251,188,5),$c($i,234,67,53),$c($i,255,255,255)];

// Fill background with white
imagefill($i, 0, 0, $m[4]);

// Create four arcs
$j=-11.6;
foreach([45,135,225,315]as$k=>$e){
    $a($i, $h, $h, $n, $n, $j, $e, $m[$k], 0);$j=$e;
}

// Hollow out the center and fill with white
$a($i, $h, $h, $n*.6,$n*.6,0,0,$m[4],0);

// create the horizontal bar
imagefilledrectangle($i,$h,$h-$n*.1,$h+$h*.98,$h+$h*.2,$m[0]);

// Output
header('Content-Type: image/png');
imagepng($i);

N = 13:

N = 200:

Java, 568 ไบต์

ไม่ใช่ภาษาที่แข็งแกร่งที่สุดสำหรับการเล่นกอล์ฟ แต่นี่คือความพยายามอย่างจริงจังของฉัน:

import java.awt.image.*;class G{public static void main(String[]b)throws Exception{int n=Integer.parseInt(b[0]),x,y,a,c;BufferedImage p=new BufferedImage(n,n,BufferedImage.TYPE_INT_RGB);for(y=0;y<n;y++){for(x=0;x<n;x++){double u=(x+.5)/n-.5,v=.5-(y+.5)/n,r=Math.hypot(u,v);a=(int)(Math.atan2(v,u)*4/Math.PI);c=0xFFFFFF;if(0<u&u<.4&-.1<v&v<.1)c=0x4285F4;else if(r<.3|r>.5);else if(a==0&v<.1)c=0x4285F4;else if(a==1|a==2)c=0xEA4335;else if(a==-1|a==-2)c=0x34A853;else if(a!=0)c=0xFBBC05;p.setRGB(x,y,c);}}javax.imageio.ImageIO.write(p,"png",new java.io.File("G.png"));}}

การใช้งาน:

> javac G.java
--> Compiles to G.class
> java G 400
--> Writes G.png in current working directory

รุ่นที่ไม่ตีกอล์ฟ - แนวคิดพื้นฐานคือการทำงานในระบบพิกัด u, v ∈ [−0.5, 0.5] และคำนวณระยะทางและมุมของแต่ละพิกเซลจากศูนย์ภาพ:

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

public class Google {

    public static void main(String[] args) throws IOException {
        int n = Integer.parseInt(args[0]);
        int[] pixels = new int[n * n];

        for (int y = 0; y < n; y++) {
            for (int x = 0; x < n; x++) {
                double u = (x + 0.5) / n - 0.5;
                double v = 0.5 - (y + 0.5) / n;
                double r = Math.hypot(u, v);
                int a = (int)(Math.atan2(v, u) * 4 / Math.PI);
                int c = 0xFFFFFF;
                if (0 < u && u < 0.4 && Math.abs(v) < 0.1)
                    c = 0x4285F4;
                else if (r < 0.3 || r > 0.5)
                    /*empty*/;
                else if (a == 0 && v < 0.1)
                    c = 0x4285F4;
                else if (a == 1 || a == 2)
                    c = 0xEA4335;
                else if (a == -1 || a == -2)
                    c = 0x34A853;
                else if (a != 0)
                    c = 0xFBBC05;
                pixels[y * n + x] = c;
            }
        }

        BufferedImage image = new BufferedImage(n, n, BufferedImage.TYPE_INT_RGB);
        image.setRGB(0, 0, n, n, pixels, 0, n);
        ImageIO.write(image, "png", new File("G.png"));
    }

}

การนำไปใช้ของฉันคำนวณและดึงพิกเซลแบบดิบ เป็นไปได้ที่จะสร้างการใช้งานทางเลือกที่ใช้งานกราฟิกขั้นสูงเช่นGraphics2DและArc2Dเพื่อทำการวาดภาพโดยเฉพาะอย่างยิ่งกับการลดรอยหยัก

ไป 379 ไบต์

import ."fmt"
func f(a int)(s string){
m:=map[string]float64{"fbbc05":-45,"ea4335":45,"4285f4":168.5,"34a853":225}
for k,v:=range m{s+=Sprintf("<use xlink:href=#c fill=#%v transform=rotate(%v,5,5) />",k,v)}
return Sprintf("<svg width=%v viewBox=0,0,10,10><def><path id=c d=M0,5A5,5,0,0,1,5,0V2A3,3,0,0,0,2,5 /></def>%v<rect x=5 y=4 fill=#4285f4 width=4.9 height=2 /></svg>",a,s)}

ฟังก์ชั่นfใช้การintโต้แย้งเดียว(ตัวประกอบสเกล) และปรับขนาดภาพ SVG ให้เหมาะสม

ลองออนไลน์ได้ที่ Ideone

ตัวอย่างผลลัพธ์:

<svg width=333 viewBox=0,0,10,10><def><path id=c d=M0,5A5,5,0,0,1,5,0V2A3,3,0,0,0,2,5 /></def><use xlink:href=#c fill=#34a853 transform=rotate(225,5,5) /><use xlink:href=#c fill=#fbbc05 transform=rotate(-45,5,5) /><use xlink:href=#c fill=#ea4335 transform=rotate(45,5,5) /><use xlink:href=#c fill=#4285f4 transform=rotate(168.5,5,5) /><rect x=5 y=4 fill=#4285f4 width=4.9 height=2 /></svg>

ดูเหมือนว่าผิดที่จะเอาใจ Google overlords ของเราในภาษาการเขียนโปรแกรมใด ๆ ยกเว้นของพวกเขาเอง

CJam, 141

ri:M.5*:K5/:T;'P3NMSMN255NM2m*[K.5-_]f.-{:X:mh:IK>0{X~0<\zT>|{IT3*<0{X~>X~W*>:Z2+{Z{X0=TW*>}4?}?}?}1?}?}%"^^G_8:nEhB%P9IW@zA"102b256b3/f=:+N*

ลองออนไลน์

แสดงภาพในรูปแบบ ASCII ppm
สำหรับรุ่น ASCII-art ที่ดูดีกว่าในเบราว์เซอร์ลองใช้รหัสนี้ มันช่วยให้เห็นภาพอัลกอริทึมด้วย

คำอธิบาย:

ri:M                 read input, convert to int and store in M
.5*:K                multiply by 0.5 and store in K (M/2)
5/:T;                divide by 5 and store in T (M/10) and pop
'P3NMSMN255N         ppm header (N=newline, S=space)
M2m*                 generate all pixel coordinates - pairs of numbers 0..M-1
[K.5-_]              push the center (coordinates K-0.5, K-0.5)
f.-                  subtract the center from every pixel
{…}%                 map (transform) the array of coordinate pairs
  :X                 store the current pair in X
  :mh:I              calculate the hypotenuse of X (distance from the center)
                      and store in I
  K>0                if I>K (outside the big circle), push 0
  {…}                else…
    X~               dump X's coordinates (row, column)
    0<               check if the column is <0
    \zT>|            or the absolute value of the row is >T
    {…}              if true (outside the G bar)…
      IT3*<0         if I<T*3 (inside the small circle) push 0
      {…}            else (between the circles)…
        X~>          dump X and check if row>column (diagonal split)
        X~W*>:Z      also check if row>-column (other diagonal) and store in Z
                      (W=-1)
        2+           if in lower-left half, push Z+2 (2 for left, 3 for bottom)
        {…}          else (upper-right half)…
          Z{…}       if it's in the right quadrant
            X0=      get the row coordinate of X
            TW*>     compare with -T, resulting in 0 (above the bar) or 1
          4          else (top quadrant) push 4
          ?          end if
        ?            end if
      ?              end if
    1                else (inside the G bar) push 1
    ?                end if
  ?                  end if
"^^G … @zA"          push a string containing the 5 colors encoded
102b                 convert from base 102 to a big number
                      (ASCII values of chars are treated as base-102 digits)
256b                 convert to base 256, splitting into 15 bytes
3/                   split into triplets (RGB)
f=                   replace each generated number (0..4)
                      with the corresponding color triplet
:+N*                 join all the triplets, and join everything with newlines

JavaScript (ES6) (+ SVG), 293 ไบต์, ไม่ใช่การแข่งขัน

document.write(`<svg id=o width=${prompt()} viewbox=0,0,50,50>`);m=`39,11`;`#EA433511,11
#FBBC0511,39
#34A85339,39
#4285F445,25L25,25`.replace(/(.{7})(.{5})(.*)/g,(_,s,t,u)=>m=document.write(`<path stroke=${s} d=M${m}A20,20,0,0,0,${t+u} fill=none stroke-width=10 stroke-linejoin=round />`)||t)

น่าเสียดายที่การเข้าร่วมเส้นกลมนั้นไม่ใช่เอฟเฟกต์ที่ต้องการ แต่มันค่อนข้างใกล้เคียง

FreeMarker + HTML / CSS, 46 + 468 = 514 ไบต์

HTML:

<div><div></div><div></div><span></span></div>

CSS:

div div,div span{position:absolute}div{width:10px;height:10px;box-sizing:border-box;transform-origin:top left;position:relative;transform:scale(${n*.1})}div div{border:2px solid;border-radius:9px;border-color:transparent #4285f4 transparent transparent;transform:rotate(33.4630409671deg);transform-origin:center}div div+div{border-color:#ea4335 transparent #34a853 #fbbc05;transform:none}div span{display:block;top:4px;bottom:4px;left:5px;right:.1px;background:#4285f4}

สมมติว่าตัวประมวลผล FreeMarker ดำเนินการกับnชุดตัวแปรซึ่งเป็นตัวแทนอินพุต

คำอธิบายของหมายเลขมายากล:

ทุกอย่างจะขึ้นอยู่กับเสื้อคลุม 10x10px n/10ปรับขนาดแล้วโดย

• ระยะทางจากด้านขวาของกล่องแนวนอนสีน้ำเงิน [px]: 5 - sqrt (5 ^ 2 - 1 ^ 2) = 0.10102051443 ( Pythagoras )
• การหมุนส่วนโค้งสีน้ำเงิน [องศา]: 45 - ส่วนโค้ง (1/5) = 33.4630409671 ( ไซน์ )

JSFiddle ที่อัปโหลด

343 octets ของ Haskell

roman@zfs:~$ cat ppmG.hs
ppmG n='P':unlines(map show([3,n,n,255]++concat[
 case map signum[m^2-(2*x-m)^2-(2*y-m)^2,
 (10*x-5*m)^2+(10*y-5*m)^2-(3*m)^2,
 m-x-y,x-y,5*y-2*m,3*m-5*y,2*x-m]of
 1:1:1:1:_->[234,67,53]
 1:1:1:_->[251,188,5]
 [1,_,_,_,1,1,1]->[66,133,244]
 1:1:_:1:1:_->[66,133,244]
 1:1:_:_:1:_->[52,168,83]
 _->[255,255,255]|m<-[n-1],y<-[0..m],x<-[0..m]]))
roman@zfs:~$ wc ppmG.hs
 10  14 343 ppmG.hs
roman@zfs:~$ ghc ppmG.hs -e 'putStr$ppmG$42'|ppmtoxpm
ppmtoxpm: (Computing colormap...
ppmtoxpm: ...Done.  5 colors found.)

/* XPM */
static char *noname[] = {
/* width height ncolors chars_per_pixel */
"42 42 6 1",
/* colors */
"  c #4285F4",
". c #EA4335",
"X c #FBBC05",
"o c #34A853",
"O c #FFFFFF",
"+ c None",
/* pixels */
"OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO",
"OOOOOOOOOOOOOOO............OOOOOOOOOOOOOOO",
"OOOOOOOOOOOO..................OOOOOOOOOOOO",
"OOOOOOOOOO......................OOOOOOOOOO",
"OOOOOOOOO........................OOOOOOOOO",
"OOOOOOOO..........................OOOOOOOO",
"OOOOOOO............................OOOOOOO",
"OOOOOOXX..........................OOOOOOOO",
"OOOOOXXXX........................OOOOOOOOO",
"OOOOXXXXXX.......OOOOOOOO.......OOOOOOOOOO",
"OOOXXXXXXXX....OOOOOOOOOOOO....OOOOOOOOOOO",
"OOOXXXXXXXXX.OOOOOOOOOOOOOOOO.OOOOOOOOOOOO",
"OOXXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO",
"OOXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO",
"OOXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO",
"OXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO",
"OXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXOOOOOOOOOOOO                    O",
"OXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOO         O",
"OXXXXXXXXXOOOOOOOOOOOOOOOOOOOOOO         O",
"OOXXXXXXXXXOOOOOOOOOOOOOOOOOOOO         OO",
"OOXXXXXXXXXOOOOOOOOOOOOOOOOOOOO         OO",
"OOXXXXXXXXXXOOOOOOOOOOOOOOOOOO          OO",
"OOOXXXXXXXXooOOOOOOOOOOOOOOOOoo        OOO",
"OOOXXXXXXXoooooOOOOOOOOOOOOooooo       OOO",
"OOOOXXXXXooooooooOOOOOOOOoooooooo     OOOO",
"OOOOOXXXoooooooooooooooooooooooooo   OOOOO",
"OOOOOOXoooooooooooooooooooooooooooo OOOOOO",
"OOOOOOOooooooooooooooooooooooooooooOOOOOOO",
"OOOOOOOOooooooooooooooooooooooooooOOOOOOOO",
"OOOOOOOOOooooooooooooooooooooooooOOOOOOOOO",
"OOOOOOOOOOooooooooooooooooooooooOOOOOOOOOO",
"OOOOOOOOOOOOooooooooooooooooooOOOOOOOOOOOO",
"OOOOOOOOOOOOOOOooooooooooooOOOOOOOOOOOOOOO",
"OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO"
};

คำอธิบาย

• "P3" == pixmap แบบพกพาธรรมดา
• แสดง == สร้างทศนิยม ASCII ที่กลัวความเสียหายของ UTF-8 สำหรับ "\ xFF \ xFF \ xFF"
• unlines == แยกทศนิยมออกเป็นเส้น
• m = n-1 สำหรับความสมมาตรใน n == ความยาว [0..m]
• m²- (2x-m) ²- (2y-m) ²> 0 == (xm / 2) ² + (ym / 2) ² <(m / 2) ² == ข้างในข้างนอกวงกลม
• (10x-5m) ² + (10y-5m) ²- (3m) ²> 0 == (xm / 2) ² + (ym / 2) ²> (m3 / 10) ² == ภายนอกInCircle
• mxy> 0 == x + y <m == inUpperLeft
• xy> 0 == x> y == inUpperRight
• 5y-2m> 0 == y> m2 / 5 == BelowGbarTop
• 3y-5y> 0 == y <m3 / 5 == aboveGbarBot
• 2x-m> 0 == x> m / 2 == inRightHalf
• [234,67,53] == สีแดง
• [251,188,5] == สีเหลือง
• [52,168,83] == สีเขียว
• [66,13,244] == สีน้ำเงิน
• [255,255,255] == ขาว

SAS - 590 536 521 ไบต์

นี้ใช้สิ่งอำนวยความสะดวก GTL หมายเหตุ อินพุตถูกระบุในตัวแปรแมโครบนบรรทัดแรก สำหรับไบต์พิเศษไม่กี่คุณสามารถกำหนดสิ่งทั้งหมดเป็นแมโคร มันยังย่องอยู่ด้านล่าง Java และคำตอบ HTML เล็กน้อยแม้ว่าคุณจะต้องกำหนดเทมเพลตกราฟที่เป็นโมฆะเพื่อให้สามารถพล็อตอะไรก็ได้!

ฉันปล่อยให้ตัวแบ่งบรรทัดสำหรับการอ่านจำนวนเล็กน้อย แต่ฉันไม่ได้นับจำนวนรวมทั้งหมดเนื่องจากมันทำงานโดยไม่มีพวกเขา

%let R=;
%let F=FILLCOLOR;
ods graphics/width=&R height=&R;
proc template;
define statgraph a;
begingraph;
annotate;
endgraph;
end;
data d;
retain FUNCTION "RECTANGLE" DISPLAY "FILL" DRAWSPACE "graphPERCENT";
length &F$8;
_="CX4285F4";
P=100/&R;
HEIGHT=P;
width=P;
do i=1to &R;
x1=i*P;
U=x1-50;
do j=1to &R;
y1=j*P;
V=y1-50;
r=euclid(U,V);
&F="";
if 30<=r<=50then if V>U then if V>-U then &F="CXEA4335";
else &F="CXFBBC05";
else if V<-U then &F="CX34A853";
else if V<10then &F=_;
if &F>'' then output;
end;
end;
x1=65;
y1=50;
width=30;
height=20;
&F=_;
output;
proc sgrender sganno=d template=a;

แก้ไข: ลบข้อมูลออกไปอีกสองสามไบต์ผ่านการใช้แมโครมาโครการตั้งค่าเริ่มต้นและตัวเลือกของผู้ให้บริการ

แก้ไข 2:กำจัดdo-endบล็อคสำหรับif-then-elseลอจิกและมันก็ยังใช้งานได้ - ฉันไม่เข้าใจเลย นอกจากนี้ฉันค้นพบeuclidฟังก์ชั่น!

SCSS - 415 ไบต์

ใช้อินพุตเป็น$N: 100px;และ<div id="logo"></div>ไม่แน่ใจว่าควรนับรวมทั้งหมดหรือไม่ ...

$d:$N*.6;$b:$d/3;#logo{width:$d;height:$d;border:$b solid;border-color:#ea4335 transparent #34a853 #fbbc05;border-radius:50%;position:relative;&:before,&:after{content:'';position:absolute;right:-$b;top:50%;border:0 solid transparent}&:before{width:$b*4;height:$d/2;border-width:0 $b $b 0;border-right-color:#4285f4;border-bottom-right-radius:50% 100%}&:after{width:$N/2;margin:-$b/2 0;border-top:$b solid #4285f4}}

การสาธิตเกี่ยวกับ JSFiddle

Haskellพร้อมแพ็คเกจJuicyPixelsขนาด 306 ไบต์

import Codec.Picture
p=PixelRGB8
c=fromIntegral
b=p 66 133 244
w=p 255 255 255
(n%x)y|y<=x,x+y<=n=p 234 67 53|y>x,x+y<=n=p 251 188 5|y>x,x+y>n=p 52 168 83|y>=0.4*n=b|1>0=w
(n#x)y|d<=h,d>=0.3*n=n%x$y|x>=h,d<=h,abs(y-h)<=n/10=b|1>0=w where h=n/2;d=sqrt$(x-h)^2+(y-h)^2
f n=generateImage(\x y->c n#c x$c y)n n

ตัวอย่างการใช้งาน:

main = writePng "google.png" $ f 1001

สิ่งนี้อาจปรับปรุงได้ แนวคิดคือการส่งผ่านฟังก์ชั่นเพื่อgenerateImageเลือกพิกเซล (สีจริง ๆ ) ที่ควรอยู่ในตำแหน่ง x, y สำหรับการที่เราใช้แลมบ์ดาที่เพิ่มnเป็นพารามิเตอร์และแปลงพวกมันทั้งหมดให้ลอยในเวลาเดียวกัน #ฟังก์ชั่นโดยทั่วไปจะตรวจสอบว่าเรากำลังอยู่ในแหวน, บาร์หรือไม่ ถ้ามันเป็นวงแหวนที่เราส่งกระบองไป%ถ้าบาร์ที่เราเพิ่งกลับเป็นสีน้ำเงินหรือสีขาว %ตรวจสอบว่าเราอยู่ในด้านใดและส่งคืนสีที่เหมาะสมหากไม่ใช่สีน้ำเงิน Blue เป็นกรณีพิเศษเนื่องจากเราต้องตรวจสอบให้แน่ใจว่าไม่ได้ล้อมรอบเป็นสีแดงดังนั้นเราจะส่งกลับสีน้ำเงินถ้าyต่ำกว่า "บาร์ไลน์" มิฉะนั้นเราจะส่งคืนสีขาว นั่นคือภาพรวมทั่วไป

กำลังดำเนินการ Processing.py - 244 ไบต์ + 1 ไบต์สำหรับจำนวนตัวเลขใน N

เริ่มจากโค้ดกันก่อน สิ่งนี้สามารถวางในสภาพแวดล้อมการประมวลผลและวิ่ง (เปลี่ยนNขนาดแตกต่างกัน)

N=400
n=N/2
f=fill
a=['#34A853','#FBBC05','#EA4335','#4285F4']
def setup():
 size(N,N);noStroke()
def draw():
 for i in 1,3,5,7: f(a[i/2]);arc(n,n,N,N,i*PI/4+[0,.59][i>6],(i+2)*PI/4)
 f(205);ellipse(n,n,.6*N,.6*N);f(a[3]);rect(n,n-.1*N,.98*n,.2*N)

โกงขนาดเล็ก: วงกลมที่ตัดส่วนหนึ่งออกจากโลโก้นั้นถูกวาดในเฉดสีเทาระดับการประมวลผล 205 ซึ่งเป็นสีพื้นหลังเริ่มต้น การส่งออกสิ่งนี้ไปยังรูปภาพจะไม่เหมือนกัน background(255)นี้ช่วยประหยัดโทรไป

คำอธิบาย

N=400                 # set size
n=N/2                 # precompute center point
f=fill                # 3 usages, saves 3 bytes
a=['#34A853','#FBBC05','#EA4335','#4285F4']
                      # list of colors
def setup():          # called when starting sketch
 size(N,N)            # set size
 noStroke()           # disable stroking
def draw():           # drawing loop
 for i in 1,3,5,7:    # loop over increments of PI/4
  f(a[i/2])           # set fill color using integer
                      # division
  arc(n,n,N,N,i*PI/4+[0,.59][i>6],(i+2)*PI/4)
                      # draw a pizza slice between
                      # two coordinates. The 
                      #     [0,.59][i>6]
                      # accounts for the white part
 f(205)               # set fill color to Processing's
                      # default background
 ellipse(n,n,.6*N,.6*N)
                      # cut out center
 f(a[3])              # set fill to blue
 rect(n,n-.1*N,.98*n,.2*N)
                      # draw the straight part

ตัวอย่าง

N = 400

N = 13 (ขนาดต่ำสุดของการประมวลผลคือ 100x100)

บันทึก

ถ้าเราช่วยให้เราสามารถแก้ไขได้ด้วยตนเองในหลายค่าสำหรับการNโทรที่ชัดเจนsetupและdrawไม่จำเป็นต้องมีและมันจะลงไป 213 ไบต์ + 3 Nไบต์ต่อหลักใน

N=200
size(200,200)
n=N/2
f=fill
a=['#34A853','#FBBC05','#EA4335','#4285F4']
noStroke()
for i in 1,3,5,7:f(a[i/2]);arc(n,n,N,N,i*PI/4+[0,.59][i>6],(i+2)*PI/4)
f(205);ellipse(n,n,.6*N,.6*N);f(a[3]);rect(n,n-.1*N,.98*n,.2*N)