問題タブ [xlink]

アフリカの svg マップがあります。国をクリックすると、その国の地図を含む別の SVG またはページを開くことができるようにしたいと考えています。私はsvg画像を持っています。私は次のことを試しました：

これらは、アフリカ全体のうちわずか2カ国です。すべてのパスに Xlink を配置するのではなく、onclick イベントを使用して、ID または国名を介して国にリンクしたいと考えています。このイベントは、国の地図があるページを開きます。

ありがとう

アイコンの一部を再利用する必要がある SVG を使用してアイコン ソリューションを構築しています。<svg />私の HTML ドキュメントにはいくつかの異なる要素がインラインであり、この<use />要素は svg 要素間であっても形状 (四角形、パスなど) を再利用するのに完璧に機能します。

ただし、他の定義を再利用すること<radialGradient />はできません。グラデーションが<defs />同じ<svg />要素内の要素内で定義されている場合は期待どおりに機能しますが、グラデーションが別の<svg />要素で定義されている場合は機能しません。

疑似コード

use他の要素から形状を作成できるのにsvg、このような属性値を作成できないのはなぜですか? 目に見える svg 要素内の要素にshadowグラデーションを移動すると、参照は完全に機能します。defs

これは、機能している場合と機能していない場合の両方を示す JSFiddle です: https://jsfiddle.net/7tfna0L8/2/

ソリューション

Robert Longsonは、私の再利用可能な svg の「リポジトリ」にstyleはdisplay:none. 私にとっては、これが正しい方法のように感じます。結局のところ、このリポジトリは決して表示されるべきではありません。問題は、ブラウザがおそらくスタイルをまったく解析しないことでこれを最適化することです。これにより、要素を参照できますが、スタイル は参照できません（私のグラデーションのように）

jsFiddle の作業: https://jsfiddle.net/atornblad/7tfna0L8/3/

xml にリンクを挿入しようとしています。リンクは学生ハンドブックに誘導します。これは私のXMLの一部です

問題は、この XML を検証しようとすると、「年」が未割り当てであり、既定のエンティティではないと表示されることです。「=」も、何も参照されていないため、エラーになります。私の質問は、リンクをどのように使用するか、コードに欠けているものはありますか?

トポロジ表現を使用して線を定義する方法を見つける必要があります。今、私はそれに似たものを持っています:

Line/Point は、ポイントの一意の ID (UIDP) の値です。

質問

1. IDだけでなく、参照などを使用して穴のポイントの定義を取得する、より明確にする方法はありますか?
2. XLink または XPointer を使用して作成する方法は?
3. XSD スキーマ 1.1 でそれを定義する方法は?

したがって、さまざまなパスのコレクションを保持する単一の SVG ファイルがあります。

私の Web ページでは、次の SVG アイコンを使用しています。

そして、これは私が意図したとおりにうまくfoo機能します-ファイルからIDを持つSVGを選択しicons.svgます。

ここで、タグの属性にファイルへの _absolute_ パスを指定しようとすると、失敗して何も返されず、ファイルが見つからないようです。xlink:href<use>icons.svg.

絶対パスが正しいことに注意することが重要です。

のドキュメントxlinkは、絶対パスが有効な値であることを示唆しているようですが、なぜここで機能しないのか疑問に思います-何か不足していますか?

検討すべき代替アプローチはありますか？これは現在、このようなことを達成するために私が取りたいアプローチではありませんか?