뭐라고!

알다시피, 캐나다인의 문제는 때로는 긴 하루의 무스 사냥과 댐 수리 후 우리가 오두막으로 돌아가는 길을 잊어 버린다는 것입니다. 편리한 노트북 (항상 우리 편에있는)이 우리를 집으로 안내 할 수있는 방법이 있다면 좋지 않을까요? 컴퓨터에 나침반을 표시하면 북쪽을 가리킬 때 가장 밝을 것이라고 오랫동안 들었습니다. 나는 이것을 테스트하고 싶지만 내 하드 드라이브에는 이미 메이플 시럽 레시피가 가득 차 있기 때문에 다음 여행에 가져갈 소형 프로그램이 필요합니다. 그래서 당신의 임무는 나에게 실행시 다음 나침반 장미의 이미지를 저장하거나 표시하는 프로그램을 설계하는 것입니다.

글자가 다른 글꼴로되어있을 수 있습니다. 가장 적은 것이 가장 좋으므로 바이트 수가 가장 적습니다.

명세서

그림 물감

• 연한 자주색 : # 9999FF
• 회색 : # E5E5E5

길이와 각도

• 각도 a= 45 °
• 각도 b= 90 °
• 길이 c= 250 개
• 길이 d= 200 개
• 길이 e= 40 대
• 길이 f= 45 대

설명

• 텍스트는 임의의 적절한 글꼴 일 수 있으며 , 적절한 경우 교육을받은 평균적인 사람이 읽을 수 있음을 나타냅니다.
• 텍스트는 가장 가까운 지점에서 스파이크에서 3 단위 떨어져 있어야하고 장미에 닿아서는 안되며 똑바로 세워야합니다.
• 장미의 중심에서 스파이크의 끝점을 넘어 선을 그리면 +/- 2 단위의 정밀도로 텍스트의 중심을 가로 질러 교차해야합니다 (텍스트는 축을 따라 중앙에 있어야합니다 a. 어디a 페이지 중간에서 급상승 끝까지 또는 그 이상으로 확장되는 )
• 각 문자는 15 단위 이상 15 단위 이상이어야하며 x / y 또는 y / x 비율이 2 : 1 이하이어야합니다 (신축성 없음 – 가독성)
• 더 긴 스파이크를 통과하는 희미한 원과 참조 이미지의 가운데에 가장 가까운 텍스트는 그려지지 않습니다.
• 이미지는 정사각형이어야하며 400x400 픽셀 이상이어야합니다.
• 소스 내의 압축 이미지가 허용되지 않습니다
• 단위는 1 픽셀 이상이어야합니다

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>

처리 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);}

여기에서 처리 할 수 있습니다

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 픽셀입니다.

나는 시행 착오에 의해 바람의 좌표를 찾았 음을 인정해야하며, 아마도 조금 벗어난 것입니다. 곧 계산을 수행합니다. 그러나 나는 약속한다 : 그들은 바이트 수를 변경하지 않을 것이다.
나의 trignonometry를 발굴하고 고군분투하는 imagecopy것에 대해 나의 재미를 가지고 있었다 . ..이 얼마나 시시한!

골프 : 많은 트릭; 그러나이 몇 사람은 많이 절약했습니다.

• 함수 이름과 두 값 중 하나를 변수에 할당하면 아마도 가장 큰 영향을 미쳤을 것입니다.
  함수 이름을 바꾸기 전에는 계산조차하지 않았습니다.
• 배열 +연산자 의 마술 은 42 바이트를 주었다.
• 이미지를 브라우저로 전송하는 대신 파일을 쓰면 27 바이트가 절약됩니다.
• 할당을 변수의 첫 번째 사용법으로 옮기는 것이 몇 가지 더 도움이되었습니다.

고장

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

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

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(자연 로그의 기본) 티카 모두 내장 기능이 있지만 텍스트 E는 소문자로 양식지기로는 이미지에서 볼 수 있지만 문제가되지 않는 글꼴 확실히 우리는 모든 텍스트에 대해 하나 개의 글꼴을 사용할 수 있습니다 말한다. 그 요구 사항 인 경우 교체 E와 "E"나는 2 바이트를 얻을 수 있습니다.

Sqrt[2]Mathematica에서 두 문자로 양식화 할 수 있으므로 각 Sqrt[2]문자를 두 문자로 계산하면 새 바이트 수는 349 대신 339입니다.

아래 이미지가 생성됩니다.