0

スタック

  • FontAwesome v5
  • D3js v4
  • 角4

シナリオ

オプションのバブルが追加されたノードを持つ階層ツリーがあります (顔がノードで、追加されたノードが耳であるミッキー マウスのバルーンと考えてください)。これらのオプションに、FontAwesome のiのようなアイコンを表示して詳細情報を表示したり、xを削除したりしたいと思います。

mickey.append('text')
  .attr('x', 15)
  .attr('y', -17)
  .attr('fill', 'black')
  .attr('font-family', 'FontAwesome')
  .attr('font-size', function (d) { return '20px' })
  .text(function (d) { return '\uf2b9' });

FontAwesome 5 JavaScript CDN もインポートしましたindex.html

<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>

ここに画像の説明を入力

以上が現在持っているものです。左耳には.text('i')あり、右耳にはレンダリングしようとしている FontAwesome アイコンがあります。

さらに、アプリ全体で を使用して既に FontAwesome<i>を使用していますが、SVG で D3 を使用して実装できるフォント ファミリとして使用する方法がわかりません。

考えられる解決策

このソリューションは別の投稿で見つけましたが、これはほぼ正確に必要なものですが、すべてをまとめる方法がわかりませんでした.

リクエスト

textAngular 4 で作成された D3.js V4 の svg で FontAwesome v5 をインポートして使用する方法を示すサンプル コードを誰かが提供できますか?

ありがとう!

4

2 に答える 2