SVG

SVGは、XMLを基盤とした2Dベクター画像記述言語。画像を線・面といった図形の集合体として扱うベクター画像のため、環境に適した表示が可能です。アニメーション機能もサポートされており、簡単なインタラクティブコンテンツ作成もできます。

RSS

  • 受付中

    回答
    3

    ブラウザにSVG要素で描画しPNG画像に変換するプログラムを組みたいのですが、SVGをPNG画像に変...

    ブラウザにSVG要素で描画したものを、PNG画像に変換したいです。 環境はMac、エックスサーバーです。 SVG要素で描画はできたのですが、PNGに変換するのが、どうやればできるのかわかりません。 PHPのimagickというのをインストールしたのですが、Xサーバーで使うにはどうすれば良いのでしょうか? プログラムでSVG要素の描画をPNGに変換でき

    • 0評価
    • 99PV
    chibi chibi 1週間前
  • 受付中

    回答
    1

    pdf2svg: PDFをSVGに変換するとPDF上の画像が一部黒くなったり、ページが丸ごと描画され...

    前提・実現したいこと PDFを一ページずつSVGに変換したい pdf2svg以外にも、変わらない変換速度で良い変換方法(パッケージ)があれば知りたい ※ 但し、セキュリティと費用の観点から、外部サーバーにファイルを投げるような「ファイル変換サービス」は使用できない 以降の調査方法を知りたい ※ 依存しているであろうパッケージのバージョン比

    • 0評価
    • 23PV
    CyberMergina CyberMergina 5日前
  • 解決済

    回答
    1

    svg要素に対してsvgでマスクしてループアニメーションしたい

    マスクされる要素 <svg width="399" height="77" viewBox="-855 -699 399 77" xmlns="http://www.w3.org/2000/svg"> <path d="M-854.84-696.8h25.376l15.6 25.584 15.6-25.584h25.376v72

    • 0評価
    • 58PV
    goroo 退会済みユーザー 2週間前
  • 受付中

    回答
    1

    SVGで、フォントの特徴を残したまま書き文字アニメーションをさせたい

    前提・実現したいこと https://draft.co.jp/ こちらのサイトで実装されている 書き文字アニメーションについての質問です。 参考サイトのトップに出てくる(ALL HAPPY BY DESIGN)の文字のように、 フォントの持っている線の強弱やインクのハネのような意匠をのこしたまま 書き文字アニメーションさせる方法が分からず困っ

    • 0評価
    • 380PV
    daima4657 daima4657 1ヶ月前
  • 解決済

    回答
    1

    リンク付きSVG画像をiosで正しく表示させたい。

    前提・実現したいこと 下記のリンク付きsvg画像ですが、iosでリンクがなくなります。 PCではリンクが正しく付きます。 これの対応策をご教授いただければ幸いです。 <a href="#"><img src="img/pcasset/001logo.svg"></a>

    • 0評価
    • 66PV
    tet tet 1ヶ月前
  • 受付中

    回答
    1

    SVGアニメーションで滑らかに描画されずコマ送りのようになる。

    SVGアニメーションを滑らかに表示する http://www.tam-tam.co.jp/tipsnote_sample/uenaka/151207/index2.html こちらのsvgアニメーションのように滑らかに処理をしたいです。 コードの内容はほぼそのままでvaluesの値のみイラレから書き出した実装したい形に書き換えたのですがコマ送りのような

    • 0評価
    • 210PV
    CJCJ CJCJ 6ヶ月前
  • 解決済

    回答
    1

    ノード同士で結ばれている辺の太さを変更したい

    前提・実現したいこと jsonファイルを読み出しD3.jsを使ってグラフを書いています。 { "nodes":[ {"name":"0"}, {"name":"1"} ], "links":[ {"source":0, "target":1} ] } このJSONファイルを読み出したとき,下の図のように0から1に向かうようにしています。 こ

    • 0評価
    • 118PV
    nano-dia nano-dia 3ヶ月前
  • 解決済

    回答
    2

    SVGを画像として書き出した際のfont-familyが反映されない

    SVGで外部フォント(google fonts)をtext要素に使用した際、 表示は問題なくされるのですが、そのSVGを画像としてダウンロードしてもfont-familyの設定がデフォルトになってしまいます。 設定したfont-familyそのままの表示で画像にするのは不可能なのでしょうか? 方法があればご教授いただければとおもいます。 ht

    • 0評価
    • 128PV
    nao5151 nao5151 3ヶ月前
  • 受付中

    回答
    1

    wordpress4.6.1 svgファイルを許可するためのfunctions.phpカスタマイズ ...

    【wordpress4.6.1 svgファイルを許可するためのfunctions.phpカスタマイズ → 効きません!】 svgファイルをwordpressで許可するため。 子テーマのfunctions.php に下記コードを貼り付けてみたのですが、 下記、4種類のコードともNGでした。 (メディアのアップロード時に、 ”このファイルタ

    • 0評価
    • 176PV
    hitoekiaruko hitoekiaruko 3ヶ月前
  • 解決済

    回答
    1

    jQueryで読み込んだ外部SVGをuseでも表示させたい

    jQueryで読み込んだ外部SVGをuseでも表示させたい jQueryとSVGでアバター作成ページを作ろうとしています。 外部SVGは表示できたのですが、useには表示されません。 該当のソースコード <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-

    • 1評価
    • 324PV
    xxx_XXX_xxx xxx_XXX_xxx 3ヶ月前
  • 解決済

    回答
    1

    svgファイルの画像でマスクをかける

    前提・実現したいこと 単純に長方形の画像に対してsvgファイルで作成した画像(角丸四角形)で切り抜いたようなマスクをかける作業を、全てのブラウザで適用されるようにしたいです。(※添付画像参照) 画像は任意の数多くの四角形画像に適用する必要があります。 もしsvg画像でのマスク(クリッピング?)が無理でしたら、代替案があればご提案いただければ幸いです

    • 0評価
    • 227PV
    x17kusyr x17kusyr 3ヶ月前
  • 解決済

    回答
    1

    SVGで装飾付きのアナログ時計を作りたい(Snap.svg)

    お世話になります。 概要 ただいまSVGで「秒針が進む度に、一番外側の枠が1目盛りづつ増えるアナログ時計」を作ろうとしています。 使用しているのはSnap.svgです。 ソースコード 現状のコードは以下となります。 <!-- analog_watch.html --> <!DOCTYPE html> <html lang="j

    • 0評価
    • 458PV
    manzyun manzyun 4ヶ月前
  • 受付中

    回答
    0

    メニューバーをSVGのButtomで表したい。

    <div id="nav_buttom"> <svg width= "1500" height= "65" > <g id="menu_buttom" Class="" weght="100" hight="65"> <line x1="30" y1="31" x2="55" y2="31" stroke="black" str

    • -6評価
    • 179PV
    lars_fox lars_fox 5ヶ月前
  • 受付中

    回答
    0

    gulpにてsvgスプライトを自動化したい

    前提・実現したいこと gulpにてsvgスプライトを自動化したいのですが エラーが発生しています。 発生している問題・エラーメッセージ SyntaxError: Unexpected token = at exports.runInThisContext (vm.js:53:16) at Module._compile (modu

    • 0評価
    • 207PV
    ruuusaamarki ruuusaamarki 6ヶ月前
  • 受付中

    回答
    1

    SVG画像の内部の塗りつぶす

    前提・実現したいこと このサイトで多数のSVG画像をダウンロードできます。 ダウンロードした画像の内部の塗りつぶしをすべて白にすることで、「塗り絵」をしたいと考えています。 http://publicdomainvectors.org/ 質問 SVG画像の内部の塗りつぶしをすべて白にする簡単な方法はないでしょうか。

    • 0評価
    • 179PV
    araposama araposama 6ヶ月前
  • 受付中

    回答
    0

    SVGアニメーションの処理落ちについて

    現状 snap.svgを使用し、svgの中に読み込んだラスタ画像をマスクしており、 そのラスタ画像を3枚重ねて表示させ、opacityで透過させ、順番に表示という処理を行っています。 発生している問題 Chrome、IEではスムーズに表示されるのですが、 FireFox、Safariでコマ落ちのような現象が起きてしまいます。 develope

    • 0評価
    • 384PV
    mountain mountain 7ヶ月前
  • 解決済

    回答
    1

    Font Awesomeのsvgファイルから1画像だけ抜き出して利用したい

    Font Awesomeを利用して、アイコンを表示しようとしています。 クライアントの都合で、<input type="button">にアイコンを出す必要があり、かつinputのvalueにはシステムのサニタイズのためか、\f061や&#xf061;は使用できないため、inputのbackgroundにsvgを表示する方法を検討しています。 F

    • 0評価
    • 402PV
    solight solight 7ヶ月前
  • 受付中

    回答
    1

    htmlでクリックして展開する折りたたみメニューをつくりたい。

    こんにちは。 htmlでクリックで展開する折りたたみメニューを作りたいです。 さきにsvgで作ったものの中に追加したいのですがうまくいきません。 助けてください。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <me

    • 0評価
    • 949PV
    Tan3 Tan3 9ヶ月前
  • 受付中

    回答
    2

    svgでアニメーションをつくったのだが、htmlに挿入の仕方がわからない

    svgアニメーションをhtmlに挿入したい イラレで作ったsvgをLazy Line Painterというサイトでアニメーションに変換しました。ここで作ったファイルをhtmlに挿入したいのですが、どこにいれたらいいのかわかりません。 下のサイトを参考にしました。 SVGとjQueryで絵を描いているようなアニメーションを実装する方法 助けてく

    • 0評価
    • 543PV
    Tan3 Tan3 9ヶ月前
  • 解決済

    回答
    1

    svgのテキストを中央に表示したい。(text-align: center)、(margin:0 a...

    内容を修正致しました。わかりづらく申し訳ございません。 いつもお世話になっております。どうかご教授下さい。 現在SVGでテキストを表示させているのですが、ウィンドウを可変してもx,yの座標を決めている為、当然ながら中央揃えになりません。 <div class="gradient_bg mask"> </div> <svg> <clipPat

    • 0評価
    • 1070PV
    LanHma LanHma 10ヶ月前
1

タグ情報

  • あなたの順位

    -

  • タグ登録者数

    14

  • 総質問数

    25

  • 今週の質問数

    1

関連するタグ

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る