SVG의 도형을 확대했을 때 스트로크까지 굵어지는 것을 방지
1651 단어 SVG
개요
tranfrom 속성의 scale을 사용해 도표를 확대했을 때에, 도형의 스트로크까지 굵어져 버리는 것을 막는다.
요소의 "vector-effect"속성에 "non-scaling-stroke"를 지정합니다.
예
<svg>
<g transform="scale(3)">
<circle cx="60" cy="60" r="50" fill="#ffcccc" stroke="black"></circle>
<circle cx="180" cy="60" r="50" fill="#ccccff" stroke="black" vector-effect="non-scaling-stroke"></circle>
</g>
</svg>
실행 결과
무엇에 사용하는가
D3에서 팬 줌 실장하고 있으면 필요하게 되는 경우가 많다.
Reference
이 문제에 관하여(SVG의 도형을 확대했을 때 스트로크까지 굵어지는 것을 방지), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/_shimizu/items/86fbd3bfed98e839d17b텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
