HTML5のInline SVGをJavaScriptで操作 (1/5)
HTML5で手軽に扱えるようになったSVG（Scalable Vector Graphics）。前回は、Inline SVG（インラインSVG）で基本的な図形を描く方法を解説しました。今回は、HTML5文書内に埋め込まれたインラインSVGをJavaScriptで制御します。 JavaScriptでSVG要素にアクセスする 最初に、制御対象となるSVGデータを作成しましょう。JavaScriptで制御したいSVG要素にはid属性を記述し、ID名を付けておきます。通常のHTMLタグ（要素）にID名を指定する場合とまったく同じです。たとえば<rect>（四角形）を制御したい場合は以下のように記述します（ID名は任意）。 <svg> <rect id="myBox" x="0" y="0" fill="red" width="100" height="80" /> </svg> ID名を指定してお
第1回 SVGの基礎知識 | gihyo.jp
SVGは比較的古くからある仕様の1つですが、2010年3月にマイクロソフトがInternet Explorer 9でのサポートを表明してから一気に注目が高まりました。そんな古くて新しいSVGを今から使える情報と、将来の展望を全4回の集中連載で解説します。 SVGとは SVG（Scalable Vector Graphics）は、XMLベースのベクターグラフィック言語もしくは画像フォーマットです。W3Cによってその仕様が定義されており、画像フォーマットとして用いる場合は拡張子.svgが使用され、MIME形式はimage/svg+xmlが用いられます。 SVGの現状 Firefox、Safari、Google Chrome、Operaなどのブラウザが既にサポートしており、Internet Explorerもそのバージョン9、具体的にはInternet Explorer 9: Platform
名前空間の速修講座 - SVG: スケーラブルベクターグラフィック | MDN
XML の派生言語として、 SVG は名前空間付けられています。もしあなたが SVG コンテンツを作成する予定なら名前空間の概念と使い方を理解することは重要です。 Firefox 1.5 リリースより前の幾つかのバージョンの SVG ビューワは残念ながら名前空間に対して十分な注意を払いませんが、 とても厳格でなくてならない Gecko ベースのブラウザのようなユーザエージェントが複数の XML 派生言語をサポートするために不可欠です。今、名前空間を理解するためにいくらかの時間をとり、将来頭を悩ませる時間を節約しましょう。 異なった種類の XML ベースのコンテンツが同じ XML ファイルの中で一緒に混ざるのを可能にするのことは W3C の長年の目標です。 例えば、SVG と MathML は直接 XHTML ベースの科学ドキュメントに組み込まれるかもしれません。このようなコンテンツ タイプ
Scalable Vector Graphics (SVG) 2 (W3C Working Draft 28 August 2012)
Scalable Vector Graphics (SVG) 2 W3C Candidate Recommendation 04 October 2018 This version: https://www.w3.org/TR/2018/CR-SVG2-20181004/ Latest version: https://www.w3.org/TR/SVG2/ Previous version: https://www.w3.org/TR/2018/CR-SVG2-20180807/ Editors draft https://svgwg.org/svg2-draft/ Single page version: https://svgwg.org/svg2-draft/single-page.html GitHub repository: https://github.com/w3c/svg
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
