タグ付けされた質問 「svg」

これは通常のSVG MIMEタイプです。 image/svg+xml そしてそれは素晴らしい働きをします。ただし、SVGフォントを埋め込むと、chromeでは画像の代わりにフォントが返されるため、MIMEタイプが正しくないことがわかります。 ユニバーサルMIMEタイプはありますか？クロムは間違っていますか？されてapplication/svg+xml何とか受け入れ？ これはまだHTML5の灰色の領域だと思いますが、ここの誰かが知っているかもしれません。

168 html  svg  font-face  mime-types 

background-imageSVG <path>要素にを設定することは可能ですか？ たとえば、要素を設定した場合class="wall"、CSSスタイルは.wall {fill: red;}機能しますが、.wall{background-image: url(wall.jpg)}機能しません.wall {background-color: red;}。

166 html  css  image  svg  background-image 

誰でもこれがどのようにできるか知っていますか？canvasオブジェクト、svg、jQueryなどを使用しますか？

165 ipad  html  canvas  svg 

Androidでsvgを使用して、解像度ごとに異なる解像度を作成したり、ファイルをドロップしたりするのを防ぐために、無数のライブラリーを見つけました。アプリに多くのアイコンや画像がある場合、これは非常に煩わしくなります。 誰でも、AndroidでSVGを使用するための最も簡単に使用できるライブラリのステップバイステップのプロセスを提供することを親切にできますか？これは他の多くの人にも役立つと確信しています。 また、アイコンと画像の生成にはAndroid StudioとIllustratorを使用しています。

165 android  svg  androidsvg 

だから、私はHTMLでSVGファイルを持っています。このフォーマットについて聞いたことの1つは、ズームインするとすべてがピクセル化されないということです。 私はjpegまたは50 x 50のアイコンとして保存できるものを知っていて、実際にimage_srcで高さと幅を手動で設定して、（むしろピクセル化された）100 x 100のサムネイル（または10 x 10）として表示します。鬼ごっこ。 ただし、SVGファイルはオブジェクト/埋め込みタグで使用されているようで、THOSEの高さまたは幅を変更すると、画像に割り当てられるスペースが増えるだけです。 実際にファイルシステムに格納されているSVG画像よりも小さいまたは大きいSVG画像を表示するように指定する方法はありますか？

157 html  svg 

私はしばらくこれに苦労しており、どこでも（うまくいく）答えを見つけることができないようです。次のようなSVGファイルがあります。 <svg xmlns:dc="http://purl.org/dc/elements/1.1/" ... width="72.9375" height="58.21875" ...> ... <g ... transform="translate(10.75,-308.96875)" style="..."> <path inkscape:connector-curvature="0" d="m -10.254587,345.43597 c 0,-1.41732 0.17692,-2.85384 0.5312502,-3.5625 0.70866,-1.41733 2.14518,-2.82259 3.5625,-3.53125 1.41733,-0.70866 2.11392,-0.70867 3.53125,0 1.41732,0.70866 ... z" ... /> </g> </svg> transform="..."行を削除したいのですが、（InkScapeで）配置した場所に画像が残っています。変換を手動で削除すると、画像は画面の別の部分に（予想どおり）圧縮されますが、変換を完全に削除すると同時に、画像を希望する場所に正確に留める必要があります。変換をパス座標自体に削除/平坦化する方法はありますか？（私が処理しなければならない唯一の変換は、行列ではなく、変換とスケーリングです。）

155 svg  transform  inkscape 

私はこのような私のプロジェクトでsvgサークルを使用しています、 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 120"> <g> <g id="one"> <circle fill="green" cx="100" cy="105" r="20" /> </g> <g id="two"> <circle fill="orange" cx="100" cy="95" r="20" /> </g> </g> </svg> また、gタグでz-indexを使用して、最初の要素を表示しています。私のプロジェクトでは、z-index値のみを使用する必要がありますが、svg要素にz-indexを使用できません。私はたくさんグーグルしましたが、比較的何も見つかりませんでした。それで、私のsvgでz-indexを使用するのを手伝ってください。 これがデモです。

154 javascript  jquery  svg  z-index 

SVG画像は純粋にベクトルであるか、またはビットマップ画像をSVG画像に結合できますか？ビットマップ画像に適用された変換（パースペクティブ、マッピングなど）はどうですか？ 編集：画像はリンク参照によってSVGに含まれる場合があります。http://www.w3.org/TR/SVG/struct.html#ImageElementを参照してください。私の質問は、ビットマップ画像がsvg内に含まれて、svg画像が自己完結するかどうかということでした。それ以外の場合、svgイメージが表示されるときは常に、リンクをたどってイメージをダウンロードする必要があります。どうやら.svgファイルは単にxmlファイルです。

147 image  svg  bitmapimage 

簡単な質問：SVGパスを使用すると、99.99％の円を描画して表示できますが、99.99999999％の円の場合、円は表示されません。どうすれば修正できますか？ 次のSVGパスは99.99％の円を描くことができます：（http://jsfiddle.net/DFhUF/1381/で試して、4つのアークまたは2つのアークしか表示されないか確認してください。ただし、IEの場合は、 SVGではなくVMLでレンダリングされますが、同様の問題があります） M 100 100 a 50 50 0 1 0 0.00001 0 しかし、それが円の99.99999999％の場合、何も表示されません。 M 100 100 a 50 50 0 1 0 0.00000001 0 そして、それは円の100％と同じです（それはまだ弧です、そうではありません、非常に完全な弧です） M 100 100 a 50 50 0 1 0 0 0 どうすれば修正できますか？その理由は、関数を使用して円弧のパーセンテージを描画することです。円関数を使用するために99.9999％または100％の円弧を「特殊なケース」で使用する必要がある場合、それはちょっとばかげているでしょう。 ここでも、RaphaelJSを使用したjsfiddleのテストケースはhttp://jsfiddle.net/DFhUF/1381/にあります （IE 8のVMLの場合、2番目のサークルも表示されません...に変更する必要があります） 0.01） 更新： これは、システムでスコアの弧を描画しているため、3.3ポイントで円の1/3が得られるためです。0.5は円の半分を取得し、9.9ポイントは円の99％を取得します。しかし、システムに9.99のスコアがある場合はどうなりますか？円の99.999％に近いかどうかを確認しarc、circleそれに応じて関数または関数を使用する必要がありますか？では、9.9987のスコアはどうでしょうか。どちらを使用しますか？どのようなスコアが「完全すぎる円」にマッピングされ、円関数に切り替わるかを知る必要があるのはばかげています。円の「特定の99.9％」または9.9987のスコアの場合は、円弧関数を使用します。 。

146 svg  geometry  drawing  vml  geometric-arc 

HTMLページにSVGオブジェクトがあり、それをアンカーでラップしているため、svg画像をクリックすると、ユーザーはアンカーリンクに移動します。 <a href="http://www.google.com/"> <object data="mysvg.svg" type="image/svg+xml"> <span>Your browser doesn't support SVG images</span> </object> </a> このコードブロックを使用する場合、svgオブジェクトをクリックしても、Googleに移動しません。IE8 <では、スパンテキストはクリック可能です。 タグを含むようにsvg画像を変更したくありません。 私の質問は、どうすればsvg画像をクリック可能にすることができますか？

143 html  object  svg  anchor 

私がSVGファイルを持っているとしましょう： <svg width="1024" height="768" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <text x='20' y='60' style="font-size: 60px">b</text> <text x='100' y='60' style="font-size: 60px">a</text> </svg> どういうわけか上を揃えたい aとb。実は、ポジショニングrooflineはbaseline！ではなく！

142 svg  vertical-alignment  w3c 

Font Awesomeアイコンフォントが大好きで、サイトのほとんどのアイコンに使用したいのですが、提供されているものに加えて、必要なカスタムsvgアイコンがいくつかあります。 Font Awesomeの.svgバージョンは、主に次の<glyph />要素で構成されていることに気付きました。 ... <glyph unicode="" horiz-adv-x="1536" d="M0 80v477q0 51 24.5 61.5t59.5 -24.5l162 -162l340 338l-338 338l-164 -164q-35 -35 -59.5 -25.5t-24.5 60.5v477q0 31 23 57q27 23 57 23h477q51 0 61.5 -24.5t-24.5 -59.5l-160 -158l338 -338l332 334l-162 162q-35 35 -24.5 59.5t61.5 24.5h477q33 0 55 -23 q25 -25 25 -57v-477q0 -51 -24.5 …

138 svg  webfonts  font-awesome 

たとえば、SVGドキュメント全体のデフォルトの背景色を赤に設定したいと思います。 <svg viewBox="0 0 500 600" style="background: red">/* content */</svg> 上記の解決策は機能しますが、スタイル属性のbackgroundプロパティは残念ながら標準のものではありません：http : //www.w3.org/TR/SVG/styling.html#SVGStylingProperties、そしてそれはSVGでのクリーニングプロセス中に削除されますクリーナー。 この背景色を宣言する別の方法はありますか？

134 svg 

SVGファイルをHTML5キャンバスに描画するデフォルトの方法はありますか？Google ChromeはSVGを画像としてロードすることをサポートしています（そして単にを使用していますdrawImage）が、開発者コンソールはそれを警告していresource interpreted as image but transferred with MIME type image/svg+xmlます。 （この質問のように）SVGをキャンバスコマンドに変換する可能性があることは知っていますが、それが必要ないことを願っています。私は古いブラウザは気にしません（つまり、FireFox 4とIE 9が何かをサポートするなら、それで十分です）。

130 html  canvas  svg 

すべてのデバイスのレスポンシブデザインで見栄えを良くするために、ウェブサイトにSVGロゴを使用したいと考えています。 ただし、問題があるため、できるだけ多くのデバイスとブラウザをサポートしたいと考えています。ロード速度も重要な考慮事項です。Adobe Illustratorのエクスポート設定は、これらすべてにどのように適合しますか？ Illustratorには、SVGエクスポートのオプションがいくつかあります。まず、どのSVGプロファイルが最適ですか？ SVG Tinyの方がファイルサイズが小さいと思いますか？多くのデバイスがSVG Tinyをサポートしていますか？最も重要な違いは何ですか？（このW3モンスターを読む必要はありません。） 次に、画像の場所の最適なオプションは「リンク」だと思いますか？（感嘆符の後の説明を参照してください。） または、ブラウザは「埋め込み」オプションをどのようにサポートしていますか？ ありがとうございました！ PSフォールバックalpha-PNGオプションがありますが、SVGを可能な限りサポートする必要があります。（考えてみてください。JPGのようなフォールバックオプションは、alpha-PNG自体が古いIEのソリューションを必要とするため、おそらくこの場合に最適です。） 更新：構成可能なオプションがさらにあります。私はテキストを扱っていないので、私が見る唯一の関連するものは小数点以下です。ロゴの場合、最大200x200px（Retinaディスプレイでは400x400px）として表示されるものは、「3」が最適な設定ですか？または「2」でファイルサイズを最小化しますか？

128 html  css  image  svg  adobe-illustrator