問題タブ [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.
java - 簡単な描画アプリケーションのプログラミング
データの視覚化を行うために、グラフ内に四角形、円、およびテキストを含めたいと考えています。SVG グラフィックスをエクスポートできる Java ベースのフレームワーク (非常に基本的な Powerpoint 機能に似ているかもしれません) を知っている人はいますか?
graphics - SVG を学ぶための書籍/チュートリアル
ここでSVGを知っている人はいますか?もしそうなら、どのようにそれを学びましたか。
書籍/チュートリアルのポインターは有益です。また、私はデザイナーではなくプログラマーなので、そこでスキルを身につけたいと思っています。
javascript - 埋め込まれたSVGドキュメントがhtmlページにロードされているかどうかを確認するには?
HTML ページに埋め込まれた SVG ドキュメントを (javascript を使用して) 編集する必要があります。
SVG が読み込まれると、SVG の dom とその要素にアクセスできます。しかし、SVG dom の準備ができているかどうかを知ることができないため、html ページがロードされたときに SVG でデフォルトのアクションを実行できません。
SVG dom にアクセスするには、次のコードを使用します。
ここで、「chart」は埋め込み要素の ID です。
HTML ドキュメントの準備ができたときに SVG にアクセスしようとすると、次のようになります。
svg は常に null です。null でないときを知る必要があるだけなので、操作を開始できます。それを行う方法があるかどうか知っていますか?
flash - Flash を使用して SVG グラデーションを表示しますか?
AS3 (Flash) を使用してSVG ファイルを読み取り、表示しています。問題は、線形/放射状グラデーションを正しく表示しています。
以下は、 SVG での赤から青への単純な線形グラデーションの例です。
グラデーション (ストップのスタイル) からの色と、グラデーション (ストップのオフセット) の間隔を読み取ることができました。
さて、これで、適切な色と適切な量のスペースを備えた素敵なグラデーションができましたが、回転やスケールはなく、位置がずれています! .
答えは、 Matrixを Flash のグラデーション関数にフィードすることです。
方法 1: 提供されたマトリックスを使用する
SVG によって提供されるマトリックス、gradientTransform="matrix(a,b,c,d,e,f)"は事実上役に立たないように見えます。そのマトリックスを Flash のbeginGradientFill() 関数にフィードすると、シェイプ上に引き伸ばされたグラデーションが表示されるためです。塗りつぶしのように、グラデーションの中心の色だけが表示されます。
方法 2: 2 つのグラデーション ポイントを使用してマトリックスを生成する
- x1、y1タグは、グラデーションが始まる画面上のポイントである可能性があります。
- x2、y2タグは、グラデーションが終了する画面上のポイントである可能性があります。
「2 つのグラデーション ポイント」と言うとき、私は x1、y1 と x2、y2 を指しています。これらは主に、形状のどこでグラデーションの開始と終了を行うかを示しています。
グラデーションで使用するマトリックスを作成するMatrix.createGradientBox()関数がありますが、パラメーターはSVG が提供するものとは大きく異なります。それは欲しい:
- 幅--- ここでは 2 つのグラデーション ポイント間の相対距離を使用します (X 軸)
- 高さ --- ここでは 2 つのグラデーション ポイント (Y 軸) 間の相対距離を使用しましたが、間違った結果が得られました --- ここでも2 つのグラデーション ポイント間の距離を使用しようとしましたが、幅に何を入力すればよいかわかりませんでした!
- 回転角度-- 2 つのグラデーション ポイントの角度 (ラジアン単位) を使用したため、結果が正しくありません!
- Translation x -- 最初のグラデーション ポイントの X を試し、0 も試しましたが、結果が正しくありません!
- Translation y -- 最初のグラデーション ポイントの Y を試し、0 も試しましたが、結果が正しくありません!
Flash のグラデーション マトリックスを生成するために使用できる SVG データは何ですか?
(上記の SVG スニペットを見てください。これがグラデーションを説明するすべてのデータです)
wpf - Cartman の Silverlight チュートリアル
数か月前、Eric Cartman (South Park) の Silverlight チュートリアルに出会いました。http://en.wikipedia.org/wiki/File:Eric.svgのベクター画像を使用して彼をアニメーション化しました。ただし、そのチュートリアルはもう見つからないようです。
誰かが私を正しい方向に向けることができますか?
svg - SVGで2次元グラデーションを作成(または偽造)できますか?
画像を動的に生成する必要があるカラーピッカーを作成しようとしていますが、ラスター画像よりも SVG を生成する方がはるかに簡単であると考えました。残念ながら、ピッカーの中心となる大きな 2 次元グラデーションを表現する方法がわかりません。
たとえば、現在選択されている軸が青と緑の場合、左下隅が黒、左上隅が青、右下が緑、右上がシアンの正方形をペイントする必要があります。
塗りつぶされた 2 つの正方形を重ねて不透明度をいじることでこれを達成する方法がある場合linearGradient
、私はそれを解決できませんでした。また、始点と終点の色が他のグラデーションであるグラデーションを作成しようとしましたが (私が巧妙であることを願っています)、「大きな黒い何もない」ものしか得られませんでした。これまでのところ、Google 検索はどこにも行きませんでした。
サイズと複雑さが増し、うまくサイズ変更できないと思われるため、256 個の 1 ピクセルの高グラデーションのスタックに頼りたくありません。おそらく、SVG の実用的な知識をもう少し持っている人が何かを提案できます
javascript - Javascript を使用して SVG をプレビューしますか?
javascript を使用してページ内で SVG をレンダリングする簡単な方法はありますか? 私がやりたいことは、ユーザーが SVG を入力してページにレンダリングするボタンをクリックできる大きなテキストエリアを設定することです。
scripting - プログラマティック グラフィックス ツールチェーン
Inkscapeでアイコンを描画しましたが、プログラムで変更し (アイコンの状態ごとに色をわずかに変更)、異なる色の複数のアイコンを含むタイル PNG 形式のファイルに変換したいと考えています。Inkscape の--export-pngオプションについては知っていますが、画像を変更したり、結合された画像のさまざまな部分に複数回エクスポートしたりする方法がわかりません。
プログラムで画像をいじるための優れたユーザー指向のツールはありますか、それとも GD を掘り下げたり、SVG XML を手動で変更したりする必要がありますか?
.net - Adobe SVG Viewer を使用した .NET WebBrowser コントロール
.NET 2.0 WebBrowser コントロールでの SVG ファイルの読み込みに問題があります。新しい WinForms アプリケーション プロジェクトを作成する場合、WebBrowser コントロールとボタンを Form1.cs デザイン サーフェイスにドラッグし、ボタンのオンクリック ハンドラーに行を追加して、WebBrowser コントロールの Url プロパティを SVG ファイルに設定します。実行時に 2 つの IE スクリプト エラーが発生します (Javascript に問題がある場合に表示されるダイアログのように)。したがって、私が書いている唯一のコード行は次のとおりです。
IE でリンクを直接参照すると、この SVG ファイルが正常に読み込まれます。テストアプリで発生するエラーは次のとおりです。
(「このページでスクリプトを実行し続ける」というプロンプトに「はい」と答えると仮定します)。
を使用してIE 7.0.5730.13, Adobe SVG Viewer 3.03 build 94, Visual Studio 2008
います。誰でもこれを複製できますか?誰かがそれを見たことがありますか、それを修正する方法を知りましたか?
(編集: 以前は例の目的でコンストラクターに URL を設定していましたが、これによりコントロールの初期化が完了したかどうかという問題が発生したため、ボタンを使用するように例を変更しました - 問題はまだ発生しています。このバグはもともと私が書いたサンプルプログラムは、問題を切り分けてできるだけ簡単に再現する試みでした.)
(編集2:いくつかの異なるマシンでテストしたところ、この問題はIE7に関連しているようです-IE6を実行すると、すべて正常に動作します。)
netbeans - Netbeans J2ME SVG 準拠
私が取り組んでいるプロジェクト用にいくつかのsvg画像をコーディングしました。しかし、それらを netbeans ソフトウェア (j2me) の画面 (フォーム) に配置しようとすると、「画像は SVG Tiny に準拠していません」と表示されます。Sun の WTK デモのTHAT WORKの展開時に svg イメージをテストしてみましたが、同じことが言えます。何がうまくいかなかったのかについてのアイデアはありますか?