SVG 라인이 일치하지 않습니다

Question

만약 당신이이 바이올린을 체크 아웃한다면 : http://jsfiddle.net/hr9SN/ - 긴 수평 라인이 다른 라인들에 비해 매우 얇음을 볼 수 있습니다. 아래 그림과 같이 일러스트 레이터가 그렇게 오지 않았습니다. 일러스트 레이터 SVG 코드 대화 상자에서 코드를 얻었습니다. 나는 스트로크 너비로도 플레이했지만 도움이되지 않습니다. 문제가 있다면 문제를 과장합니다.

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 456 251" enable-background="new 0 0 456 251" xml:space="preserve"> 
     <polyline class="svg" points="7.7,221.4 10.7,221.4 10.7,210.4 0.7,210.4 0.7,221.4 5.7,221.4 5.7,252.4 456.7,252.4 456.7,0.4 "/> 
</svg> 

<img src="http://cl.ly/image/341r2T34103X/Screen%20Shot%202014-07-22%20at%2014.34.27.png" alt=""> 

이 문제를 해결할 수있는 방법 및/또는 문제가 무엇인지 알고 계십니까?

건배.

Answer 1

뷰포트의 가장자리를 따라 직선을 그립니다. 결과적으로이 선의 일부가 가시 영역 외부로 그려집니다.

보기 상자를 크게 만듭니다.

viewBox="0 0 460 255" 

(JSFiddle link)