次のような図をWebページに表示したい(ウィキペディアから):
(詳細はあまり重要ではありません - 二分木であってはならず、必ずしも 3 レベルである必要はありません)
私は現在、境界線のほとんどが透明な (事前に計算された) テーブルを使用していますが、これは見苦しいプログラミングであり、保守が困難です。このような図をプログラムでどのように描画しますか? 主にドロップダウンリストとリンクなどの要素をボックスにcanvas配置する必要があるため、 a を使用したくありません。html
を介してボックスを手動で配置しCSS、次のような要素で線を描くことを考えていました(水平線の場合):
<p style="border: 2px solid black; height: 0px; width: ...; top:...; right:...;"/>
これは行く方法ですか？アドホックな線引きは少ないですか？