将SVG调整为100％宽度，但保持圆半径，怎么做？

时间：2018-04-23 05:10:22

标签： css svg

我们使用SVG绘制折线图：

enter image description here

按照设计，宽度应为100％，因此在生成SVG时其精确值是未知的。 preserveAspectRatio =“none”让SVG填充100％宽度，但会扭曲圆圈。

我们使用 vector-effect =“non-scaling-stroke”选项保存失真线条;是否有一些技巧可以在缩放SVG时保持圆半径相同？

1 个答案:

答案 0 :(得分：1)

解决方案是将 circle 替换为零长度但圆顶的行。所以每个＆＃34;圈＆＃34;看起来像 - 

<line x1="x" y1="y" x2="x" y2="y" 
style="stroke:#00a7e1;stroke-linecap:round;stroke-width:13px;vector-effect:non-scaling-stroke" />
相关问题
最新问题