'round'에 해당되는 글 2건

 
  1. 2012.11.14 [ADOBE/PHOTOSHOP] 어도비 포토샵 CS6 로 라운드 렉트 이미지 만들기 (둥근모서리 이미지), 리그오브레전드 이미지
  2. 2012.08.31 [JavaScript/JS] 자바스크립트 소숫점 반올림하기 Math.round()
2012. 11. 14. 19:16 ADOBE CREATIVE SUITE
[ADOBE/PHOTOSHOP] 어도비 포토샵 CS6 로 라운드 렉트 이미지 만들기 (둥근모서리 이미지), 리그오브레전드 이미지

포토샵 CS6를 이용해서

이렇게 모서리 부분이 둥그스름한 이미지를 만들어 보겠습니다.

제가 좋아하는 게임 리그오브레전드의 로고 입니다. (전적링크 걸껍니다. 사이트왼편에 보이심?)

 

이 예제는 거의 모든 포토샵으로도 따라할 수 있습니다.

 

 

1. 원본이미지를 포토샵에 불러들입니다.

마스터이와 리그오브레전드의 로고가 같이 있는 배경용 이미지 입니다.

 

 

2. M(선택)툴로 로고부분을 적당히 드래그합니다.

메뉴 > Image > Crop을 선택하면 아래처럼 로고만 남고 나머지가 잘려나갑니다.

 

 

3. 위에서 자른 사이즈는 마우스로 드래그했기때문에 정확하지 않습니다.

메뉴 > Image > Canvas Size를 선택하면 아래와 같은 창이 나타납니다. (단축키 Ctrl+Alt+C)

전 200x75pixel의 배너 이미지를 만들겁니다. 그래서 200, 75를 입력했습니다.

 

 

4. 레이어창에서 Background레이어에 마우스 오른쪽 > Duplicate Layer를 선택합니다.

 

 

5. 복제한 레이어는 놔두고 Background 레이어를 제거합니다.

Background레이어를 선택하고 휴지통아이콘(우측하단)을 클릭하여 레이어를 삭제합니다.

 

 

6. 캔바스크기를 다시 늘립니다. (적당히 늘려주세요. 상하, 좌우 둘다 좀더 크게)

이전작업에서 레이어를 안백그라운드 레이어로 맹그러놨기때문에 투명 바탕이 나와야합니다.

 

 

7. 레이어탭에서 Background copy를 Ctrl+클릭 합니다.

그러면 아래처럼 이미지부분만 선택됩니다.

 

 

8. 메뉴 > Select > Modify > Smooth를 선택합니다.

저는 5를 입력했습니다. (적당한값을 입력하세요. 이미지가 크면 더 크게 줄수도 있고.. 여러번해보면서 적당한 값을 찾으세요.)

 

 

9. Smooth가 적용된 상태로 메뉴 > Select > Inverse (단축키 Shift+Ctrl+I)

Delete키를 눌러 각 모서리부분을 제거합니다.

 

 

10. 메뉴 > Image > Canvas Size를 선택해서,

원래 이미지 사이즈로 되돌립니다.

 

 

11. 완성된 이미지를 저장하세요.

투명을 지원하는 웹용 포멧은 .png나 .gif입니다.

 

 

 

 

댓글을 달아 주세요

2012. 8. 31. 13:49 COMPUTER/JAVASCRIPT, JQUERY
[JavaScript/JS] 자바스크립트 소숫점 반올림하기 Math.round()

자바스크립트로 소숫점 숫자 표현하는 방법입니다.

 

Math.round(값) - 값을 반올림합니다.

Math.ceil(값) - 값을 올림합니다.

Math.floor(값) - 값을 내림합니다.

Math.parseInt(값) - 값을 정수로 바꿉니다. (값이 소숫점이 있는 숫자일 경우엔 소숫점 이하를 잘라버립니다. 내림)

 

10의 n승을 곱하고 반올림 한 결과를 다시 10의 n승으로 나누면

원하는 소숫점 자릴수를 표현할 수 있습니다.

 

<body/>
<script>

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'반올림 (소숫점0번째까지)<br/>'+
	'Math.round(45.67890) : '+
	Math.round(45.67890);

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'올림 (소숫점0번째까지)<br/>'+
	'Math.ceil(45.67890) : '+
	Math.ceil(45.67890);

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'내림 (소숫점0번째까지)<br/>'+
	'Math.floor(45.67890) : '+
	Math.floor(45.67890);

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'내림 (소숫점0번째까지)<br/>'+
	'parseInt(45.67890) : '+
	parseInt(45.67890);


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 2번째까지 반올림<br/>'+
	'Math.round(123.4567) : '+
	Math.round(123.4567*100)/100;

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 4번째까지 올림<br/>'+
	'Math.ceil(123.4567) : '+
	Math.ceil(123.4567*10000)/10000;

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 4번째까지 내림<br/>'+
	'Math.floor(123.4567) : '+
	Math.floor(123.4567*10000)/10000;

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 3번째까지 내림<br/>'+
	'parseInt(123.4567) : '+
	parseInt(123.4567*1000)/1000;


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점있는 문자열을 숫자(float)로 변환<br/>'+
	'parseFloat("12.3456789") : '+
	parseFloat("12.3456789");


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'앞에 0이 있는 문자열을 숫자(float)로 변환<br/>'+
	'parseInt("098.765") : '+
	parseInt("098.765");

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'앞에 0이 있는 문자열을 숫자(integer)로 변환<br/>'+
	'parseInt("011") : '+
	parseInt("011");


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'문자를 숫자(float)로 변환<br/>'+
	'parseFloat("안두리") : '+
	parseFloat("안두리");

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'문자를 숫자(integer)로 변환<br/>'+
	'parseInt("ahndoori") : '+
	parseInt("ahndoori");

</script>

댓글을 달아 주세요

최근에 올라온 글

최근에 달린 댓글