如何更改 svg (<g>) 高度？

Question

如何更改g元素的高度？

height = {params} doesn't want to react

我在评论中放弃了我的工作，因为svg非常大(Scene.js(

{/* Scale man */}
<g transform="translate(320,388)" viewBox="0 0 351 450">
<g transform={`translate(336,0) scale(-1, 1)`}>
<g transform="translate(30.25,179)">
<g>
<svg
xmlns="http://www.w3.org/2000/svg"
width="351"
height="450"
viewBox="0 0 351 450"
>...<

Answer 1

如注释中所述，<g>不能具有height或viewBox属性。

我假设您正在尝试将<g>剪辑到viewBox。

一种方法是使用<svg>标记，它确实支持viewBox：(您可能需要将转换移动到子元素中。(

{/* Scale man */}
<svg transform="translate(320,388)" viewBox="0 0 351 450">
<g transform={`translate(336,0) scale(-1, 1)`}>
<g transform="translate(30.25,179)">
<g>
<svg
xmlns="http://www.w3.org/2000/svg"
width="351"
height="450"
viewBox="0 0 351 450"
>...<

另一种方法是使用CCD_ 8经由CCD_。但这更令人讨厌，因为它需要单独定义<clipPath id="myClipPath">。

Answer 2

您可以对其应用css转换并调整比例，直到获得所需的高度。

transform: matrix(scale, 0, 0, scale, 0, 0);

例如：

transform: matrix(1.5, 0, 0, 1.5, 0, 0);