SVG 및 viewBox 값


14

누군가가 viewBox값 (즉 viewBox="a b c d")이 어떻게 결정 되는지 알고 있다면 궁금합니다 .

나는 그래서는 잉크 스케이프에서 문서 작성 무슨 짓을했는지, 잉크 스케이프의 SVG의 기능을 이해하기 위해 노력하고있어 100pxX를 100px(즉, 뷰포트의 왼쪽에서 선을 그려, 0(즉 오른쪽으로 수평 값) 100수평 값) .

그러나 이상하게 도이 문서를 일반 SVG 파일로 저장 한 다음 텍스트 편집기에서 파일을 열면 viewBox값이 viewBox="0 0 26.458333 26.458334"대신 설정됩니다 viewBox="0 0 100 100".

이 값 ( 0 0 26.458333 26.458334)이 어떻게 결정되는지, 왜 값 과 뷰포트 치수 사이에 관계가 없는지 아는 사람이 있습니까?

추신 : 나는 viewBox문서 옵션에서 수동으로 속성을 편집 할 수 있다는 것을 알고 있지만 Inkscape가 펑키 값으로 설정하는 이유에 대해 여전히 궁금합니다.

답변:


19

Inkscape는 mm를 문서의 기본 표시 단위 또는 사용자 단위 로 사용합니다. 사용자 단위 는 SVG 파일에 값을 저장하는 데 사용됩니다.

<svg width="100" height="100" viewBox="0 0 26.458333 26.458333">

이 태그는의 도면 크기를 설명합니다 100px x 100px. 뷰 박스 속성을 정의 100px x 100px하는 것과 같습니다 26.458333 x 26.458333 user units.

SVG 축척 비율은 1px / 0.2645 user-unitSVG 렌더러에서 사용자 단위 로 저장된 모든 값을 실제 도면 크기 로 변환하는 데 사용할 수 있습니다 .


이 경우 Inkscape는에 값을 저장하려고 mm하므로 px관련 방법을 알아야합니다 mm. CSS 규격은 절대 길이 단위는 서로에 대해 고정 된 것으로 설명96px = 1in

이것은 의미 100px = 1.041666667in = 2.645833333cm = 26.45833333mm

그래서 그것이 시작되는 곳 26.45833333입니다.


Inkscape가에 모든 값을 저장 하도록 하려면 문서 속성 (파일> 문서 속성> 탭 : 페이지> 일반> 표시 단위) px에서 기본 표시 단위 또는 사용자 단위를 변경할 수 있습니다.px

  1. 기본, mm :

문서 속성 mm

  1. 변경 : px :

문서 속성 px

동일한 문서를 내 보내면 다음 SVG 태그가 생성됩니다.

<svg width="100" height="100" viewBox="0 0 100 100">

이제 SVG 스케일 팩터는 1px / 1 user-unit입니다.

이 주제에 대해 더 알고 싶다면 Inkscape Wiki 에 더 자세한 설명이 있습니다.

비고 :

  • 잉크 스케이프 v0.92의 관계는 사용하는 96px/in잉크 스케이프 v0.91을 이전 값을 사용90px/in

와. 매우 흥미로운. 그래서 운율과 이유가 있었다. 지식을 공유해 주셔서 감사합니다!
oldboy

나는 당신이 사용한 화이트 아웃 기술을 기억할 것입니다. 나는 일반적으로 스크린 샷의 중요한 부분 주위에 빨간색 사각형을 넣어, 당신은 너무 훨씬 좋네요.
aaaaaa
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.