グレート、ホワイト、ノース!


11

えっ!

カナダ人の問題は、ムースの狩猟とダムの修理で長い一日を過ごした後、キャビンへの帰り道を忘れることがあることです!私たちの便利なラップトップ(常に私たちの側にある)が、私たちを家に向ける何らかの方法を持っていたら、素晴らしいと思いませんか?さて、コンパスをコンピューターに表示すると、北を指すと最も明るくなると長い間言われてきました。私はこれをテストしたいと思いますが、ハードドライブにはすでにメープルシロップのレシピ(およびそれらは使用できません)がいっぱいになっているため、次回の旅行で持ち歩くコンパクトなプログラムが必要です。したがって、あなたの仕事は、実行時に次のコンパスローズの画像を保存または表示するプログラムを設計することです。

コンパスローズ

文字は異なるフォントである場合があります。覚えておいてください、最小は最高ですので、最小のバイト数が勝ちます!

仕様書

  • 薄紫:#9999FF
  • グレー:#E5E5E5

長さと角度

ローズ仕様

  • 角度a= 45°
  • 角度b= 90°
  • 長さc= 250単位
  • 長さd= 200単位
  • 長さe= 40単位
  • 長さf= 45単位

明確化

  • テキストは、適切なフォントである場合があり、適切な場合は、教育を受けた平均的な人間が読むことができることを示します。
  • テキストは、最も近いポイントのスパイクから3単位離れている必要があり、バラに触れてはならず、直立している必要があります。
  • バラの中心からスパイクの端点を越えて線を引く場合、+ /-2単位の精度でテキストの中心を通過する必要があります(テキストは軸aに沿って中央に配置する必要があり、ここでのaスパイクの端部を介して、など)を越えて、ページの中央から延び
  • 各文字は少なくとも15単位x 15単位であり、x / yまたはy / x比が2:1以下でなければなりません(伸縮なし-可読性)
  • 参照画像の中央に最も近いスパイクとテキストを通る薄暗い円は描画されません。
  • 画像は正方形で、少なくとも400x400ピクセルである必要があります
  • ソース内の圧縮画像は許可されていません
  • 単位は少なくとも1ピクセルである必要があります

「メープルシロップのレシピ」と言うとき、メープルシロップを作るレシピ、またはメープルシロップから原料を作るレシピを意味しますか?私はかなり彼らはかつてのだろうと想像することはできませんので...
ジョー・Z.

@JoeZ。両方、明らかに...(;
Globby

回答:


7

HTML + CSS、487 + 189 = 676

コンパスローズは、三角形の手法といくつかの基本的な変換を使用して、CSSの境界線から構築されます。文字には固定位置が与えられているので、かなり長いことがわかりました:/

以下のスニペットは、すべて収まるように縮小されています。ここでJSFiddleを確認できます。また、異なるブラウザー(異なるフォント、デフォルトのスタイルなど)で文字がどれだけうまく並んでいるかはわかりません。

html{transform:scale(0.2)}body{margin:5em}hr{margin:0;float:left;border:250px solid transparent;border-right:58px solid #E5E5E5;border-bottom:58px solid #9999FF}a{position:fixed;width:616px;font-size:4em}#a{transform:rotate(90deg)}#b{transform:rotate(270deg)}#c{transform:rotate(180deg)}#d{transform:rotate(45deg)scale(.8)}#n{top:20px;left:365px}#e{top:356px;left:700px}#s{top:700px;left:370px}#w{top:356px;left:10px}#N{top:150px;left:550px}#E{top:560px;left:550px}#S{top:560px;left:140px}#W{top:150px;left:140px}
<a id=n>N</a><a id=e>E</a><a id=s>S</a><a id=w>W</a><a id=N>NE</a><a id=E>SE</a><a id=S>SW</a><a id=W>NW</a><a id=d><hr><hr id=a><hr id=b><hr id=c></a><a><hr><hr id=a><hr id=b><hr id=c></a>


中央に小さな灰色のボックスがあり、コンパスが使用できなくなっているようです。修正できる可能性はありますか?
-Globby

1
@globbyは私には表示されません。スクリーンショットを投稿できますか?
-grc

imgur.com/dYQoLcM,sSrR94OのWindows 8.1にMozilla Firefoxの35.0を使用して
globby

@globbyは、スケーリングの影響である可能性があります。フルサイズのJSFiddleで発生しますか?
GRC

3

処理2-636

三角形の処理方法を使用してすべての三角形を描画し、その先端に文字を配置する簡単なソリューション。

int s,h,m,b,n,t;void setup(){s=400;h=s/2;b=125;t=71;n=32;m=28;size(s,s);noStroke();fill(229);t(h-t,h-t,h-m,h);t(h-t,h+t,h,h+m);t(h+t,h-t,h,h-m);t(h+t,h+t,h+m,h);fill(#9999FF);t(h-t,h-t,h,h-m);t(h-t,h+t,h-m,h);t(h+t,h-t,h+m,h);t(h+t,h+t,h,h+m);t(h-b,h,h-n,h-n);t(h+b,h,h+n,h+n);t(h,h-b,h+n,h-n);t(h,h+b,h-n,h+n);fill(229);t(h-b,h,h-n,h+n);t(h+b,h,h+n,h-n);t(h,h-b,h-n,h-n);t(h,h+b,h+n,h+n);fill(color(0));text("NW",h-t-14,h-t-2);text("NE",h+t+2,h-t-2);text("SW",h-t-14,h+t+10);text("SE",h+t,h+t+10);text("N",h-5,h-b-5);text("S",h-5,h+b+12);text("E",h+b+2,h+5);text("W",h-b-14,h+5);}void t(int a,int b,int c,int d){triangle(h,h,a,b,c,d);}

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

ここで処理を取得できます


3

PHP、628バイト

便宜上、いくつかの改行を追加しました。

$c=$z.create;$h=$c($w=250,$w);$i=$c(530,533);$a=$z.colorallocate;$a($h,$f=255,$f,$f);$a($i,$f,$f,$f);$a($h,229,229,229);$a($h,153,153,$f);
$p=$z.filledpolygon;$p($h,$o=[0,64,0,0,141,141,],3,2);$p($h,[64,0]+$o,3,1);$p($h,$o=[0,$w,0,0,57,57],3,1);$p($h,[$w,0]+$o,3,2);
$c=$z.copy;$r=$z.rotate;$c($i,$h,263,267,0,0,$w,$w);$c($i,$r($h,90,0),263,17,0,0,$w,$w);$c($i,$r($h,180,0),13,17,0,0,$w,$w);$c($i,$r($h,270,0),13,267,0,0,$w,$w);
$s=$z.string;$s($i,5,259,0,N,3);$s($i,5,259,518,S,3);$s($i,5,0,259,W,3);$s($i,5,518,259,E,3);$s($i,5,106,108,NW,3);$s($i,5,406,108,NE,3);$s($i,5,406,410,SE,3);$s($i,5,106,410,SW,3);
imagepng($i,"n.png");

で実行し-rます。n.png画像を含むファイルを作成します。単位は2ピクセルです。

私は試行錯誤によって風の座標を見つけたことを認めなければなりません、そしてそれらはおそらく少しずれています。すぐに計算を行います。しかし、私は約束します。バイトカウントは変更されません。
今、私の三角測量を発掘し、苦労していimagecopyます... なんて弱虫なのか楽しみがありました!

ゴルフで:トリックはあまりありません。しかし、これらのいくつかは大いに節約しました:

  • 関数名と2つの値を変数に割り当てると、おそらく最大の影響がありました。
    関数名を置き換えるまでは数えませんでした。
  • 配列+演算子の魔法は42バイトを与えました。
  • 画像をブラウザに送信する代わりにファイルを書き込むと、27バイト節約されました。
  • 変数の最初の使用法に割り当てを移動すると、さらにいくつかが得られました。

PHPノーススター

壊す

// create images and allocate colors
$c=imagecreate;
$h=$c($w=250,$w);   // helper image - just as large as needed or imagecopy will screw up 
$i=$c(530,533);     // main image

$a=imagecolorallocate;
$a($h,$f=255,$f,$f);    // white is 0
$a($i,$f,$f,$f);    // must be assigned to both images
$a($h,229,229,229); // grey is 1
$a($h,153,153,$f);  // purple is 2

// draw the south-east quadrant
$p=imagefilledpolygon;
// small triangle purple first
$p($h,$o=[
// point 3: 0.8*e *2
    0,64,
// point 1: center
    0,0,
// point 2: a=45 degrees, d=200 units
    141,141,// d/sqrt(2)=141.421356
],3,2);
// small triangle grey
$p($h,[64,0]+$o,3,1);

// large triangles
$p($h,$o=[
    0,$w,
    0,0,
    57,57   // e*sqrt(2)=56.5685424949
],3,1);

$p($h,[$w,0]+$o,3,2);

// create rose
$c=imagecopy;
$r=imagerotate;
$c($i,$h,263,267,0,0,$w,$w);            // copy quadrant to main image (SE)
$c($i,$r($h,90,0),263,17,0,0,$w,$w);    // rotate quadrant and copy again (NE)
$c($i,$r($h,180,0),13,17,0,0,$w,$w);    // rotate and copy again (NW)
$c($i,$r($h,270,0),13,267,0,0,$w,$w);// rotate and copy a last time (SW)

// add circle
#imageellipse($i,263,267,500,500,2);    // grey is now 2: imagecopy shuffled colors

// add names
$s=imagestring;
$s($i,5,259,  0,N,3);   // 5 is actually the largest internal font PHP provides
$s($i,5,259,518,S,3);   // unassigned colors are black
$s($i,5,  0,259,W,3);
$s($i,5,518,259,E,3);

$s($i,5,106,108,NW,3);
$s($i,5,406,108,NE,3);
$s($i,5,406,410,SE,3);
$s($i,5,106,410,SW,3);

// output
#header("Content-Type:image/png");
#imagepng($i);
imagepng($i,"n.png");

1

R、877 850 813

これをゴルフする余地はたくさんあると思うが、ルールを順守しているかどうかを確認するために何かを上げたかった。

編集:ポリゴン作成の周りのいくつかのクリーンアップを失い、アウトラインを削除するいくつかを得ました

a=45;b=90;c=125;e=40;h=c(0,0,b,a,a,0,a,b)*pi/180;i=c(0,c,c,100,e,a,(2*a^2)^.5,a);x=i*sin(h);y=i*cos(h);q=x[6:7];r=x[7:8];s=x[2:3];t=x[c(5,5)];u=y[6:7];v=y[7:8];w=y[2:3];z=y[c(5,5)];m=(s-t);n=(w-z);o=(q-r);p=(u-v);i=((q*v-u*r)*m-o*(s*z-w*t))/(o*n-p*m);x=c(x,i)[c(1,2,5,1,3,5,5,4,10,5,4,9)];y=c(y,rev(i))[c(1,2,5,1,3,5,5,4,10,5,4,9)];png("1.png",400,400);par(mar=rep(0,4));a=c(-200:200);plot(a,a,type="n");for(b in 0:3){for(i in(0:3)*3+1){a=c(1,1,1,-1,-1,-1,-1,1);polygon(x[(i):(i+3)]*a[b*2+1],y[(i):(i+3)]*a[b*2+2],border=NA,col=c("#9999FF","#E5E5E5")[(i%%6%/%4+b%%2)%%2+1]);}};for(i in 1:4){a=c("N","NE","E","SE","S","SW","W","NW");b=a[i*2-1];c=a[i*2];o=c(1,1,-1,-1,1);n=o[i+1];m=o[i];e=c(5,2)[i%%2+1];text((x[e]+(11*abs(i%%2-1)))*m,(y[e]+(12*i%%2))*n,b,cex=1.8);text((x[8]+10)*m,(y[8]+12)*n,c,cex=1.8)};dev.off()

これにより、次のpng画像が生成されます

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

私がやっていることの少しの説明

a=45;
b=90;
c=125;
e=40;
h=c(0,0,b,a,a,0,a,b)*pi/180;            # angles to known vertices in one quadrant
i=c(0,c,c,100,e,a,(2*a^2)^.5,a);        # distances to known vertices
x=i*sin(h);                             # calculate x ordinates
y=i*cos(h);                             # calculate y ordinates
q=x[6:7];                               #-----------------------
r=x[7:8];                               #
s=x[2:3];                               # Get the lines required 
t=x[c(5,5)];                            # to determine the vertex
u=y[6:7];                               # for the minor pointers
v=y[7:8];                               #
w=y[2:3];                               # 
z=y[c(5,5)];                            #------------------------ 
m=(s-t);                                # Intersect them
n=(w-z);                                # to give coordinate.
o=(q-r);                                # Just calculate the x's
p=(u-v);                                # as they can be reversed
i=((q*v-u*r)*m-o*(s*z-w*t))/(o*n-p*m);  #------------------------
x=c(x,i)[c(1,2,5,1,3,5,5,4,10,5,4,9)];      # X Triangle groups
y=c(y,rev(i))[c(1,2,5,1,3,5,5,4,10,5,4,9)]; # Y Triangle groups
png("1.png",400,400);                   # Set output to png
par(mar=rep(0,4));                      # Make margins 0
a=c(-200:200);
plot(a,a,type="n");                     # Start plot
for(b in 0:3){for(i in(0:3)*3+1){       # draw polygons, alternating colors and drawing all quadrants
a=c(1,1,1,-1,-1,-1,-1,1);
polygon(x[(i):(i+3)]*a[b*2+1],y[(i):(i+3)]*a[b*2+2],border=NA,col=c("#9999FF","#E5E5E5")[(i%%6%/%4+b%%2)%%2+1]);
}};
for(i in 1:4){                          # Add text to compass points for each quadrant
a=c("N","NE","E","SE","S","SW","W","NW");b=a[i*2-1];c=a[i*2];
o=c(1,1,-1,-1,1);n=o[i+1];m=o[i];
e=c(5,2)[i%%2+1];
text((x[e]+(11*abs(i%%2-1)))*m,(y[e]+(12*i%%2))*n,b,cex=1.8);
text((x[8]+10)*m,(y[8]+12)*n,c,cex=1.8)
};
dev.off()                               # Close PNG

1

Mathematica、347バイト

p=q={{0,0},{0,125},40{1/Sqrt[2],1/Sqrt[2]}};q[[3,1]]*=-1;m=5p[[3]]/2;s=u={{0,0},m,{32,0}};u[[3]]={0,32};r={{0,1},{-1,0}};t=Polygon[#]&;z=MatrixPower[r,#]&;a[v_]:=Table[t[z[n].#&/@v],{n,4}];i=Table[Text[#[[j]],z[j].#2],{j,4}]&;G=RGBColor["#E5E5E5"];Graphics[{i[{E,S,W,N},{0,130}],i[{NE,SE,SW,NW},1.06m],G,a[u],RGBColor["#9999FF"],a[s],a[p],G,a[q]}]

プレゴルフ:

p = q = {{0, 0}, {0, 125}, 40 {1/Sqrt[2], 1/Sqrt[2]}}; (*defining points*)
q[[3, 1]] *= -1;                                       (*for triangles*)
m = 5 p[[3]]/2;
s = u = {{0, 0}, m, {32, 0}};
u[[3]] = {0, 32};
r = {{0, 1}, {-1, 0}};                                 (*-pi/2 rotation matrix*)

t = Polygon[#] &;
z = MatrixPower[r, #] &;
a[v_] := Table[t[z[n].# & /@ v], {n, 4}];              (*rotate the sets of points*)
                                                       (*four times*)

i = Table[Text[#[[j]], z[j].#2], {j, 4}] &;
G = RGBColor["#E5E5E5"];                               (*need to use this twice*)
                                                       (*so triangles overlap*)
                                                       (*properly so define a variable*)

Graphics[{i[{E, S, W, N}, {0, 130}], 
  i[{NE, SE, SW, NW}, 1.06 m], G, a[u], RGBColor["#9999FF"], a[s], 
  a[p], G, a[q]}]

Nそして、E(自然対数の底)はMathematicaで両方の組み込み関数ですが、テキストとしてEを使用すると、画像の中に見える小文字のフォントに様式化されますが、問題はありません非常に我々は唯一のすべてのテキストに1つのフォントを使用することができると言います。それが要件である場合、置き換えE"E"、2バイトを獲得します。

Sqrt[2]Mathematicaでは2文字に定型化できるため、それぞれSqrt[2]を2文字としてカウントすると、新しいバイトカウントは349ではなく339になります。

以下の画像が生成されます。

方位磁針

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