svg的x和dx属性有什么区别？ [英] What is the difference between svg's x and dx attribute?

问题描述

svg的x和dx属性（或y和dy）之间有什么区别？什么时候适合使用轴偏移属性（dx）与位置属性（x）？

What is the difference between svg's x and dx attribute (or y and dy)? When would be a proper time to use the axis shift attribute (dx) versus the location attribute (x)?

例如，我注意到了很多d3示例

For example, I have noticed a lot of d3 examples doing something like this

chart.append("text")
   .attr("x", 0)
   .attr("y", 0)
   .attr("dy", -3)
   .text("I am a label")

当以下内容似乎做同样的事情时，设置y和dy的优势或推理是什么？

What is the advantage or reasoning for setting both y and dy when the following seems to do the same thing?

chart.append("text")
   .attr("x", 0)
   .attr("y", -3)
   .text("I am a label")

推荐答案

p> x 和 y 是绝对坐标， dx dy 是相对坐标（相对于指定的 x 和 y ）。

x and y are absolute coordinates and dx and dy are relative coordinates (relative to the specified x and y).

根据我的经验，使用 dx 和 dy 在< text> 元素（虽然它可能有助于编码方便，例如，如果有一些代码定位文本，

In my experience, it is not common to use dx and dy on <text> elements (although it might be useful for coding convenience if you, for example, have some code for positioning text and then separate code for adjusting it).

dx 和 dy 当使用嵌套在< text> 元素中的< tspan> 元素来建立更精确的多行

dx and dy are mostly useful when using <tspan> elements nested inside a <text> element to establish fancier multi-line text layouts.

有关详情，请参阅 SVG规范的文本部分。

这篇关于svg的x和dx属性有什么区别？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！