English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

SVG 가이드

HTML SVG 튜토리얼의 목적은 여러분이 SVG를 짧은 시간 안에 시작하고 사용할 수 있도록 하며, 이 튜토리얼을 앞으로도 빠른 참조로 사용할 수 있도록 합니다. 여기서는 SVG의 예제를 최대한 많이 제공하고, SVG 사용법을 빠르게 익히는 데 도움이 되도록 할 것입니다.

SVG 소개

SVG는 확대 가능한 벡터 그래픽의 약자입니다. 이는 XML로 형상을 지정하는 그래픽 형식으로, XML이 SVG 뷰어에 의해 표시됩니다. 현재 대부분의 웹 브라우저는 SVG를 PNG, GIF, JPG와 같이 표시할 수 있습니다.
Internet Explorer 8( 및 이전 버전) 사용자는 SVG를 브라우저에서 볼 수 있도록 Adobe SVG Viewer를 설치해야 할 수 있습니다. IE 9 +Chrome와 Firefox는 SVG를 기본적으로 지원합니다.
SVG는 二차 벡터 그래픽에 사용됩니다.
SVG가 여러분이나 여러분의 프로젝트에 적합한지 모를 경우, SVG 예제 페이지를 빠르게 볼 수 있어 SVG의 기능을 빠르게 이해할 수 있습니다.

SVG 온라인 편집기 -  SVG를 온라인으로 편집할 수 있으며, SVG는 SVG 소스 코드로 변환될 수 있습니다

SVG 예제 모음  - SVG 기본 예제, SVG를 빠르게 익히는 데 도움이 됩니다

SVG 참조 매뉴얼 - SVG에서 자주 사용되는 요소를 수집하고, 요소의 속성 사용 방법을 설명합니다

SVG는 벡터 그래픽을 위해 사용됩니다

벡터 그래픽 형식으로, SVG는 벡터 유형 그래픽에 가장 유용합니다. 예를 들어:

  1. X, Y 좌표계의 二차 그래픽.

  2. 막대 그래프, 파이 그래프 등

  3. 웹, 태블릿 및 모바일 애플리케이션 및 웹앱에 사용할 수 있는 확장 가능한 아이콘과 로고.

  4. 건축 및 설계도

  5. 그리고

矢量 그래픽 형식으로, 표시할 형상은 벡터나 벡터와 유사한 구조로 저장됩니다. 다시 말해 숫자로 저장됩니다. 픽셀 단위로는 아닙니다.

“확대 가능”은 관찰자가 질을 잃지 않고 SVG 이미지를 위아래로 확대할 수 있다는 것을 의미합니다. 이는 그래픽이 숫자로而不是 픽셀로 정의되기 때문에 가능합니다. SVG 이미지를 위아래로 확대하는 것은 SVG 형상을 정의하는 숫자를 곱하거나 나누는 것에 불과합니다.

SVG 이미지에 비트맵 그래픽을 삽입할 수 있지만, SVG는 사진, 영화 등 비트맵 그래픽에 대해 최적의 선택이 아닙니다. 이는 비트맵 이미지에 형상이나 텍스트를 그리는 편리한 방법입니다.

SVG는 이미지 생성에 매우 적합합니다/그래픽/차트

SVG는 XML 형식(텍스트 형식)으로, Servlet, JSP, ASP.NET, PHP 또는 다른 웹 애플리케이션 기술에서 쉽게 생성할 수 있습니다. 이는 SVG가 컴퓨터에서 생성된 그래픽과 차트에 매우 적합하다는 것을 의미합니다. 흥미롭게도, SVG에 가장 적합한 차트 유형(그래픽, 차트, 그래프 등)을 정확하게 생성해야 합니다. 이는 SVG가 그래픽과 차트 생성에 더욱 적합하게 만듭니다.

SVG 스크립트 작성

JavaScript를 사용하여 브라우저에서 생성된 SVG 이미지를 수정할 수 있습니다. 이렇게 하면 SVG를 더 동적한 설명 또는 작은 게임에 사용할 수 있습니다.

이 가이드에 대해

이 가이드의 목적은 SVG를 짧은 시간 내에 배우고 사용할 수 있도록 하며, 이 가이드를 미래에 빠르게 참조할 수 있도록 합니다. 가능한 많은 SVG를 다루려고 시도할 것입니다. 그러나 SVG 표준의 모든 점을 다루려는 것은 아닙니다. 기본 지식에 대한 충분한 이해가 있으면, 더 고급이나 특수한 주제에 대한 SVG 표준을 쉽게 참조할 수 있습니다.