Svg 는 어떤 형식입니까?
자세한 내용은 다음과 같습니다.
1.SVG 는 웹 및 기타 환경에서 다양한 그래픽을 표시하는 XML 기반 벡터 그래픽 형식입니다. 이를 통해 확장 가능한 2 차원 그래픽을 작성하고 CSS 또는 JavaScript 를 통해 조작할 수 있습니다.
2.SVG 는 현재 웹 개발의 확장성, 응답성, 상호 작용, 프로그래밍 가능성, 성능 및 액세스 가능성에 대한 요구 사항에 가장 잘 대응할 수 있습니다.
3. SVG 는 벡터 기반이므로 도면을 확대할 때 충실도를 낮추거나 잃지 않습니다. 더 큰 크기를 수용하기 위해 다시 그려질 뿐이므로 응답 웹 디자인과 같은 다중 컨텍스트 시나리오에 적합합니다.
이점:
1. 확장성 및 대응 능력
SVG 는 모양, 숫자 및 좌표 (픽셀 격자가 아님) 를 사용하여 브라우저에서 그래픽을 렌더링하므로 해상도에 관계없이 무한한 확장성을 제공합니다. 자세히 생각해 보면 펜이나 타블렛을 사용하든 원을 만드는 명령은 같지만 비율이 달라진다는 것을 알 수 있다.
SVG 를 사용하면 다양한 모양, 패스 및 텍스트 요소를 결합하여 다양한 시각 효과를 만들 수 있으며 모든 크기에서 매우 선명하고 밝게 보이도록 할 수 있습니다.
반면 GIF, JPG 및 PNG 와 같은 래스터 기반 형식은 크기가 고정되어 크기 조절 시 픽셀화됩니다. 다양한 응답 이미지 기술은 픽셀 그래픽에 매우 가치 있는 것으로 입증되었지만 SVG 의 무한 확장 (확대/축소) 기능과 결코 맞설 수 없습니다.
2. 프로그래밍 가능성 및 상호 작용
SVG 는 완전히 편집 가능하고 스크립팅이 가능하므로 CSS 또는 자바스크립트를 통해 다양한 애니메이션과 상호 작용을 드로잉에 추가할 수 있습니다.
3. 접근하기 쉽다
SVG 파일은 텍스트 기반이며 검색하고 인덱스화할 수 있습니다. 이를 통해 화면 판독기, 검색 엔진 및 기타 장치에서 읽을 수 있습니다.
4. 공연
웹 성능에 영향을 미치는 가장 중요한 측면 중 하나는 웹 페이지에 사용되는 파일의 크기입니다. SVG 그래픽은 일반적으로 GIF, JPG 및 PNG 와 같은 래스터 그래픽에 비해 작은 파일입니다.
Svg 와 canvas 의 차이점
캔버스
1. 종속 해상도;
2. 이벤트 처리기는 지원되지 않습니다.
텍스트 렌더링 능력이 약합니다.
4. 결과 이미지는 에 저장할 수 있습니다. Png 또는. Jpg 형식
5. 많은 개체가 자주 다시 그려지는 이미지 집약적 게임에 가장 적합합니다.
저장 (saving 의 속기)
1. 해상도에 독립적;
2. 이벤트 처리기 지원
3. 렌더링 면적이 큰 앱 (예: 구글 지도) 에 가장 적합합니다.
4. 복잡도가 높으면 렌더링 속도가 느려질 수 있습니다 (DOM 을 과도하게 사용하는 응용 프로그램은 빠르지 않음).
5. 게임 애플리케이션에 적합하지 않습니다.
변쇼가 가져온 SVG 형식에 대한 구체적인 소개입니다. 도움이 되었으면 합니다.