SVG/transform/matrix:修訂版本之間的差異

出自六年制學程
跳轉到: 導覽搜尋
矩陣基本演算規則
矩陣基本演算規則
第 13 行: 第 13 行:
 
<table style='border:none;'>
 
<table style='border:none;'>
 
<tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>ax+by<br/>cx+dy</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 
<tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>ax+by<br/>cx+dy</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 +
</table>
 +
</td><td>=</td><td>
 +
<table style='border:none;'>
 +
<tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<sup>'</sup><br/>y<sup>'</sup></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 +
</table>
 +
</td>
 +
</tr></table>
 +
====旋轉====
 +
<table style='border:none;'><tr>
 +
<td>
 +
<table style='border:none;'>
 +
<tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>cosθ -sinθ<br/>sinθ cosθ</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 +
</table>
 +
</td><td>
 +
<table style='border:none;'>
 +
<tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 +
</table>
 +
</td><td>=</td><td>
 +
<table style='border:none;'>
 +
<tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>cosθx-sinθy<br/>sinθx+cosθy</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 
</table>
 
</table>
 
</td><td>=</td><td>
 
</td><td>=</td><td>

2017年12月14日 (四) 07:26的修訂版本

矩陣基本演算規則

a c
c d
x
y
=
ax+by
cx+dy
=
x'
y'

旋轉

cosθ -sinθ
sinθ cosθ
x
y
=
cosθx-sinθy
sinθx+cosθy
=
x'
y'

SVG transform 矩陣變換

(○)基本

a c e
b d f
0 0 1
x
y
1
=
ax+cy+e
bx+dy+f
1
=
x'
y'
1