svgアニメーションの学習関連

3535 ワード

一、svg関連
1.主なラベル
1)長方形
stroke-widthプロパティは、長方形の枠線の幅を定義します.
strokeプロパティは、長方形の枠線の色を定義します.
opacityプロパティは、要素全体の透明値を定義します(合法的な範囲は:0-1).
rxおよびryプロパティは、長方形にフィレットを生成します.
2)円形
cy,cx円心座標のデフォルト(0,0);
r半径.
3)楕円
rx水平半径;
ry垂直半径.
4)ライン
x 1 y 1開始座標;
x 2 y 2座標を終了します.
説明:lineで描かれている図形は折れ線ではなく直線なので、x 3はありません.y 3属性==3番目の点はありません.
5)折れ線
pointsプロパティは、ポリゴンの各角のx座標とy座標を定義します.
6)多角形
栗を挙げます.


7)経路
M = moveto
L = lineto
H = horizontal lineto
V = vertical lineto
C = curveto
S = smooth curveto
Q = quadratic Belzier curve
T = smooth quadratic Belzier curveto
A = elliptical Arc
Z = closepath
大文字は絶対位置、小文字は相対位置です.
公式サイトの栗を持ってきてください.

8)各種フィルター
公式サイト栗:






2.3つの方法の外部アクセスsvg
1)ラベルはすべての主流のブラウザでサポートされ、スクリプトの使用が許可されている.
注記:HTMLページにSVGを埋め込むときにラベルを使うのはAdobe SVG Viewerが推奨する方法です!ただし、合法的なXHTMLを作成する必要がある場合は使用できません.どのHTML仕様にもラベルはありません
構文:
type="image/svg+xml"
pluginspage="http://www.adobe.com/svg/viewer/install/"/>
2)タグはHTML 4の標準タグであり、すべての新しいブラウザでサポートされている.その欠点は、スクリプトの使用が許可されていないことです.
注記:最新バージョンのAdobe SVG Viewerをインストールした場合、ラベルを使用するとSVGファイルが動作しません(少なくともIEでは動作しません).
構文:
type="image/svg+xml"
codebase="http://www.adobe.com/svg/viewer/install/"/>
3)ラベルはほとんどのブラウザで動作します.

構文: