[解決済み] svgのx属性とdx属性の違いは何ですか?
2022-05-17 21:32:39
質問
svgのxとdx属性(またはyとdy)にはどのような違いがありますか?軸のシフト属性 (dx) と位置属性 (x) を使用する適切なタイミングはいつですか?
例えば、私は多くのd3例が次のようなことを行っていることに気づきました。
chart.append("text")
.attr("x", 0)
.attr("y", 0)
.attr("dy", -3)
.text("I am a label")
以下でも同じことができるようですが、yとdyの両方を設定する利点や理由は何でしょうか?
chart.append("text")
.attr("x", 0)
.attr("y", -3)
.text("I am a label")
どのように解決するのですか?
x
そして
y
は絶対座標であり
dx
と
dy
は相対座標(指定された
x
と
y
).
私の経験では、一般的に
dx
と
dy
で
<text>
要素に追加することができます (ただし、たとえば、テキストを配置するためのいくつかのコードと、それを調整するための別のコードを持っている場合、コーディングの利便性のために便利かもしれません)。
dx
と
dy
は、主に
<tspan>
の中に入れ子になっている
<text>
要素の中に入れられ、より複雑な複数行のテキストレイアウトを確立することができます。
より詳細な情報は Text セクションを参照してください。 .
関連
-
[解決済み】SVGオブジェクトの拡大縮小とミラーリング
-
[解決済み] SVGで中空円を描画する
-
[解決済み] getBBox() SVGRectはどのように計算するのですか?
-
[解決済み] SafariでSvg画像要素が表示されない
-
[解決済み】PNG画像をSVGに変換する方法は?[クローズド]
-
[解決済み】円弧(のSVGパス)を計算する方法)
-
[解決済み】SVGファイル内のtransformを削除する方法
-
[解決済み】PNG vs. GIF vs. JPEG vs. SVGの異なるユースケースとは?[クローズド]
-
[解決済み] SVGユースタグとReactJS
-
[解決済み] svgのx属性とdx属性の違いは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] d3.jsでノードのダブルクリックイベントを作成するにはどうすればよいですか?
-
[解決済み] getBBox() SVGRectはどのように計算するのですか?
-
[解決済み] SafariでSvg画像要素が表示されない
-
[解決済み] ImageMagickでSVGをPNGに変換する方法は?
-
[解決済み】PNG画像をSVGに変換する方法は?[クローズド]
-
[解決済み】円弧(のSVGパス)を計算する方法)
-
[解決済み】SVGファイル内のtransformを削除する方法
-
[解決済み] SVG ルート要素のデフォルトの背景色
-
[解決済み] SVGの円弧パスによる円形描画
-
[解決済み] SVGユースタグとReactJS