問題タブ [svg]

SVG ファイルの defs セクションに linearGradient があり、fill="url(#myGradientName)" で参照しています。それはこれまでのところうまくいきます。

defs セクション全体を独自の SVG ファイルに入れ、すべての SVG 画像からそれを参照できるようにすべきだと思います。つまり、次のようなものです。

スタイル.svg:

画像.svg:

しかし、スタイルを適用できないようです。このファイル (styles.svg#myGradient) の外部にある ID の構文が間違っていますか? どういうわけか最初にファイルを明示的に含める必要がありますか?

私は SVG 仕様に注いでいますが、これは可能であるように見えますが、実際にそれが行われていることを示す例はありません。

編集: FOP FAQは、正しい構文が fill="url(grad.svg#PurpleToWhite)" であることを示唆していますが、Gecko または Webkit では機能しません。それは正しく、誰もそれをサポートしていませんか、それとも何か間違ったことをしていますか?

私は少しの JavaScript を書いていて、SVG か VML のどちらかを選択する必要があります (またはその両方か、それ以外の何か、それは奇妙な世界です)。今のところ IE だけが VML をサポートしていることはわかっていますが、プラットフォームよりも機能を検出したいと考えています。

SVG には、使用できるプロパティがいくつかあるようです。たとえば、window.SVGAngle です。

これは SVG サポートを確認する最良の方法ですか?

VML に相当するものはありますか?

残念ながら、firefox では、VML ですべてのレンダリングをエラーなく実行できます。画面上では何も起こりません。スクリプトからその状況を検出するのは非常に困難です。

JavaScript を使用して、SVG ビューボックスの境界内にあるマウス ポインターの位置を確認する方法を知りたいです。イベント モデルを使用して、さまざまなマウス モーション イベントをすべて追跡する必要がありますか? または、マウス ポインターをポーリングして、必要なときにその場所を教えてもらう方法はありますか?

パネル内にSVGコンテンツを含めたり（またはGWTで機能するものなら何でも）、プログラムでSVGにさらに追加したり（円や曲線を追加したりするなど）、マウスイベントを処理したりできるかどうか疑問に思いました（これはSVGまたはGWTで？）。次の行に沿って何かを追加するHTMLオブジェクトを作成してみました。

それは機能しませんでした（出力に何も表示されません）が、それが間違ったためか、許可されていないためかはわかりません。

Google Visualizationの折れ線グラフを使用してGWTで簡単な例を実行できましたが、Google Visualizationから離れて、自分でSVGを生成し、さらにカスタマイズできるようにしたいと思います。私は周りを見回し、多くのリソースがCanvasの使用を指摘していますが、それがまだ最良のルートであるかどうかはわかりません。

ここの例についても少し困惑しています。簡単なコピーアンドペーストを試してローカルで試してみましたが、まったく機能しなかったようです。ただし、HTM（SVGファイルを指すsrcを埋め込んだ）L +個別のSVGファイルで動作する別のサンプルを取得できましたが、RootPanel.get（...）を使用してGWTを使用してアクセスできませんでした。

編集：SVGがHosted Browserで動作せず、コンパイルしても動作することについて読みましたが、SVG（を介してHTMLに配置した）を参照する方法がわかりません。アクセスできれば、おそらくそのinnerHTMLに追加できます。RootPanel.get（ "hi"）。getElement（）。setInnerHTML（ "..."）で試しましたが、うまくいかないようです。 目標は、私が何らかの方法でリンクしたSVGファイル（GWTまたはHTML）を操作し、ユーザーの入力に基づいて変更できるようにすることだと思います。

2番目の編集 これまで、実際のSVGファイル内で機能をプログラミングしてきました。このセットアップでは、SVGは埋め込みオブジェクトであり、「document」を埋め込みSVGに渡しました。HTMLはSVG関数にアクセスでき、SVGは「ドキュメント」にアクセスできるため、埋め込みオブジェクトからHTMLへの情報の受け渡しは非常に実行可能です。

FireBugがSVGを直接見ることができる、より透過的な方法があります（Rapahel）。これは素晴らしいことですが、今ではまったく必要ありません。これまでのところ、私が見たソリューションはどれもIFrameであるとは思いませんが、間違っている可能性があります。少し警告ですが、SVGは時々かなり遅くなる可能性があります。

私の問題は解決したと思いますが（ある種？）、現時点ではRaphael、jQuery、GWTを使用していませんが、GWTを使用したい場合は、回答で説明した方法で引き続き機能します。

私が取り組んでいるプロジェクトは、モニターの解像度が変更されたときにサイズを変更する必要があります。レガシ コードやその他の問題により、解像度が変更されたときにすべてのコンポーネントを適切なサイズにスケーリングするカスタム ライブラリを使用してこれを行います。

ただし、プロジェクトで使用されている画像/アイコンの一部を拡大縮小すると、ぼやけたり、ぼやけたり、エイリアスが発生したりします。ほとんどの場合、それらはすべてラスター gif であるためです。

この問題を軽減するために有効であると考えられる解決策の 1 つは、ベクター画像を使用して、その場でラスター画像に変換する (そしてパフォーマンス向上のためにキャッシュする) ことです。

皆さんはどう思いますか？これは良い方法でしょうか？または、選択した方法に代わるより良い方法はありますか?

これがより良い方法である場合、誰かがsvg変換を行ってjpgまたはpng（できれば）にする方法へのポインタを与えることができます。利用可能な (そして商用利用可能な) ライブラリは?

ありがとう

私はPisa/XHTML2PDFを使用して、Django でオンザフライで PDF を生成しています。残念ながら、SVG 画像も含める必要がありますが、これは簡単な作業ではないと思います。

a) SVG を PNG / JPG (Python で) に変換するか、b) Pisa からの PDF エクスポートに SVG を含めるのに最適な方法は何ですか?