개발자의 끄적끄적

[html/css] svg에서 text(글자) 가운데 정렬하기(수직, 수평 중앙정렬) [펌] svg에서 글자를 가운데로 정렬하는 방법을 검색해 봤는데 한국에서는 잘 안나오는거 같다. 아직 svg를 쓰는데 익숙하지는 않은것 같다. 그래서 대부분 svg예제에서보면 x,y로 위치를 줘서 배치를 하는 것을 볼 수 있다. 그런데 위치를 상대적으로 배치하는것 역시 중요하다. 그래서 수직 수평 중앙정렬을 한번 해보도록 하자. 위의 예제는 수직 중앙 정렬을 html의 svg의 text를 중앙 정렬한 예제이다. 이를 코드로 구현한 것은 아래와 같다. Lorem 위와 같은 코드를 사용하면 수직 수평 중앙 정렬을 구현할 수 있다. 왜 그런지 한번 알아보도록 하자. 일단 svg의 크기가 중요하다. 이 크기의 절반을 사용할 것..

[html/css] svg path text 사용법 Quick brown fox jumps over the lazy dog. 위 샘플 소스에서 처럼 텍스트를 띄우고 싶은 svg path 의 아이디값을 Quick brown fox jumps over the lazy dog. 파란색 블럭 친 textPath href 자리에 넣어주면 됩니다. 참고들하세요! 출처 : developer.mozilla.org/en-US/docs/Web/SVG/Element/textPath

[PHP] 한글 포함한 문자열 자르기 mb_substr [펌] PHP에서 문자열을 원하는 길이만큼 자르는 함수에는 substr이라는 함수가 있습니다. 하지만 영문 byte를 기준으로 자르기 때문에 한글 문자열을 자르려다 보면 글자가 깨지는 현상이 일어납니다. 따라서 특정 인코딩이나 한글을 포함한 문자열을 자를 때에는 mb_substr 함수를 사용합니다. PHP 한글 포함한 문자열 자르기 mb_substr 아래와 같이 호출하면 잘린 문자열을 반환합니다. mb_substr(자를 문자열 , 어디서부터 자를 것인지, 얼마나 자를건지); 어디서부터 자를 것인지 부분은 0부터 시작합니다. ex) echo mb_substr("안녕하세요.", 0, 2); 출력값 ) 안녕 사용할 특정 인코딩 방법을 지정할 수도 있습니다..

[server] Google Cloud Platform을 활용하여 평생 '무료' PC 만들기 [펌] GCP 항상 무료 등급 조건 GCP 무료 등록 사용에 대한 조건은 여기에 자세히 되어 있습니다. 평생 무료 조건은 f-micro 등급으로 미국 내 region에 만들어야 하고, 총 사용 시간이 744시간/월 까지는 무료입니다. 예를 들어, f1-micro 등급의 instance를 여러 개 만들어도 상관은 없지만 총 사용 시간 합이 '월 단위' 기준으로 744시간/월 까지는 무료입니다. HDD는 30GB/월로 표시되어 있습니다. 30GB/월 의미가 영구 디스크를 크기를 의미하는 것인지 아니면 디스크의 입출력의 총합을 의미하는지 명확하지 않습니다. VM 생성 시 기본적으로 10GB 디스크는 생성되고, 추가로 ..

[javascript/jQuery] Roulette Winning Wheel 룰렛 소스코드 모음 [펌] 1. http://serpiko.tistory.com/382 2. HTML5 Canvas: Lunch Wheel 3. http://www.dougtesting.net/winwheel 4. http://www.html5canvastutorials.com/labs/html5-canvas-wheel-of-fortune/ 출처 : zinee-world.tistory.com/134

[html/css] SVG 텍스트 [펌] 요소는 SVG 그래픽 내에 텍스트를 마크업 할 때 사용합니다. 많은 속성 옵션을 제공하며, 그레디언트, 패턴, 클리핑 패스, 마스크 또는 필터에도 적용 할 수 있습니다. SVG 그래픽은 일반 그래픽 이미지와 달리 SVG 코드 내에서 쉽게 변경하고 편집 할 수 있어 그래픽에 확장 가능한 텍스트를 포함하는 매우 강력한 기능을 제공합니다. SVG 텍스트 웹폰트 Leckerli One evening 드래그 복사가 가능한 SVG 텍스트 텍스트가 SVG 뷰포트에 잘려 보인다면? 뷰포트 크기를 조정하세요. 기본 속성 SVG 뷰포트에 요소를 배치하는 속성입니다. x, y 속성은 절대좌표입니다. 추가적으로 dx, dy 속성을 사용하면 설정된 좌표에 상대적으로 위치 이동시킬 수 있..

[sql/oracle] 서브쿼리 Subquery 활용_ 오라클 서브쿼리 [펌] 오라클 서브쿼리 활용 | 다양한 서브쿼리 활용하여 문제를 풀어보려고 합니다. 이전 글에서 서브쿼리가 무엇이고 어떤 종류가 있는지 살펴봤습니다. 그럼 좀 더 실제적으로 이 서브쿼리가 어떻게 사용되는지를 알아보려고 합니다. 한 가지 문제이지만 다양한 서브쿼리를 통해서 여러가지 쿼리문을 작성해보면서 어떤 차이가 있는지 또 결과는 어떠한지 보겠습니다. 문제 | 1. 부서별로 평균 급여보다 높은 급여를 받는 사원은? 1) 서브쿼리로 풀어보기 ? 1 2 3 4 5 6 7 8 9 --1) 서브쿼리로 풀어보기 SELECT A.ENAME, A.SAL FROM EMP A WHERE A.SAL > ( SELECT TRUNC(AVG(SAL))AS ..

[OracleDB] 오라클 (현재)날짜, 어제날짜, 년월일시분초, 날짜연산 하기 [펌] [현재 날짜를 구하고, 문자열로 출력] 1 2 3 4 SELECT SYSDATE FROM DUAL; -- 출력: 17/12/30 SELECT TO_CHAR(SYSDATE, 'YYYYMMDD') FROM DUAL; -- 출력: 20171230 Colored by Color Scripter cs [어제 날짜를 구하고 문자열로 바꿔서 출력] 1 2 3 4 SELECT SYSDATE-1 FROM DUAL; -- 출력: 17/12/29 SELECT TO_CHAR(SYSDATE-1, 'YYYYMMDD') FROM DUAL; -- 출력: 20171229 Colored by Color Scripter cs [한달 전 날짜를 구하고 ..