10

一部の SVG 要素がFontAwesomeのアイコンである SVG (PHP および/または Javascript を使用) を作成する必要がありますが、外部依存関係 (css ファイルのインポートなど) はありません。

これは同様のトピックですが、svg が表示されている Web ページにFontAwesome (CSS ファイル) を追加するなどの外部依存関係があるため、私の問題には当てはまりません。

違いは、必要なすべての FontAwesome 定義が svg の一部であるオールインワン SVG が必要なことです。これは、ユーザーが生成された SVG をダウンロードして、svg ビューアーまたはエディターで作業を続行できる必要があるためです。

(たとえば) 1 つの "Font Awesome" アイコンの定義を 1 つの svg に入れる方法はありますか?

この(おそらく)svg情報のリストを見つけました。アイコンパスはSVGコードとして利用できるようです。では、これをsvgでどのように使用できますか?


//更新: 次の例を見つけましたが、FontAwesome 定義を含める方法とアイコンにアクセスする方法がわかりません :-(

<?xml version="1.0" standalone="yes"?>
<svg width="100%" height="100%" version="1.1"
 xmlns = 'http://www.w3.org/2000/svg'>
  <defs>
    <font id="Font2" horiz-adv-x="1000">
      <font-face font-family="Super Sans" font-weight="normal" font-style="italic"
          units-per-em="1000" cap-height="600" x-height="400"
          ascent="700" descent="300"
          alphabetic="0" mathematical="350" ideographic="400" hanging="500">
        <font-face-src>
          <font-face-name name="Super Sans Italic"/>
        </font-face-src>
      </font-face>
      <missing-glyph><path d="M0,0h200v200h-200z"/></missing-glyph>
      <glyph unicode="!" horiz-adv-x="300"><!-- Outline of exclam. pt. glyph --></glyph>
      <glyph unicode="@"><!-- Outline of @ glyph --></glyph>
      <!-- more glyphs -->
    </font>
  </defs>
</svg>
4

1 に答える 1