【D3.js】縦方向の階層ツリーを横向きに変更したい

Question

前提

下記サイトを参考に階層ツリーを作成しています

https://zenn.dev/yuji/articles/7eb96460317222

実現したいこと

親要素が右側に来るレイアウトにしたいです。

発生している問題・エラーメッセージ

Answer 1

全体を反転させてから、textのみ反転させるのはどうでしょう？
https://codesandbox.io/s/d3-2021-8-27-forked-to177d

svg
  .attr("transform", "scale(-1, 1)")
  .selectAll("text")
  .attr("transform", "scale(-1, 1)")
  .attr("text-anchor", (d) => (d.depth === 0 ? "start" : "end"))
  .attr("x", function (d) {
    return d3.select(this).attr("text-anchor") === "start" ? 6 : -6;
  });

Comments

[nana_1107]

回答いただきありがとうございます。
イメージ通りに実現出来ました！

現在、別のサンプルで実装しているのですがSVGの理解が足りておらず
同様の問題で詰まっている状況です。(質問を更新しました)
厚かましいお願いで恐縮なのですが、ご回答いただけましたら幸いです。

[Karibash]

質問の内容がまるごと変わってしまっているので新規の質問にされた方が良いかなと思います。
Teratailのhelpにも質問の改変は行わないように記載されています。
https://teratail.com/help/avoid-asking

[nana_1107]

そうだったのですね
確認不足で申し訳ありません。
質問内容を元に戻して新規に質問するようにします