SVG定位

标签 svg position grouping

我正在使用 SVG,但在定位方面遇到了一些问题。我有一系列包含在 g 组标记中的形状。我希望像容器一样使用它,这样我就可以设置它的 x 位置,然后该组中的所有元素也会移动。但这似乎不可能。

  1. 大多数人如何定位您希望串联移动的一组元素?
  2. 有相对定位的概念吗?例如相对于其父级

最佳答案

g 元素中的所有内容都相对于当前变换矩阵定位。

要移动内容,只需将转换放入 g 元素即可:

<g transform="translate(20,2.5) rotate(10)">
    <rect x="0" y="0" width="60" height="10"/>
</g>

链接:Example来自the SVG 1.1 spec

关于SVG定位,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/479591/

相关文章:

html - 使用左 : 0 and Right: 0 on the same element?

html - 问题是让导航栏中的不同元素垂直对齐

elasticsearch - 选择与 Elasticsearch 不同的

algorithm - 对连接的值对进行分组

Angular ,无法使用 [svgIcon] ="lItem.svgIcon"动态加载自定义 mat-icon

animation - 如何为 svg 的 animateTransform 设置原点

javascript - 使用什么方法在我的网站上显示背景?

将 svg 文件读取为 BufferedImage 时出现 java.lang.NoClassDefFoundError

html - 将 div 放在 div 下

jquery - 为每个 jQuery 分组相同的值