반응형 분류 전체보기135 SVG 기초 - 도형 그리기 Part 2 (타원, 직선, 다중선, 다각형 - ellipse, line, polyline, polygon) 지난 번 학습에서는 직사각형과 원을 그리는 방법을 살펴보았습니다. 이번에는 좀더 다양한 그리기 요소들을 살펴보려고 합니다. 중복되는 설명은 생략할 수 있으니 이 파트를 처음 보시는 분은 Part 1을 먼저 보고 오시는 게 좋겠습니다. 3. 타원 그리기 - Ellipse 타원(Ellipse)이 원(circle)과 다른 점이 분명히 있겠죠? 우선 전체코드를 살펴보고 아래 코드를 한번 살펴봅시다. ellipse = 타원 cx : circle x 좌표 cy : circle y 좌표 rx : radius x = x 축방향 반지름 길이 ry : raduis y = y 축방향 반지름 길이 즉, 타원은 rx와 ry를 사용한다는 것이 뽀인트! 가 될듯합니다. 중심좌표가 x200, y300이고 x축 반지름 150, y축 .. 2022. 11. 27. SVG 기초 - 도형 그리기 Part 1 (직사각형과 원, rectangle & circle) 최근에 SVG를 조금 들여다보면서 공부해보고 있습니다. 예전에는 잘 사용하지 않았는데 최근에 주목도가 매우 커진 것 같습니다. SVG는 Scalable Vector Graphics로서 브라우저에서 벡터 그래픽을 다루는 기술입니다. https://developer.mozilla.org/ko/docs/Web/SVG SVG: Scalable Vector Graphics | MDN **SVG(Scalable Vector Graphics)**는 2차원 벡터 그래픽을 서술하는 XML 기반의 마크업 언어입니다. SVG는 텍스트 기반의 열린 웹 표준 중 하나로, 모든 사이즈에서 깔끔하게 렌더링 되는 이미지를 서술하 developer.mozilla.org jpg, png, gif = 비트맵 그래픽 ai = 벡터 그래픽 .. 2022. 11. 26. 티스토리(Tistory)에 도메인(Domain) 주소 연결하기 제가 이용하는 티스토리의 주소는 kincode.tistory.com입니다. 사람이 기억하기에는 뭔가 좀 글자가 많긴합니다. 그래서!! 500원입니다! 이참에 도메인을 하나 구입해서 블로그에 연결해보기로 합니다. 먼저, 도메인이란 무엇일까요? 모든 웹사이트는 IP라는 숫자로된 주소를 갖습니다. 예를 들어, 123.123.123.123 과 같은 구조를 갖습니다.(IPv4) 이 숫자는 사람이 기억하기가 쉽지 않기 때문에 기억하기 쉬운 로 바꿔사용되는데 바로 이 것을 "도메인"이라고 부릅니다. (보다 정확한 명칭은, 도메인 네임) 예를 들어, 223.130.195.95 = naver.com 142.250.204.142 = google.com 브라우저 주소창에 223.130.195.95를 넣고 Enter를 치면 .. 2022. 11. 25. [Javascript] Number Index를 만들어 보자(ft. 숫자 카운트 애니메이션) 몇년 전부터 기업의 홈페이지 메인에 숫자 인덱스로 실적 지표를 보여주는 그런 형태가 유행하는 것 같습니다. 대충 이런 식으로요. 물론 디즈니 플러스의 경우에는 고정된 형태의 숫자이지만, 저 숫자들이 막 올라가는 형태도 많죠. 때마침 필요한 기능이기도 해서 한번 만들어 보기로 합니다. 숫자가 막 올라가는 카운트 모션 만들기 반응형을 고려해서 대략 이렇게 4개 칼럼으로 이루어진 형태를 계획하고 만들어보기로 생각해봅니다. 결과물을 예상해서 설계도를 그립니다. PPT로 만들어도 좋고 연습장에 손으로 그려도 좋습니다. 아무튼 목표점이 구체적이어야 할테니까요. 결론은 아래와 같은 모습의 형태. 처음부터 다 코딩하려면 쉽지 않죠. 일단 구글링을 시전해봅니다. 검색어를 바꿔가며 몇번 시도해봤더니 Jquery로 만들어진.. 2022. 11. 24. 이전 1 ··· 30 31 32 33 34 다음 반응형
