問題タブ [svg]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
cross-browser - ブラウザでのベクター グラフィックの表示
私が取り組んでいる Web サイトにインタラクティブな (DOM リスナーなどとのアタッチとイベント処理) ベクトル グラフィックを表示する必要があります。SVG には W3C の推奨事項がありますが、この形式は Internet Explorer のサポートではまだ認識されていません (公開 Web サイトの場合)。IE は VML を処理しますが、ブラウザー (SVG と VML) に応じてキャンバスのような描画を行う JavaScript ライブラリーもあります - excanvas、Dojo Toolkit の GFX など。指定されたマークアップから SVG 画像を表示できるものはありませんが、それは素晴らしく、許容できます。
したがって、質問は実際にはいくつかの部分で構成されています。
- 特定のマークアップ (必須の SVG ではない) からベクター グラフィックスを表示し、DOM イベントにアタッチする可用性を提供するクロスブラウザー Javascript ライブラリはありますか?
- 存在しない場合、そのようなタスクを実行するのに最も適した最も人気のあるブラウザ組み込みテクノロジはどれですか? Flex/Flash、Java アプレットから選択できます。Windows ロックインのため、Silverlight はオプションではありません。
[編集]コメント/提案をありがとうございます。以下は、この問題に関する私のランダムなメモ/結論です。
- 私が必要とする対話性のレベルは、表示されているベクター画像で DOM イベント (マウスオーバー、マウスアウト、クリックなど) を検出する機能と、背景色の変更、ダイアログの表示などのそれらに反応する機能です。
- SVG 形式に固執するという考えは、最も人気のある IE を除く多くのブラウザーでネイティブであるため、非常に適切です。動的 SVG の表示をいくつか試した結果、IE バージョン 7 が最も問題があることがわかりました。ブラウザの非互換性のため、面倒が多すぎます。
- Cake は素晴らしい Javascript フレームワークのようですが、IE7 でサンプルを動作させることはできませんでした。
- Java アプレット - 高品質の SVG レンダラーである Apache Batik ライブラリを使用できると思っていたので、このアイデアが最も気に入りました。しかし、Batik は非常に大きなライブラリであり、数メガバイトのアプレットを展開する余裕はありません。
- Flexオプションを使い続けることにしました。素敵なベクター グラフィックス ライブラリDegrafaを見つけました。独自のマークアップ形式を使用しますが、SVG パス表記を認識します。そのため、私の場合、SVG を XSLT を使用して変換するか、解析するだけで簡単に変換できます。
[編集 2 ] さらにいくつかのコメントが表示されました。「Windows ロックイン」とは、Silverlight が Windows、より具体的には IE で通常実行される状況を意味することを明確にしたいと思います。他のシステムで受け入れられているソリューション (たとえば、Flash や Java アプレットなど) であるとは思えません。はい、どのシステムでも Silverlight アプリを起動できることに疑いの余地はありませんが、平均的なユーザーにとっては手間がかかりすぎるのではないかと心配しています。
@Akira: IE7 の「SVG レンダラー」で何か問題がありましたか? 常に Javascript エラーがスローされます。
actionscript-3 - 実行時にswfでsvgデータをレンダリングする方法はありますか?
実行時にswfでsvgデータにレンダリングしたいのですが(Flexではなく、degrafaを使用していません)、どうすればそれを行うことができますか?
javascript - スクリプトSVG
私はstackoverflowに似たウェブサイトを開発することを検討していますが、答えは図面(この場合は回路図)で構成されている場合もあります。回答フォームに、特別なプラグインなどを必要とせずにこの回路図を作成できる領域が必要です。
- Are we to the point where SVG has or should have critical mass soon (1-2 years) such that designing a website where script-run SVG as a primary feature is reasonable (ie, requiring Firefox or another SVG/AJAX compliant browser)?
- What are some good resources for learning cross platform SVG scripting (likely in javascript)?
-Adam Davis
xml - SVG でのテキストの配置
行と短いテキスト スニペット (通常は 2 つまたは 3 つの単語) が混在する SVG XML ドキュメントを作成しようとしています。私が抱えている主な問題は、テキストを線分に揃えることです。
水平方向の配置にはtext-anchor
、left
、middle
またはを使用できますright
。垂直方向の配置に相当するものが見つかりません。alignment-baseline
しそうにないので、現在はdy="0.5ex"
センター合わせのおまけとして使っています。
テキストの垂直方向の中央または上部に揃える適切な方法はありますか?
c# - C# を使用して SVG を PNG に変換する
コードをあまり書かなくても、C# を使用して SVG 画像を PNG に変換しようとしています。これを行うためのライブラリまたはサンプルコードを推奨できる人はいますか?
javascript - SVG + Javascript フレームワークの良い解決策を探しています
SVG + Javascript フレームワークに関する他の経験を聞きたいと思っています。
フレームワークで処理したいこと - DOM の作成、イベント処理、最小サイズ。
Jquery SVG プラグイン - http://keith-wood.name/svg.htmlは、私が見つけることができる唯一のもののようです。
xhtml - SVG のような XML ベースの言語で HTML を使用するためのベスト プラクティスは何ですか?
このサイトや他のサイトを閲覧した結果、現在 Web サイトを XHTML として提供することは有害であると見なされていることがわかりました。
XHTML を配布してそのまま提供することapplication/xhtml+xml
は、現在ブラウジングしている大多数の人々によってサポートされていませんtext/html
。
したがって、html 4.01 に戻ります。ページを html 4.01 として提供する場合、そのページで SVG やその他の XML ベースの言語を使用できますか?
もしそうなら、どのように?
air - Adobe AIR は SVG を表示できますか?
Adobe AIR はレンダーとして WebKit を使用し、WebKit (少なくとも最新のビルド) は SVG をサポートしていることがわかります。これは、Adobe AIR アプリケーションが SVG を HTML ページにレンダリングできるということですか (そして誰かが具体的に試したことがあります)。
popup - SVG「ツールチップ」のようなボックスを作成するには?
既存の有効な SVG ドキュメントが与えられた場合、「情報ポップアップ」を作成する最良の方法は何ですか。特定の要素 (たとえば、追加情報?
これは、少なくとも Firefox では正しく表示され、画像がビットマップ形式にラスタライズされている場合は表示されません。