D3チャートの凡例

Question

svgではなくhtmlを使用してチャートの凡例を作成するのは悪い習慣ですか？ HTML

d3.select(div.chart-legend').append('span') 
    .text('ID'); 

Answer 1

との代わりに

d3.select('g.chart-legend').append('text') 
    .text('ID'); 

の例について いいえそうではありません。それは要件に依存します。一般に、svgベースの凡例を使用している場合は、シェイプを描画してsvg要素に関連して凡例を配置する方が簡単になります.HTMLベースの凡例を使用すると、ダイナミックに取得された凡例の場合にテキストのリフローが容易になります。長いテキストの伝説やレスポンシブなレイアウトを見て、多くの伝説に終わってしまうかもしれないなら、役に立つかもしれません。

HTMLベースの凡例を追加する場合は、ルートsvg要素の外に凡例を追加する必要があることに注意してください。だから、あなたのチャートの一部は、svgの外にあります。ですから、あなたがsvgを保存するかシリアル化する方法を見ているなら、伝説を忘れるでしょう。