Soddisfa i tuoi signori Google: disegna il logo "G"


136

Scrivi un programma o una funzione che accetta un numero intero positivo N e genera un'immagine pixel N × N del logo "G" di Google secondo questa * costruzione:

Costruzione con logo "G"

Ad esempio, se N è 400, dovrebbe essere prodotto un logo di 400 × 400 pixel, con dimensioni e colori corretti:

Logo "G" esempio 400x400

Dovrebbe apparire accurato indipendentemente da quanto sia grande o piccola la N. ad esempio qui è N = 13:Logo "G" 13x13 esempio

Il tuo codice non dovrebbe essere necessario per connettersi a Internet. Ad esempio, non è consentito ridimensionare uno svg ospitato esternamente. (Tuttavia, ridimensionare uno svg codificato nel codice andrebbe bene.)

L'antialiasing può essere utilizzato o meno. Tocca a voi.

Notare che la barra orizzontale della "G" non si estende fino al bordo destro dell'immagine. Il cerchio si curva normalmente verso l'interno sul bordo destro prima di essere tagliato.

Vince il codice più breve in byte.


* La costruzione del logo è stata semplificata per questa sfida. La costruzione corretta può essere vista qui e qui .


1
C'è un minimo N? Un'immagine 1x1 produrrebbe probabilmente un risultato irriconoscibile indipendentemente da quanto sia buona la soluzione.
jpmc26,

@ jpmc26 N è un numero intero positivo, quindi minimo 1. Naturalmente un'immagine 1x1 non può essere riconoscibile, ma il significato di "Dovrebbe apparire accurato", ad esempio un'immagine nera non avrebbe senso, anche su quella scala.
Hobby di Calvin il

4
Qual è l'output previsto per un'immagine 1x1, quindi? Un singolo pixel di uno dei colori nell'immagine? Un'immagine bianca? Che dire di 2x2? Ci sono ancora più colori nell'immagine rispetto ai pixel per quella dimensione. Se un'immagine è inaccettabile su quelle scale, la sfida dovrebbe definire ciò che è e non è accettabile, dal momento che non è possibile produrre un'immagine anche avvicinandosi all'apparenza corretta, non è vero? (Se fosse la mia sfida, le escluderei per semplicità, ma la tua decisione. Dovresti anche verificare che non escluda le risposte esistenti con le nuove specifiche, credo.)
jpmc26

@ jpmc26 No. Le persone possono usare il buon senso per dire se un'immagine 1x1 o altra piccola sembra accurata.
Hobby di Calvin il

Ci è permesso scaricare un pre-made .svge codificarlo nella nostra soluzione, oppure dobbiamo farlo originariamente?
juniorRubyist,

Risposte:


55

Mathematica, 229 226 225 224 221 206 169 byte

Grazie @MartinEnder per 1 byte, @ChipHurst per 37 byte!

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

Che sfida divertente!

Spiegazione

...&~Array~4

Passa da 1 a 4 ...

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

Converti i codici esadecimali a colori in RGBColoroggetti, in modo che possano essere applicati alla grafica del logo di Google. Cambia la tavolozza dei colori nel colore <input>th.

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

Crea un rettangolo pieno (cuboide 2D), i cui angoli diagonali sono (0, -1) e (sqrt (24), 1).

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

Genera quattro quarti pieni Annulus, centrati sull'origine, con raggio interno 3 e raggio esterno 5. Non passare oltre ArcCsc@5(dove termina il segmento blu).

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

Crea un grafico con dimensioni N x N, da x = -5 a x = 5 (rimuove l'imbottitura).

Uscite

N = 10

enter image description here

N = 100

enter image description here

N = 200

enter image description here

N = 10000 (clicca sull'immagine per la risoluzione massima)

enter image description here


44

C (Windows), 311 byte

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

Prende "N" come argomento della riga di comando e disegna direttamente sullo schermo.

Un-giocato a golf:

#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! */
}

Potresti conservare 0xF48542e 0xFFFFFFin numeri interi.
Yytsi,

Quale compilatore / linker hai usato? Non funziona con mingw
vsz

@vsz Presumibilmente, il compilatore di Visual Studio.
Kroltan,

@vsz Posso compilarlo con gcc g.c -lgdi32su mingw.
jingyu9575,

2
-1>>8può anche funzionare
Mark K Cowan il

33

Python 2, 244 220 byte

usando la trasformazione di Martin Rosenau sul piano [-1,1] ^ 2 e il golf minore come rimozione 0.o parentesi

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)

Spiegazione:

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
 )

Output come PPM binario, utilizzo:

python golf_google.py > google.ppm

Esempi

  • 13

13

  • 50

50

  • 100

100

  • 1337

1337

precedente soluzione 244 byte

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

Versione beta non controllata prima dell'eliminazione if / else:

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

Hmm, non sono sicuro che 1forfunzioni.
Yytsi,

1
@TuukkaX Lo fa.
mbomb007,

Puoi includere un output di esempio?
Cyoce,

@TuukkaX grazie per l' 1foroutput del campione @Cyoce aggiunto
Karl Napf,

Tutti i decimali nel tuo codice che sono in forma 0.xpossono essere ridotti a .x:)
Yytsi

27

JavaScript (ES6), 408 ... 321 317 byte

384 383 371 367 359 327 316 308 304 byte di JavaScript + 24 13 byte per l'elemento canvas

(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 byte salvato disegnando in senso antiorario.
11 byte salvati sull'HTML grazie a Conor O'Brien.
12 byte salvati con withblocco grazie a Prinzhorn.
4 byte salvati con un migliore utilizzo di z=q-y/2.
8 byte salvati utilizzando parentNodee backgroundgrazie ad Alexis Tyler.
32 byte salvati utilizzando un disegno più preciso dell'arco / barra blu, quindi non ho più bisogno di cancellarne una parte.
11 byte salvati impostando canvas css anziché il suo parentNode grazie a Tejas Kale.
8 byte salvati usando withe mapcon una singola istruzione, `2d` invece di ('2d'), n/5anziché .2*ne inizializzando lo sfondo in prompt(...).
4 byte salvati sostituiti Math.PI/4da.7854 che sembra abbastanza precisione grazie a RobAu.


Spiegazione:

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

Le dimensioni della tela vengono inizializzate con l'input dell'utente e lo sfondo è impostato su bianco. qè inizializzato.

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

Per ogni colore disegna la parte circolare, con qualche aggiustamento per l'ultimo (blu). La barra viene disegnata per ogni colore nello stesso punto con le stesse dimensioni, quindi è visibile solo l'ultimo (blu).


2
<canvas id=d></canvas>dovrebbe funzionare e <canvas id=d>potrebbe funzionare.
Conor O'Brien,

1
Puoi perdere altri 5 caratteri sostituendo backgroundColor con background.
Alexis Tyler,

1
Usa anche d.parentNode invece di d.parentElement
Alexis Tyler,

1
Perché stai impostando le dimensioni parentNode. Basta d.stylefunziona troppo. Ciò consente(f = d.style).width = f.height = n = prompt() + 'px';
Tejas Kale,

1
Potresti usare .785398invece di Math.PI/4radere 2 byte (o più se meno precisione è ok.
RobAu

25

BBC BASIC, 177 byte

Scarica l'interprete su 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

BBC BASIC utilizza 2 unità = 1 pixel, quindi tracciamo una G di nunità raggio (= n / 2 pixel) al centro n,n.

L'idea è quella di tracciare una serie di linee radiali, cambiando colore a seconda dei casi. Si è scoperto che c'erano delle piccole lacune tra le linee a causa del troncamento dei numeri quando convertite in pixel, quindi in realtà sono tracciati triangoli sottili.

Una volta completato lo sweep delle linee, il cursore si trova nell'angolo in alto a destra dell'area blu. Viene data una singola coordinata per l'angolo diagonalmente opposto per disegnare un rettangolo per completare la forma.

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.

Bel lavoro! Ho fatto il mio in Logo usando un metodo simile prima di vedere la tua risposta. Mi hai battuto di circa 81 byte.
GuitarPicker,

21

HTML / JS, 680 624 byte

Per ottenere 624 byte, rimuovi l'ultimo ;, questo è necessario per lo snippet di seguito a causa del modo in cui importa l'HTML. Inoltre, Firefox sembra non supportare image-rendering: pixelatede necessita -moz-crisp-edgesinvece (grazie a @alldayremix !) Che rende una soluzione Firefox +7 ma questo funziona in Chrome come previsto.

Utilizza JavaScript per richiedere Ne un <style>blocco per posizionare / colorare gli elementi. Utilizza elementi HTML di base, piuttosto che applicare stili a una tela (che, a quanto pare, era un approccio molto più breve!). Questo è un approccio rinnovato che utilizza data:un'immagine di sfondo URI anziché solo elementi colorati. Ho mantenuto l'approccio precedente di seguito nel caso in cui questo nuovo funzioni su un minor numero di browser.

Pensavo che sarebbe stato molto più piccolo di quanto non fosse, ma è stato comunque un esercizio interessante!

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

Versione precedente:

<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


1
Traditore! (sto scherzando, bello ;-))
Dada,

Sul mio browser la vecchia versione mostra lievi divari tra i colori e la nuova versione offre una transizione gradiente tra i colori (Firefox 49.0.1 32-bit su Win10 x64)
alldayremix

1
@alldayremix hmmm, sembra che Firefox debba avere image-rendering: -moz-crisp-edgesinvece di pixelated. Aggiungerà una nota in tal senso. Mi piace molto lo stile del gradiente! :)
Dom Hastings,

Ho modificato l'intestazione per leggere "HTML / JS", poiché usi sia HTML che Javascript.
Mego

20

Bash con Imagemagick (ma proprio PostScript), 268 255 249 byte

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

Raddoppiato il ridimensionamento per rimuovere setlinewidth, sostituito un fattore di scala con dupe unito uno spazio nella Avariabile (impossibile con Cperché $C45viene analizzato come "la variabile C45").

Grazie a joojaa per aver suggerito queste modifiche!

Vecchia scala, 255 byte

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

Prende N come argomento solitario e restituisce o.png.

Postscript non golfato per vecchia scala

%!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

2
Puoi accorciarlo radendo un carattere dalla linea di scala, 61.2 dup scalepuoi anche aggiungere uno spazio in C C=' setrgbcolor 5 5 4 'e radere 4 spazi. Se lo progettassi a mezza scala, potresti ometterlo2 setlinewidth
joojaa,

19

MATLAB, 189 184 byte

[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])

19

Perl 5, 486 477 476 450 (+7 per -MImagerbandiera) = 457 byte

Ho salvato alcuni byte grazie a Dada usando newchiamate funzionali e sbarazzandomi delle parentesi, e usando al popposto del $ARGV[0]punto e virgola finale. Ho risparmiato ancora un po 'mettendo quello $n=popdove è usato per la prima volta, e usando la notazione dello spazio dei nomi Perl 4 con 'invece di ::.

$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')

Richiede il modulo Imager , che deve essere installato da CPAN. Accetta un numero intero come argomento della riga di comando. L'immagine non è anti-alias, quindi è un po 'brutta.

Copia il codice seguente in un file g.pl. Abbiamo bisogno di ulteriori +7 byte per il -MImagerflag, ma salva alcuni byte perché non è necessario use Imager;.

$ perl -MImager g.pl 200

Qui ci sono varie dimensioni:

N = 10

10px

N = 100

100px

N = 200

200px

Il codice completamente non golfato è semplice.

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

In precedenza questo post aveva il codice a forma di immagine di output. Dal momento che è contro le regole per il codice golf ho dovuto rimuoverlo. Vedi la cronologia delle revisioni se vuoi dare un'occhiata. Ho usato Acme :: EyeDrops per crearlo, con una forma che ho creato da un'immagine creata con il programma stesso che ho convertito in arte ASCII. Il codice che ho offuscato era già golfato, che può essere visto sostituendo il primo evalcon un print.


Molto bella! Solo alcuni dettagli sul golf: popinvece di $ARGV[0].$h=($n=pop)/2invece di$n=pop;...;$h=$n/2 . new Imager::Color"#$_"invece di Imager::Color->new("#$_"). (e hai dimenticato di eliminare l'ultimo punto e virgola). Ma ancora una volta, questi sono solo alcuni piccoli dettagli, il tuo codice è davvero fantastico! (Non avrei potuto farlo! Non lo sapevo nemmeno Imager, il che è abbastanza conveniente!)
Dada,

@Dada grazie. In realtà è un codice piuttosto semplice. Correggo così tanto le persone sull'uso della notazione del metodo su SO che è davvero difficile non farlo apposta. Ma hai ragione. Questa è stata la prima volta che ho usato Imager da solo. Penso di averlo visto nel Perl Weekly.
simbabque,

@Dada utilizzando Imager'Color con il delimitatore dello spazio dei nomi Perl 4 salva un altro byte. :)
simbabque il

In effetti, la prima volta che vedo un uso per quella sintassi! Inoltre, -MImagerè più corto di use Imager;:)
Dada,

1
@Dada lo avrei fatto comunque: P E inserendo $n=popilnew args salva le parentesi e un punto e virgola
simbabque

14

PHP + SVG, 300 byte

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

La parte di ridimensionamento è width=<?=$_GET[w]?>

Uscita per valore 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>


1
Non puoi giocare a golf lo spazio tra le doppie virgolette ( ") degli attributi e l'attributo successivo? Ad esempio <svg width="333" viewBox="0 0 10 10">-><svg width="333"viewBox="0 0 10 10">
Bojidar Marinov,

@BojidarMarinov Sì, è corretto, consente di risparmiare qualche byte. Grazie
Jörg Hülsermann,

1
Rimuovi gli spazi tra lettere e numeri nei dati del percorso: M 0,5 A 5 5 0 0 1 5,0 V 2 A 3,3 0 0 0 2,5=>M0,5A5 5 0 0 1 5,0V2A3,3 0 0 0 2,5
darrylyeo,

1
Sicuro. Inoltre, per la tua echoaffermazione, usa una stringa tra virgolette doppie per consentire le variabili inline e rimuovere il punto e virgola: echo'<use xlink:href="#c"fill="#'.$k.'"transform="rotate($v,5,5)"/>';=>echo"<use xlink:href='#c'fill='#$k'transform='rotate($v,5,5)'/>"
darrylyeo,

2
Penso che la maggior parte delle virgolette doppie possa essere rimossa in modo sicuro. Come <rect x=5 y=4 fill=#4285f4 width=4.9 height=2 />(Qui, avrai bisogno di uno spazio prima del /, però.)
Arnauld

14

Logo, 258 byte

... perché immagino che i loghi dovrebbero essere fatti usando il Logo . Questo è implementato come una funzione. L'ho sviluppato utilizzando l'interprete Logo online di Calormen.com

Inizialmente ho tentato di disegnare ogni segmento e riempirlo di vernice, ma si è rivelato più grande del previsto. Ci sono stati molti movimenti di movimento indietro e così via. Invece, ho deciso di eseguire una scansione del grafico polare, regolando il colore in base all'intestazione. La parte più difficile della matematica stava facendo la geometria per la curva nella parte superiore del rettangolo di G. Potresti tagliare alcuni decimali e avere meno precisione, ma volevo che questo fosse accurato a circa 3 cifre per adattarsi alle dimensioni dello schermo tipiche.

golfed

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

Campione

g 200 Logo Google, dimensioni 200px

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

12

JavaScript (ES7), 285 258 254 252 251 byte

Richiede la larghezza del logo (fino a 999) e lo disegna in un'area di disegno, pixel per pixel.

Modifica : la versione iniziale stava convertendo le coordinate cartesiane in coordinate (x,y)polari (r,a), ma non abbiamo davvero bisogno dell'angolo. È più semplice (e significativamente più breve) fare semplicemente confronti tra loro xe yscoprire in quale trimestre siamo.

Modifica : salvato 1 byte grazie a ETHproductions.

JS, 251 224 220 218 217 byte

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 byte

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

Versione ES6: 258 231 227 225 224 + 34 = 258 byte

Larghezza massima consigliata per lo snippet: 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>


Ho guardato attraverso la parte JavaScript e ho subito pensato "Cosa diavolo sono questi <-e gli -->operatori ??" Immagino che sia quello che succede quando hai pensato a ipotetici operatori per un linguaggio ipotetico per 24 ore ...: P
ETHproductions

@ETHproductions Stanno anche confondendo l'evidenziatore della sintassi Notepad ++ che sta interpretando -->come l'inizio (?) Di un commento html se questo viene inserito all'interno dei <script>tag in un file html.
Arnauld,

Che ci crediate o no, Notepad ++ è una specie di diritto (anche se non completamente). Dai un'occhiata all'ultimo elemento nella tabella di compatibilità ES6 .
ETHproductions

@ETHproductions - Wow. Suppongo che ci sia una buona ragione dietro questa sintassi, ma non riesco a vederlo. Grazie per averlo segnalato.
Arnauld,

Solo per questo sai, credo che sia valido solo all'inizio di una riga. 123 --> commentgenera un errore nella mia console del browser (Firefox 49), mentre --> commentnon lo fa.
ETHproductions

10

C #, 276 + 21 = 297 byte

276 byte per il metodo + 21 byte per l'importazione di 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;};

Basato sull'algoritmo di Martin Rosenau. Grazie per fare la parte difficile di trovare un modo per costruire l'immagine!

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: 26

400: 400


È possibile salvare byte non includendo la trasparenza nel codice colore, ad esempio0xFF...
TheLethalCoder

8

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

*{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>

Utilizza gradienti lineari anziché trasformazioni. Modifica: salvato 140 byte grazie a @darrylyeo. Hai salvato 20 byte utilizzando un elemento aggiuntivo anziché un gradiente. 24 byte salvati grazie a @DBS. 16 byte salvati grazie a @Hedi. Da dietro a fronte, i vari strati sono:

  • a Il cerchio blu
  • b Un rettangolo bianco per oscurare la parte sopra la barra
  • c Il quarto superiore sinistro rosso / giallo
  • d L'ottante rosso in alto a destra
  • e Il quarto in basso a sinistra giallo / verde
  • f Il quarto in basso a destra verde / blu
  • g Il cerchio bianco interno
  • h La barra blu orizzontale

Invece di ID, è necessario utilizzare i nomi degli elementi, come a, b, i, s, ecc Utilizzare *invece divper il selettore CSS.
darrylyeo,

Inoltre, utilizzare backgroundcome scorciatoia per background-image.
darrylyeo,

@darrylyeo Grazie, questo ha fatto una grande differenza per il mio punteggio, non aiutato da me a dimenticare anche di rimuovere le virgolette dal mio HTML ...
Neil,

Heh, nessun problema!
darrylyeo,

Credo che potresti salvare alcuni personaggi qua e là usando il composto border-radius. Ad esempio c{border-radius:100% 0 0;invece dic{border-top-left-radius:100%;
DBS il

8

Ruby 2.3.1, 376 359 byte

Utilizzando la gemma 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])

Esempi

50x50

50x50

250x250

inserisci qui la descrizione dell'immagine

500x500

inserisci qui la descrizione dell'immagine

1000x1000

inserisci qui la descrizione dell'immagine

Il file accetta due parametri: il primo è la dimensione e il secondo è il nome file per salvare l'output.

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

Inizialmente avevo iniziato a risolvere questo problema usando oily_png / chunky_png ma probabilmente sarebbe finito troppo complicato rispetto a RMagick. La funzione .ellipse di RMagick ha reso tutto questo un gioco da ragazzi e il lavoro principale consisteva nel mettere a punto le forme / dimensioni di tutto.

Questa è la mia prima presentazione di Code Golf (anche la prima risposta SE) e mi considero solo un po 'intermedio con Ruby. Se hai suggerimenti su miglioramenti / suggerimenti, non esitare a condividere!


Non riesco a modificare il mio post (errore 404), ma se dovessi rimuovere la riga richiesta dalla mia soluzione golf che eliminerebbe 17 byte e lo ridurrebbe a 359 byte.
metropoli,

5

Python 2, 378 373 byte

Volevo davvero farlo usando turtle. Per questo ho dovuto rispolverare la mia conoscenza della geometria, calcolando angoli e lunghezze non forniti nella descrizione della sfida.

Modifica: rimosso up(), poiché così facendo rimuove il piccolo frammento di bianco tra il verde e il blu e rende migliore il cerchio interno. Questo rallenta ancora di più il programma.

Modifica: sostituito 9*ncon 2*nper rendere più veloce. Decisi che avrebbe comunque creato un cerchio liscio.

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)

Appunti:

  1. I ninnoli usano Python 3, quindi l'input deve essere castato su int.
  2. I ciondoli diventano molto lenti nse rimossi speed(0), che ho aggiunto solo per la velocità.
  3. La lentezza del codice è principalmente dovuta al terzo parametro di circle crescita O(n), poiché determina quanti lati ha il poligono inscritto per disegnare il cerchio.

Provalo online

Ungolfed: provalo online

Curiosità: Trinket è un anagramma di Tkinter, pacchetto GUI di Python e le basi per turtle.


Inoltre, se qualcuno ha installato Python, potrebbe eseguirlo con un grande valore di nper me? Se non sembra carino, potrei aver bisogno di inserire qualche sqrts per essere più esatti. Ho arrotondato al millesimo.
mbomb007,


Sono solo i grandi valori di cui sono preoccupato. La tela su Trinket ha un massimo di 400.
mbomb007,


@daHugLenny Nessuna idea. Potrebbe essere un problema di memoria, poiché 10000 è un valore così grande.
mbomb007,

5

PHP + GD, 529 449 byte

Questo accetta un parametro della stringa di query ne genera una versione PNG del logo della dimensione specificata.

<?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:
13x13

N = 200:
200x200


La maggior parte delle costanti di stringa non richiedono virgolette. L'immagine a colori reali non ha bisogno di imagecolorallocate; dai solo 0xRRGGBB come colore alle funzioni di disegno. Ancora un po 'di golf ed è fino a 329 byte:, imagefill($i=imagecreatetruecolor($n=$argv[1],$n),0,0,($m=[4359668,3450963,0xfbbc05,0xea4335,0xffffff])[4]);for($j=-11.6;$e=[45,135,225,315][$k];$j=$e)($a=imagefilledarc)($i,$h=$n/2,$h,$n,$n,$j,$e,$m[$k++],0);$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]);imagepng($i,"g.png");eseguito con -r, prende input dalla riga di comando e output a g.png.
Tito

Mi dispiace che il mio golf precedente fosse troppo corto di due byte: [$kdeve essere [+$k. Ma anche questo dovrebbe funzionare: imagefill($i=imagecreatetruecolor($n=$argv[1],$n),0,0,$w=2**24-1);$j=-11.6;foreach([$b=4359668,3450963,0xfbbc05,0xea4335]as$c)($a=imagefilledarc)($i,$h=$n/2,$h,$n,$n,$j,$j=45+90*$k++,$c,0);$a($i,$h,$h,$p=$n*.6,$p,0,0,$w,0);imagefilledrectangle($i,$h,$n*.4,$n*.99,$p,$b);imagepng($i,"g.png");(291 byte)
Tito

@Titus Grazie. Ho scoperto dopo questa risposta che non ti serve imagecolorallocate. Aggiornerò la mia risposta con il tuo codice. Ma devi eseguire l'output sul nome del file? Non puoi semplicemente lasciare fuori il nome del file imagepnge farlo semplicemente emettere su stdout?
Kodos Johnson,

5

Java, 568 byte

Non è il linguaggio più forte per giocare a golf, ma ecco il mio tentativo più serio:

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

Uso:

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

Versione non giocata a golf - l'idea di base è quella di lavorare nel sistema di coordinate u, v ∈ [−0,5, 0,5] e calcolare la distanza e l'angolo di ciascun pixel dal centro dell'immagine:

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

}

La mia implementazione calcola e disegna pixel non elaborati. È possibile creare un'implementazione alternativa che utilizza routine grafiche di alto livello come Graphics2D e Arc2D per eseguire il disegno, in particolare con l'antialiasing.


4

Vai, 379 byte

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

La funzione f accetta un singolo intargomento (il fattore di scala) e genera un'immagine SVG ridimensionata in modo appropriato.

Provalo online su Ideone.

Esempio di output:

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

Sembra sbagliato placare i nostri signori Google in qualsiasi linguaggio di programmazione tranne il loro.


4

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*

Provalo online

Emette l'immagine in formato ASCII ppm.
Per una versione ASCII-art che è più bella da guardare nel browser, prova questo codice . Aiuta a visualizzare anche l'algoritmo.

Spiegazione:

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

3

JavaScript (ES6) (+ SVG), 293 byte, non competitivo

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)

Purtroppo l'unione della linea rotonda non è l'effetto richiesto, ma è abbastanza vicino.


3

FreeMarker + HTML / CSS, 46 + 468 = 514 byte

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}

Supponendo che il processore FreeMarker sia eseguito con un nset di variabili , che rappresenta l'input.

Spiegazione dei numeri magici:

Tutto si basa su un wrapper 10x10px, quindi ridimensionato n/10.

  • Distanza a destra della casella orizzontale blu [px]: 5 - sqrt (5 ^ 2 - 1 ^ 2) = 0.10102051443 ( Pitagora )
  • Rotazione dell'arco blu [deg]: 45 - arcSin (1/5) = 33.4630409671 ( Sine )

JSFiddle Ungolfed


Inserisci la parte CSS in un elemento di stile e usa Javascript o PHP. sostituire transform:scale(n)con transform:scale(<?=$_GET[n])?>(PHP). In javascript puoi aggiungere la parte CSS allo stile Element
Jörg Hülsermann,

Ho pensato a JS ma non volevo rovinare troppo il codice. Tuttavia, le lingue dei modelli sembrano ok, quindi sono andato con FreeMarker e ho rapidamente adattato la mia risposta, grazie.
Cedric Reichenbach,

La barra blu è troppo a destra sul lato destro che pensa
RobAu

No, puoi calcolarlo facilmente immaginando un triangolo rettangolo con lunghezze laterali 0,5, 0,1 e x, dove x indica la larghezza della barra blu o di conseguenza 0,5-x la sua distanza dalla destra. x può quindi essere determinato usando il teorema di Pitagora (vedi le spiegazioni che ho aggiunto).
Cedric Reichenbach,

JSFiddle non viene visualizzato correttamente nei due browser che ho provato (Win10 x64) - con Chrome 54.0.2840.59 m (64-bit) la barra blu si estende troppo a destra e con Firefox 49.0.1 (32 -bit) c'è una leggera lacuna a metà della parte curva blu
alldayremix

3

343 ottetti di 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"
};

Spiegazione

  • "P3" == pixmap portatile in chiaro
  • show == produce decimali ASCII che temono la corruzione UTF-8 per "\ xFF \ xFF \ xFF"
  • unlines == decimali separati in righe
  • m = n-1 per simmetria in n == lunghezza [0..m]
  • m²- (2x-m) ²- (2y-m) ²> 0 == (xm / 2) ² + (ym / 2) ² <(m / 2) ² == insideOuterCircle
  • (10x-5m) ² + (10y-5m) ²- (3m) ²> 0 == (xm / 2) ² + (ym / 2) ²> (m3 / 10) ² == outsideInnerCircle
  • mxy> 0 == x + y <m == inUpperLeft
  • xy> 0 == x> y == inUpperRight
  • 5y-2m> 0 == y> m2 / 5 == sotto GbarTop
  • 3y-5y> 0 == y <m3 / 5 == aboveGbarBot
  • 2x-m> 0 == x> m / 2 == inRightHalf
  • [234,67,53] == rosso
  • [251.188,5] == giallo
  • [52.168,83] == verde
  • [66,13.244] == blu
  • [255.255.255] == bianco

1
A meno che non si codifichi tutto con ASCII a 7 bit (cosa che si potrebbe fare poiché il punto di codice carattere più alto che si sta utilizzando è 0x7C/ 124/ |) nel qual caso sarebbero 338 setti di Haskell . Ma considerando come sono diventati standard 8-bit-a-byte nella memorizzazione dei dati negli ultimi due decenni, penso che il termine "byte" sia abbastanza specifico senza battere il cavallo morto.
Slipp D. Thompson,

3

SAS - 590 536 521 byte

Questo utilizza la funzione di annotazione GTL . L'input è specificato in una variabile macro sulla prima riga. Per qualche byte in più puoi definire il tutto come una macro. Si intrufola ancora sotto Java e alcune delle risposte HTML, anche se devi definire un modello di grafico null solo per essere in grado di tracciare qualsiasi cosa!

Ho lasciato la linea per un minimo di leggibilità, ma non li conto per il totale perché funziona senza di loro.

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

Modifica: rasato qualche altro byte tramite l'uso di macro, impostazioni predefinite e scelta degli operatori.

Modifica 2: sbarazzarsi dei do-endblocchi per la if-then-elselogica e in qualche modo funziona ancora - non capisco del tutto. Inoltre, ho scoperto la euclidfunzione!


2

SCSS - 415 byte

Accetta input come $N: 100px;e <div id="logo"></div>, non sono sicuro che questi debbano essere conteggiati nel totale ...

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

Demo su JSFiddle


1

Haskell con pacchetto JuicyPixels , 306 byte

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

Esempio di utilizzo:

main = writePng "google.png" $ f 1001

Questo potrebbe probabilmente essere migliorato. L'idea è di passare una funzione a generateImagequella che seleziona il pixel (colore davvero) che dovrebbe andare in posizione x, y. Per questo usiamo un lambda che aggiunge ncome parametro e li converte tutti in float contemporaneamente. La #funzione controlla fondamentalmente se siamo nel ring, nella barra o in nessuno dei due. Se è l'anello a cui passiamo il testimone %, se la barra restituiamo solo blu, altrimenti bianco. %controlla in quale quadrante ci troviamo e restituisce il colore appropriato se non è blu. Il blu è un caso speciale poiché dobbiamo assicurarci che non si avvolga nel rosso, quindi restituiamo il blu solo se si ytrova sotto la "linea della barra", altrimenti restituiamo il bianco. Questa è la panoramica generale.


0

Processing.py - 244 byte + 1 byte per il numero di cifre in N

Cominciamo con il codice. Questo può essere incollato nell'ambiente di elaborazione ed eseguito (modificaN per dimensioni diverse).

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)

Piccolo trucco: il cerchio che ritaglia una parte dal logo è disegnato con la tonalità di grigi 205 di Processing, che è il colore di sfondo predefinito. L'esportazione in un'immagine non sarebbe la stessa. Questo salva una chiamata abackground(255) .

Spiegazione

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

Esempi

N = 400

N = 400

N = 13 (la dimensione minima dell'elaborazione è 100x100)

inserisci qui la descrizione dell'immagine

Nota

Se ci permettiamo di modificare manualmente più valori per Nle chiamate esplicite verso setupe drawnon sono necessari ed è fino a 213 byte + 3 byte per cifra in 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)

Di per sé, questo non è un programma completo
Cows quack

Giusto. Ho rimosso il programma incompleto e l'ho sostituito con una versione completa.
PidgeyUsedFust
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.