如何基於視口縮放svg

Question

所以我從一個基本的SVG圓圈開始，但我希望它能夠根據視口大小進行縮放。

<svg height="100" width="100"> <circle cx="10" cy="10" r="15" fill="black"></circle> </svg> 

我知道，與CSS我可以把這個樣本格：

<div class="test_div"></div> 

，並使用這個CSS：

.test_div {height:5vh; width: 5vh;} 

有效地使test_div保持相同的比例視口高度變化。有沒有辦法用某種可縮放大小的單元替換SVG屬性值？即

<circle cx="10vh" cy="10vh" r="5vh" fill="black"></circle> 

我從來沒有使用過StackOverflow，所以如果我太模糊了，請幫助我，謝謝！

Answer 1

不是使用像素值，而是使用基於ATSC HD標準16：9寬高比的圓大小的百分比值。用於測量的像素已過時。