SVG viewBox 특성 뒤에있는 마법은 무엇입니까?

Question

몇 가지 시도 후에도 SVG viewBox에 대한 내용이 있습니다. 아직 이해할 수 없습니다. 다음 샘플에서 viewBox를 제거하면 출력이 작아집니다. 이게 왜 그렇게? 내가 viewBox가 맞게 비늘을 알아,하지만 거기에 아무 것도 볼 수 없습니다. 경로의 범위는 정확히 SVG의 너비/높이를 일치 :

<svg width=595pt height=806pt viewBox="0 0 595 806" overflow="visible"> 
<g style=" 
fill: none; 
stroke: red; " > 
    <path d=" 
     M 0.000 0.000 
     L 595.000 806 
     L 595.000 0.000 
     L 0.000 806 
"/> 
</g> 
</svg> 

여기에 스스로를보십시오 : https://jsfiddle.net/7zomyrp9/는

Answer 1

뷰 박스라는 우리의지도가 x 방향에서 595 점으로 595 픽셀. 1

그래서 때 PT 비율 96:72 또는 1.3333333이다 the CSS3 specification 당

에 1pt = 1/72th 따라서 PX가 1 인치
1 픽셀 = 1/96 1 인치

중 당신은 그 요인에 의해 그림의 크기가 변하는 viewBox를 제거합니다.

동일한 추론이 y 스케일링에 적용됩니다.