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

出自六年制學程
跳轉到: 導覽搜尋
矩陣基本演算規則
矩陣基本演算規則
第 16 行: 第 16 行:
 
</td><td>=</td><td>
 
</td><td>=</td><td>
 
<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=''>x<sup>'</sup><br/>yx<sup>'</sup></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=''>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>
 +
==SVG transform 矩陣變換==
 +
===(○)基本===
 +
<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=''>a c e<br/>b d f<br/>0 0 1</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<br/>1</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=''>ax+cy+e<br/>bx+dy+f<br/>1</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><br/>1</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr>
 
</table>
 
</table>
 
</td>
 
</td>
 
</tr></table>
 
</tr></table>

2017年12月9日 (六) 13:55的修訂版本

矩陣基本演算規則

a b
c d
x
y
=
ax+by
cx+dy
=
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